如何在过滤器中添加索引值

Question

假设我有一个看起来像这样的数组对象

常量选项 = [{ 标签： ”” }, { 标签：“123” }]

现在，我想过滤它并删除 label 值等于 "" 的对象，然后将与索引等效的 order 属性添加到具有标签值的数组中的那些对象

我可以结合使用 lodash 过滤器和地图，但我在想是否可以以更好的方式来做（可能只使用过滤器？）

    const options = _.filter(options, "label").map(
      (option, position) => {
        return {
          ...option,
          order: position
        }
      }
    )

Answer 1

我个人认为您现在拥有的内容很好，因为它的可读性很强。一种不同的想法可能是改用_.flatMap()，它只需要对options 数组进行一次迭代。如果标签存在于对象中，则您可以返回修改后的对象。如果标签不存在，那么您可以返回一个空数组。当您为返回的每个值展平结果数组时，空数组将不会包含在结果数组中。

const options = [{ label: "" }, { label: "123" }];
const res = _.flatMap(options, (o, order) => o.label ? {...o, order} : []);
console.log(res);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>

注意：你也可以使用香草版的.flatMap()，所以你不需要使用lodash，除非你需要良好的浏览器支持或者将它用于其他代码。

Answer 2

另一种纯 JS 解决方案可能是：

const options = [{ label: "" }, { label: "123" }];
const modified = options.filter((el) => el.label.length).map((option, i) => ({ ...option, order: i }));
console.log(modified);

Answer 3

据我了解，您可以使用纯 js 过滤器：

const options = [{
  label: ""
}, {
  label: "123"
}]
var index = 0;
const res = options.filter((e, i) => {
  e = Object.assign(e,{});
  if (e.label) {
    e.order = index++;
    return e;
  }
})
console.log(res)

编辑： 您还可以使用 map 和 new 数组来调用一个函数并保持源代码纯净：

const options = [{
  label: ""
}, {
  label: "123"
}]


var newArr = [];
options.map((e,r)=>{
    if(e.label){
        newArr.push({...e,order:newArr.length});
    }
})

console.log(options)
console.log(newArr)