迭代對象數組並更改每個對象中的一個屬性

Question

我發現自己經常遇到這種模式。 我有一組從我的 api 返回的對象，我只需要操作所有對象中的一個屬性。

有沒有辦法使用 ES6/Babel 或 Typescript 使該模式更具聲明性？

尋找一些巧妙的解構技巧或類似的東西。

 const data = [{ foo: 1, bar: 2}, { foo: 2, bar: 3}, { foo: 3, bar: 4}]; const increment = a => a + 1; // Here is my typical pattern const result = data.map(o => { o.foo = increment(o.foo); return o; }) console.log(result);

Answer 1

在 Babel 中使用Stage 3 preset可以使用 Object spread ( ... ) 來解決這個問題：

 const data = [ { foo: 1, bar: 2 }, { foo: 2, bar: 3 }, { foo: 3, bar: 4 }, ]; const increment = a => a + 1; const result = data.map(o => ({ ...o, foo: increment(o.foo) })); console.log(result);

Answer 2

我認為這更優雅一些 - Object.assign 是更新對象中項目的好方法

 const data = [{ foo: 1, bar: 2 }, { foo: 2, bar: 3 }, { foo: 3, bar: 4 }]; const increment = a => a + 1; // Here is my typical pattern const result = data.map(o => Object.assign(o, {foo: increment(o.foo)})) console.log(result);

Answer 3

對於原位版本，您可以在對象的鍵上使用閉包並將對象作為參數。

 const data = [{ foo: 1, bar: 2 }, { foo: 2, bar: 3 }, { foo: 3, bar: 4 }]; const increment = k => o => o[k]++; data.forEach(increment('foo')); console.log(data);

Answer 4

關於什么：

 data.map(d => ( Object.assign({}, d, {foo: d.foo + 1}) ));

Answer 5

這一切不完全等同於：

 const data = [{ foo: 1, bar: 2 }, { foo: 2, bar: 3 }, { foo: 3, bar: 4 }]; const result = data.slice(); result.forEach(e => e.foo++); console.log(result);