迭代对象数组并更改每个对象中的一个属性

时间:2017-02-17 20:05:00

标签: javascript ecmascript-6 spread-syntax

我发现自己有很多这种模式。我有一个从api返回的对象数组,我需要操作所有对象中的一个属性。

有没有办法使用ES6 / Babel或Typescript来使该模式更具说明性?

寻找一些巧妙的解构技巧或类似的东西。



restConfiguration()
   .host("localhost")
   .port(8081);




5 个答案:

答案 0 :(得分:11)

使用Stage 3 preset在Babel中提供的对象传播(...)可以解决问题:



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);




答案 1 :(得分: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: o.foo + 1}))

console.log(result);




答案 2 :(得分:1)

对于原位版本,您可以在对象的键上使用闭包,并将该对象作为参数。



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);




答案 3 :(得分:0)

怎么样:



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




答案 4 :(得分:0)

这不完全等同于:

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);