Konvertieren Sie das Objekt in ein Array von Schlüsselwertobjekten wie `{ name: “Apple”, value: “0.6” }`

Question 1

Ich habe ein Objekt wie dieses:

const total = {
    "Apple": 0.6,
    "Banana": 0.6,
    "Orange": 1,
    "Grapes": 0.4,
    "Pineapple": 0.4
  };

Jetzt möchte ich es in ein Array von Schlüssel-Wert-Objekten konvertieren, wobei jedes Objekt denselben Satz von zwei Eigenschaften hat, "name" und "value"die den Schlüssel bzw. den Wert jeder Eigenschaft des ursprünglichen Objekts enthalten:

[
  { "name": "Apple", "value": 0.6 },
  { "name": "Banana", "value": 0.6 },
  { "name": "Orange", "value": 1 },
  { "name": "Grapes", "value": 0.4 },
  { "name": "Pineapple", "value": 0.4 }
]

Question 2

Sie können verwenden Array#map Funktion auf den Objekttasten und erstellen Sie Ihre Objekte mit der gewünschten Form.

const total = { 
    'Apple': 0.6,
    'Banana': 0.6,
    'Orange': 1,
    'Grapes': 0.4,
    'Pineapple': 0.4 
};
              
const array = Object.keys(total)
                    .map(key => ({ name: key, value: total[key] }))
                    .sort((f, s) => f.value - s.value);

console.log(array);

Wenn du benutzt ES7 oder höher können Sie ersetzen Objekt#Schlüssel mit Objekt#Einträge. Verwenden Sie auch Objektdestrukturierung in der Parameterliste zu bekommen name und value separat.

const total = { 
    'Apple': 0.6,
    'Banana': 0.6,
    'Orange': 1,
    'Grapes': 0.4,
    'Pineapple': 0.4 
};
              
const array = Object.entries(total)
                    .map(([name, value]) => ({ name, value }))
                    .sort((f, s) => f.value - s.value);;

console.log(array);

Question 3

 const result = Object.entries(total).map(([name, value]) => ({name, value}));

Question 4

Array#reduce kann auch verwendet werden, um “Objekt im Schlüsselwertformat in Array einzufügen”:

var total = { 'Apple': 0.6, 'Banana': 0.6, 'Orange': 1, 'Grapes': 0.4, 'Pineapple': 0.4 };

var objArr = Object.entries(total)
                   .reduce((accumulator, [name, value]) => {
                      return accumulator.concat({name: name, value: value});  // creates an array of objects
                     }, [])
                   .sort((a, b) => b.value - a.value);  // sorting in descending order

console.log(objArr);

Für weitere Informationen lesen Sie Object#entries, Array#sort und object destructuring.