javascript - 如何防止map函数返回null

Question

我有一个称为语言的对象列表。 如果语言对象有 alpha2 它应该返回 { label: i.name, value: i.alpha2 } 。 如果它没有 alpha2 它应该返回 null 。

languages.all.map((i,index) =>  i.alpha2 ? { label: i.name, value: i.alpha2 } : null )

但是如果我将其传递给我的 react 组件，我会得到一个错误:未定义不是对象。 所以我不想将 null 传递给由 language.all.map 创建的数组，我想跳过在数组中传递某些内容的过程。

我怎样才能做到这一点？

Answer 1

由于映射返回调用数组中每个元素的结果，因此您可以过滤null:

languages.all.map((i,index) =>  i.alpha2 ? { label: i.name, value: i.alpha2 } : null )
             .filter(i => i);

OR:在单次迭代中使用 reduce() 效果更好

languages.all.reduce(function(acc, cur) {
  if (cur.alpha2) {
    var o = { label: cur.name, value: cur.alpha2 };
    acc.push(o);
  }
  return acc;
}, []);