我有一个对象数组,我想对其进行迭代以生成一个新的过滤数组。同时,我还需要根据参数从新数组中过滤出一些对象。我试着这样做:

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

这是个好方法吗?有没有更好的方法?我愿意使用任何库,如lodash。


当前回答

你可以使用数组。Reduce带有箭头的函数是一行代码

Const选项= [ {name: 'One', assigned: true}, {name: 'Two',赋值:false}, {name: 'Three',赋值:true}, ]; Const reduced = options。Reduce ((result, option) =>选项。分配?结果。concat({name: option.name, newProperty: 'Foo'}): result, []); . getelementbyid(“输出”)。innerHTML = JSON.stringify(简化); <h1>仅分配选项</h1> <pre id="output"> </pre> .

其他回答

同时执行filter + map的最有效方法是将数据作为泛型可迭代对象处理,并同时执行这两件事。在这种情况下,您最多只需要浏览一次数据。

下面的例子是使用iter-ops库,并做到了这一点:

import {pipe, filter, map} from 'iter-ops';

const i = pipe(
    inputArray,
    filter(value => value === 123), // filter on whatever key you want
    map(value => /* any mapping here*/) // remap data as you like
);

// i = iterable that can be processed further;

console.log([...i]); //=> list of new objects

上面,我说的是最多,因为如果你对iterable结果应用进一步的逻辑,比如限制映射项的数量,例如,你最终会迭代对象列表甚至少于一次:

const i = pipe(
    inputArray,
    filter(value => value === 123), // filter on whatever key you want
    map(value => /* any mapping here*/), // remap as you like
    take(10) // take up to 10 items only
);

在上面,我们进一步限制迭代,一旦生成了10个结果项就停止,因此我们对数据的迭代少于一次。这是最有效的了。

更新

我被要求补充为什么这种解决方案比减少更有效,所以就是这样……

数组的约简是一个有限的操作,它遍历完整的数据集,以产生结果。因此,当您需要对输出数据进行进一步处理时,您将最终生成一个新的迭代序列,等等。

当您有一个复杂的业务逻辑要应用到一个序列/可迭代对象时,将该逻辑链接起来总是更有效的,而只遍历序列一次。在许多情况下,您最终会对一个序列进行复杂的处理,甚至一次都不遍历完整的数据集。这就是可迭代数据处理的效率。

附注:我是上述图书馆的作者。

使用Array.prototype.filter:

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

使用reduce,你可以在一个数组中做到这一点。函数原型。这将从数组中获取所有偶数。

Var arr = [1,2,3,4,5,6,7,8]; Var BRR = arr。Reduce ((c, n) => { 如果(n % 2 !== 0) { 返回c; } c.push (n); 返回c; },[]); . getelementbyid(“mypre”)。innerHTML = brr.toString(); <h1>获取所有偶数</h1> <pre id="mypre"> </pre>

您可以使用相同的方法并将其泛化到您的对象,如下所示。

var arr = options.reduce(function(c,n){
  if(somecondition) {return c;}
  c.push(n);
  return c;
}, []);

Arr现在将包含筛选过的对象。

与顶部答案相同的方法,使用Array.prototype.reduce(),但使用了更新的ES6语法和TypeScript类型,作为通用实用函数:

function filterThenMap<T>(l: T[], predicate: (el: T) => boolean, transform: (el: T) => T) {
  return l.reduce((res: T[], el) => {
    if (predicate(el)) {
      res.push(transform(el));
    }
    return res;
  }, []);
}

从2019年开始,Array.prototype.flatMap是一个不错的选择。

options.flatMap(o => o.assigned ? [o.name] : []);

从MDN页面上方链接:

flatMap可以作为一种添加和删除项目的方法(修改 项目数目)在一个地图。换句话说,它允许您进行映射 多项对多项(通过分别处理每个输入项), 而不是总是一对一。在这个意义上,它就像 filter的反义词。只需返回一个1元素的数组来保存该项, 用于添加项的多元素数组,或用于删除项的0元素数组 的项目。