Let's say you have the following array,
假設您有以下數組,
const nums = [1, 2, 3, 4, 5];
console.log(nums);
Output
輸出量
(5) [1, 2, 3, 4, 5]
We know that nums is an array and we can see in the output that we get an array. Let's convert it into an object,
我們知道nums是一個數組,我們可以在輸出中看到得到一個數組。 讓我們將其轉換為對象
console.log(Object.assign({}, nums));
Output
輸出量
{0: 1, 1: 2, 2: 3, 3: 4, 4: 5}
Now we get an object displayed on the console!
現在,我們在控制臺上顯示了一個對象!
Let's see how the Object.assign() method works? The Object.assign() method is built on top of the object class and it takes in two parameters; the target and the source respectively. It copies all values from the source to the target. Let's see some more examples,
讓我們看看Object.assign()方法如何工作? Object.assign()方法建立在對象類的頂部,它具有兩個參數: 目標和源。 它將所有值從源復制到目標。 讓我們再看一些例子
const arr=[
{name:'harry', age:14},
{name:'sam', age:40},
{name:'gloria', age:16},
{name:'riky', age:33},
]
console.log(arr);
Output
輸出量
(4) [{…}, {…}, {…}, {…}]
0: {name: "harry", age: 14}
1: {name: "sam", age: 40}
2: {name: "gloria", age: 16}
3: {name: "riky", age: 33}
length: 4
__proto__: Array(0)
We have an arr array that contains objects as individual elements. In essence, we have an array of objects. We'll use the object.assign() method to convert this array of objects into an object of objects.
我們有一個arr數組,其中包含對象作為單個元素。 本質上,我們有一個對象數組。 我們將使用object.assign()方法將該對象數組轉換為對象對象。
const namesObj = Object.assign({}, arr);
console.log(namesObj);
Output
輸出量
{0: {…}, 1: {…}, 2: {…}, 3: {…}}
0: {name: "harry", age: 14}
1: {name: "sam", age: 40}
2: {name: "gloria", age: 16}
3: {name: "riky", age: 33}
__proto__: Object
Now we get back an object of objects! It's pretty simple to use Object.assign() for these types of conversions but it's more important to understand what's going on and how under the hood. Can you think of the internal difference between an array and an object? Now, can you figure out how to write a function that takes in an object and converts it to an array?
現在我們取回對象的對象! 對于這些類型的轉換,使用Object.assign()非常簡單,但更重要的是要了解發生了什么以及如何進行內幕。 您能想到數組和對象之間的內部差異嗎? 現在,您能找出如何編寫一個將一個對象接收并轉換為數組的函數的方法嗎?
Let's see how we'll implement our function that is capable of converting an array to an object. We need two things- a key and a value. Let's assume that we will send across the key as a parameter to our function which we will use as the key for our new object.
讓我們看看如何實現將數組轉換為對象的函數 。 我們需要兩件事-密鑰和值。 假設我們將鍵作為參數傳遞給函數,并將其用作新對象的鍵。
const convertArrtoObj = (arr, key) => {
};
Now we'll create an empty object which we'll fill with elements from our array. We'll use the reduce() method to traverse through the array and put the current value against a key.
現在,我們將創建一個空對象,該對象將填充數組中的元素。 我們將使用reduce()方法遍歷數組并將當前值放在鍵上。
const convertArrtoObj=(arr,key)=>{
const initObj={};
return arr.reduce((obj,currVal)=>{
return{
...obj,
[currVal[key]]:currVal
}
},initObj);
};
const newnamesObj=convertArrtoObj(arr,'age');
console.log(newnamesObj);
Output
輸出量
{14: {…}, 16: {…}, 33: {…}, 40: {…}}
14: {name: "harry", age: 14}
16: {name: "gloria", age: 16}
33: {name: "riky", age: 33}
40: {name: "sam", age: 40}
__proto__: Object
We converted our original names array to an object using the age of each person as the key.
我們使用每個人的年齡作為鍵將原始名稱數組轉換為對象。
翻譯自: https://www.includehelp.com/code-snippets/convert-an-array-to-an-object-in-javascript.aspx