时间戳

首页 > 解决方案 > .map() 将不需要的未定义值存储到新数组中

javascript - .map() 将不需要的未定义值存储到新数组中

问题描述

简单的数组声明：

let sodas = ["Sprite", "Coke", "Mountain Dew", "Dr. Pepper", "Sunkist"];

我想使用.map()函数创建一个包含仅由可口可乐公司拥有的苏打水的新数组，然后在控制台中显示这个新数组 -

let cocacola_sodas = sodas.map(soda => {
  if ((soda == "Coke") || (soda == "Sprite")) {
    return soda;
  }
})

console.log(cocacola_sodas);

这段代码似乎有效，但我不确定为什么cocacola_sodas当只返回 2 个新元素（可乐和雪碧）时它会将 5 个新元素返回到数组中。数组将显示["Sprite", "Coke", undefined, undefined, undefined]。为什么它返回未定义的值？

标签： javascriptarraysfunctionreturn

解决方案

@awoldt，为了帮助您了解实际发生的情况，Array.prototype.map将始终将相同数量的元素从输入数组返回到新数组。

所以最好的考虑方法是给 map 一个包含 x 个元素的数组，不管你对传递给 map 的块内的那些元素做了什么，它总是会返回新数组中的 X # 个元素。

正如所建议的那样，像 filter/reduce 这样的东西将返回一个新数组，其中仅包含满足您在他块中设置的标准的元素传递给这些助手

您可以在 MDN https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map阅读更多关于 map 和所有 Array.prototype.methods 的信息

推荐阅读