时间戳

首页 > 解决方案 > 为什么这段代码会返回一个未定义值的数组以及其他值？

javascript - 为什么这段代码会返回一个未定义值的数组以及其他值？

问题描述

我正在映射一个数组并使用 switch 语句来 console.log 一些字符串。它记录所有字符串，但也记录一个数组：[undefined, undefined, undefined]. 我不确定为什么它会记录未定义值的数组。是不是因为 map 返回了一个新的值数组，在这种情况下，我要从现有数组中删除值并将它们转换为字符串？

const arr = ['joe', 'paul', 'chris']

const statements = arr.map((name) => {
  console.log(name + ' console!')
  switch (name) {
    case 'joe':
      console.log(name + ' is cool!');
      break;
    case 'paul':
      console.log(name + ' smells!');
      break
    case 'chris':
      console.log(name + ' is cheap!')
      break;
  }
})

console.log(statements);

标签： javascriptswitch-statement

解决方案

.map接受一个数组并返回一个新数组，由对原始数组的每个项目调用回调函数组成。您的回调函数没有返回任何内容，因此statements数组的计算结果为[undefined, undefined, undefined].

.map在这里不合适，因为您不需要映射数组。改为使用forEach，并省略statements变量：

const arr = ['joe', 'paul', 'chris']

arr.forEach((name) => {
  console.log(name + ' console!')
  switch (name) {
    case 'joe':
      console.log(name + ' is cool!');
      break;
    case 'paul':
      console.log(name + ' smells!');
      break
    case 'chris':
      console.log(name + ' is cheap!')
      break;
  }
})

您也可以考虑switch完全避免，因为它不必要地冗长并且容易出错 - 请改用对象：

const arr = ['joe', 'paul', 'chris']

const nameStrs = {
  joe: 'is cool',
  paul: 'smells',
  chris: 'is cheap'
};
arr.forEach((name) => {
  console.log(`${name} ${nameStrs[name]}`);
})

如果您确实想为数组中的每个项目构造一个响应数组，那么.map除了记录值之外，还可以在回调结束时使用并返回该值：

const arr = ['joe', 'paul', 'chris'];

const nameStrs = {
  joe: 'is cool',
  paul: 'smells',
  chris: 'is cheap'
};
const statements = arr.map((name) => {
  const statement = `${name} ${nameStrs[name]}`;
  console.log(statement);
  return statement;
});
console.log(statements);

推荐阅读