web-dev-qa-db-ja.com

オブジェクトの配列を反復処理し、各オブジェクトの1つのプロパティを変更します

私は自分自身がこのパターンをかなり提示されていることに気づきます。 APIから取得したオブジェクトの配列があり、すべてのオブジェクトのプロパティの1つだけを操作する必要があります。

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);
javascriptecmascript-6spread-syntax
10
Richard.Davenport

オブジェクトの広がり（...） ステージ3プリセット を使用して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);
21
Jordan Running

In situバージョンの場合、オブジェクトのキーに対してクロージャを使用し、オブジェクトをパラメータとして使用できます。

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);
2
Nina Scholz

これはもう少しエレガントだと思います-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
Simon H

これはすべて、次のことと完全に同等ではありません。

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

どうですか：

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