Map的奇怪行为，parseInt

Question

可能是重复问题：
javascript - Array.map 和 parseInt

我在Twitter上看到了这个奇怪的JavaScript行为示例。

['10','10','10','10','10'].map(parseInt)

计算结果为

[10, NaN, 2, 3, 4]

有人可以解释一下这种行为吗？我在 Chrome 和 Firebug 中进行了验证。

['10','10','10','10','10'].map(function(x){return parseInt(x);})

正确地将一个由10组成的数组返回为整数。这是使用map()方法不当、parseInt存在缺陷还是其它问题呢？

- Ben McCormick

---

是的，当我发布时，它出现在相关内容中，但在我编写时没有出现在搜索结果中。如果它被关闭为重复项，我也没有问题。 - Ben McCormick

最近也有一个类似的问题（我想是在本周）。我曾试图找到它，但只找到了我链接的那个。 - bfavaretto

这实际上是我看到的那个链接：https://dev59.com/p17Va4cB1Zd3GeqPKoh0?lq=1 我认为这里的答案比那个更好，但你提到的旧的那个也非常清晰。 - Ben McCormick

一个解决方法是创建一个自己的parseInt包装器，像这样： const toInt = (value) => parseInt(value);。这将按照您的预期工作。然后像这样使用它： ['10'，'10'，'10'，'10'，'10'] .map（toInt）。 - LTroya

你也可以使用 Lodash 的 _.toInteger() 函数和 _.map() 函数来实现你的目标：_.map(['10','10'], _.toInteger); - steampowered

Answer 1

parseInt 函数接收两个参数：字符串和基数（进制）:

var intValue = parseInt(string[, radix]);

而 map 方法的第二个参数则是索引值:

... 回调函数被传递了三个参数：当前元素的值，当前元素的索引，以及正在被遍历的数组对象本身。

- VisioN

---

啊，这就有道理了，所以第二个数字试图在基数1中进行计算并失败，其余的将只返回索引？这很有道理。谢谢。 - Ben McCormick

其余部分并非严格意义上的“返回索引”，但由于任何基数为x的数字x都表示为字符串'10'，因此结果相同。请注意，如果您的“'10'”数组中有超过36个元素，则末尾将开始出现更多的“NaN”。 - Gareth

有没有解决方法可以让这个工作？谢谢。 - Vincent Wasteels

@VincentWasteels 是的，有点像。您可以使用 [...].map(parseFloat) 或 [...].map(Number)。两者都会将给定数组中的字符串转换为数字。但是 parseFloat 和 Number 的工作方式与 parseInt 稍有不同：两者都会将浮点数和整数转换，而 Number 将以数字开头并包含其他字符的字符串转换为 NaN（例如 10abc）。Number 还可以将所有空格和不可打印字符转换为 0。作为字符串到数字转换器，两者都非常好用，如果您只是真的需要使用 parseInt：那么请使用匿名函数作为 map 参数。 - VisioN

答案正确，但没有提供解决方案或替代方案。 - David Prieto

@DavidPrieto 请检查一下你发表评论之前的那条。 - VisioN

Answer 2

parseInt使用被map传入的前两个参数，并使用第二个参数指定基数。

以下是您代码中正在发生的事情：

parseInt('10', 0) // 10
parseInt('10', 1) // NaN
parseInt('10', 2) // 2
parseInt('10', 3) // 3
parseInt('10', 4) // 4

这是一个关于parseInt的MDN链接：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/parseInt。

- Joseph Silber

---

parseInt('10', 0) // 10的意思并不比以一为基数更有意义。这也应该返回NaN。但我想在一个语言中，null、0、false、undefined和''基本上是相同的东西，我可以理解为什么会这样。如果(radix){...} else {...假定基数为10...}。所以基本上undefined和0都是falsy值，因此它们将采用相同的代码路径。 - kornfridge

@kornfridge 这在链接的 "如果基数未定义或为0（或不存在）" 下有解释。 - wjandrea

Answer 3

来自MDN：

回调函数被调用时带有三个参数：元素的值、元素的索引和正在遍历的数组对象。

parseInt()接受两个参数。值和基数。这意味着parseInt()函数被调用时带有意外的参数。

- Justin Niessner