2017-10-16 66 views
4

我想談談這個:如何變換數組對象

let myArray = [ {city: "NY"}, {status: 'full'} ]; 

這樣:

let myObj = { city: "NY", status: 'full' }; 

而我嘗試這樣做:

let newObj = {}; 
for (var i = 0; i < myArray.length; i++) { 
    (function(x) { 
    newObj = Object.assign(myArray[i]); 
    })(i); 
} 

它分配最後一對對象

+1

你請求的對象是無效的;你不能有'{{city:'NY'}}' –

回答

11

Spread中的數組轉換成Object#assign

const myArray = [ {city: "NY"}, {status: 'full'} ]; 
 

 
const myObj = Object.assign({}, ...myArray); 
 

 
console.log(myObj);

:分配到一個空對象。如果你省略了空對象,原始數組的第一個元素將會發生變異(所有東西都會被合併到它中)。

+0

是的,這就是我的意思。這是一個錯誤 –

+2

值得注意的是,擴展運算符在IE 11 – zfrisch

+1

中不可用,那麼爲擴展語法使用「Object.assign」是沒有意義的,這在IE11中是不可用的。 –

2

我會傾向於與Ori你的問題似乎是有關創建索引對象通常不是一個很好的計劃達成一致,但如果有必要的與數字鍵,在對象,你可以做這樣的:

let newObj = {}; 
myArray.forEach((val, index) => { newObj[index] = val }); 
+0

是的,這就是我的意思。這是一個錯誤 –

1
let myArray = [ {city: "NY"}, {status: 'full'} ]; 

let newObj = myArray.reduce((acc, curr) => { 
    Object.keys(curr).forEach(val => { 
    acc[val] = curr[val] 
    }) 
    return acc 
}, {}) 

console.log(newObj) 

此語法在IE根據caniuse.com支持

+0

沒有任何上下文的代碼blob不是最好的答案。請考慮擴展此。即使在問題的背景下,也不清楚「IE支持」的含義。 – jdv

+0

'map'不使用結果只是迭代數組的壞模式。你可以使用'forEach'。 –

2

您也可以使用Array.reduce()這將給你更多的精細控制:

const myArray = [ 
 
    { city: "NY", color: 'blue', rodents: { small: false, medium: false, large: true } }, 
 
    { status: 'full', color: 'red' }, 
 
    { sandwich: 'flavourful' } 
 
] 
 
    
 
// item is each object in your array 
 
const reduced = myArray.reduce((newObj, item) => { 
 
    // existing props will be overwritten by newer object entries in the array 
 
    // this example is same as Object.assign spread with right to left precedence, 
 
    // until you want more custom logic 
 
    Object.keys(item).forEach((key) => newObj[key] = item[key]) 
 
    return newObj 
 
}, {}) 
 
    
 
console.log(reduced)

相關問題