配列のマップとフィルタリングを同時に行う 質問する

配列のマップとフィルタリングを同時に行う 質問する

オブジェクトの配列があり、これを反復処理して新しいフィルターされた配列を作成したいと考えています。また、パラメータに応じて新しい配列からいくつかのオブジェクトをフィルター処理する必要もあります。私はこれを試しています:

function renderOptions(options) {
    return options.map(function (option) {
        if (!option.assigned) {
            return (someNewObject);
        }
    });   
}

それは良いアプローチでしょうか? もっと良い方法はありますか? lodash などのライブラリを何でも使用しても構いません。

ベストアンサー1

使用すべきArray.reduceこのために。

var options = [
  { name: 'One', assigned: true }, 
  { name: 'Two', assigned: false }, 
  { name: 'Three', assigned: true }, 
];

var reduced = options.reduce(function(filtered, option) {
  if (option.assigned) {
     var someNewValue = { name: option.name, newProperty: 'Foo' }
     filtered.push(someNewValue);
  }
  return filtered;
}, []);

document.getElementById('output').innerHTML = JSON.stringify(reduced);
<h1>Only assigned options</h1>
<pre id="output"> </pre>


あるいは、リデューサーは次のように純粋関数にすることもできます。

var reduced = options.reduce(function(result, option) {
  if (option.assigned) {
    return result.concat({
      name: option.name,
      newProperty: 'Foo'
    });
  }
  return result;
}, []);

おすすめ記事