七爪源码:从TypeScript中的map()方法中未定义

原标题:七爪源码:从 TypeScript 中的 map() 方法中未定义

当我们忘记在传递给该方法的回调函数中显式返回值时,map() 方法会返回未定义的值。 确保从回调函数返回一个值,以免在数组中获取任何未定义的值。

const nums: number[] = [1, 2, 3];
const newNums = nums.map(num => {
if (num > 2) {
return num + 1;
}
});
console.log(newNums); // 👉️ [undefined, undefined, 4]

该示例仅在满足条件并且 if 块运行时返回一个值。

在所有其他情况下,我们隐式返回 undefined。

为了不从 map() 方法返回未定义的值,您必须从传递给 map() 的回调函数中显式返回一个值。

const nums: number[] = [1, 2, 3];
const newNums = nums.map(num => {
if (num > 2) {
return num + 1;
}
return num;
});
console.log(newNums); // 👉️ [1, 2, 4]

即使不满足 if 条件,我们也会返回一个值。 这解决了回调函数返回未定义的问题。

我们传递给 Array.map 方法的函数被数组中的每个元素调用。

map() 方法返回的数组由回调函数返回的值组成。

如果你不从 TypeScript 中的函数返回值,你会隐式返回 undefined。

function example() {
}
console.log(example()); // 👉️ undefined

这是 map() 方法返回包含未定义值的数组的最常见原因。

您也可能从函数中显式返回未定义的值。

const nums: number[] = [1, 2, 3];
const newNums = nums.map(num => {
return arr[100];
});
console.log(newNums); // 👉️ [undefined, undefined, undefined]

我们从回调函数返回了索引 100 处的数组元素。 数组中不存在索引,因此我们显式返回 undefined。

请注意,您不必使用 return 关键字从箭头函数返回值。 您可以使用速记语法。

const nums: number[] = [1, 2, 3];
const newNums = nums.map(num => num + 1);
console.log(newNums); // 👉️ [2, 3, 4]

如果您可以快速单行计算返回值,则可以直接在箭头 => 之后返回值。

如果使用花括号,则必须显式使用 return 关键字。

要直接返回对象,请将对象括在括号中。

const nums: number[] = [1, 2, 3];
const newNums = nums.map(num => ({myNumber: num + 1}));
console.log(newNums); // 👉️ [{myNumber: 2}, {myNumber: 3}, {myNumber: 4}]

将对象包裹在括号中向函数表明我们直接返回一个对象,而不是仅使用大括号,这将导致函数隐式返回 undefined。

const nums: number[] = [1, 2, 3];
const newNums = nums.map(num => {
myNumber: num + 1;
});
console.log(newNums); // 👉️ [undefined, undefined, undefined]

结论

当我们忘记在传递给该方法的回调函数中显式返回值时,map() 方法会返回未定义的值。 确保从回调函数返回一个值,以免在数组中获取任何未定义的值。

关注七爪网,获取更多APP/小程序/网站源码资源!返回搜狐,查看更多

责任编辑:

event_note 10月 17, 2022

account_box 回国加速器

发表回复