Array.prototype.map()

您所在的位置：网站首页 › sort方法的返回值 › Array.prototype.map()

Array.prototype.map()

2023-09-07 09:04| 来源: 网络整理| 查看: 265

（受到这篇博文的启发）

通常情况下，我们使用只有一个参数（即正在遍历的元素）的回调函数。尽管某些函数可以接受额外的可选参数，但在实际应用中，我们通常只传递一个参数。这种习惯可能会导致一些令人困惑的现象。

考虑下例：

["1", "2", "3"].map(parseInt);

我们期望输出 [1, 2, 3], 而实际结果是 [1, NaN, NaN].

parseInt 函数通常只使用一个参数，但其实可以传入两个参数。第一个参数是表达式，第二个参数是解析该表达式的基数。当在 Array.prototype.map 的回调函数中使用 parseInt 函数时，map 方法会传递 3 个参数：

元素索引数组

parseInt 函数会忽略第三个参数，但是不会忽略第二个参数！这可能会导致一些问题。

以下是迭代步骤的简明示例：

// parseInt(string, radix) -> map(parseInt(value, index)) /* 第一次迭代 (index 是 0): */ parseInt("1", 0); // 1 /* 第二次迭代 (index 是 1): */ parseInt("2", 1); // NaN /* 第三次迭代 (index 是 2): */ parseInt("3", 2); // NaN

下面让我们来讨论解决方案：

const returnInt = (element) => parseInt(element, 10); ["1", "2", "3"].map(returnInt); // [1, 2, 3] // 实际结果是一个数字数组（如预期） // 与上面相同，但使用简洁的箭头函数语法 ["1", "2", "3"].map((str) => parseInt(str)); // [1, 2, 3] // 实现上述目标更简单的方法，同时避免了“骗招”： ["1", "2", "3"].map(Number); // [1, 2, 3] // 但与 parseInt() 不同，Number() 还会返回一个浮点数或（解析）指数表示法： ["1.1", "2.2e2", "3e300"].map(Number); // [1.1, 220, 3e+300] // 为了进行比较，如果我们对上面的数组使用 parseInt(): ["1.1", "2.2e2", "3e300"].map((str) => parseInt(str)); // [1, 2, 3]

使用 parseInt 作为参数调用 map 方法，输出运行如下：

const strings = ["10", "10", "10"]; const numbers = strings.map(parseInt); console.log(numbers); // 根据以上描述，[10, NaN, 2] 的实际结果可能会出乎意料。

【本文地址】

Array.prototype.map()

Array.prototype.map()

今日新闻

推荐新闻