「这是我参与11月更文挑战的第10天,活动详情查看:2021最后一次更文挑战」。
今天来讲一道经典面试题:
['1','2','3'].map(parseInt) 结果是什么?为什么?
不细想的话,一定以为他的结果为 [1, 2, 3],但是实际结果却是 [1, NaN, NaN],接下来让我来讲讲为什么会得到这样的结果。
首先要知道的是map()方法和parseInt()方法
Array.prototype.map()
作用:map() 方法创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。
语法:
var new_array =arr.map(function callback(currentValue[, index[, array]]) {
// Return element for new_array
}[, thisArg])
参数介绍:
callback:处理数据,生成新数组的函数,该方法有默认传进去的三个参数:
1、currentValue: 当前正在处理的元素
2、index: 当前正在处理的元素的索引[可选]
3、array: map方法调用的数组本身[可选]
thisArg: 执行 callback 函数时值被用作this[可选]。
返回值: 一个由原数组每个元素执行回调函数的结果组成的新数组。
parseInt
作用: parseInt(string, radix) 解析一个字符串并返回指定基数的十进制整数, radix 是2-36之间的整数,表示被解析字符串的基数。
参数介绍:
1、string: 要被解析的值。如果参数不是一个字符串,则将其转换为字符串。
2、radix: 从 2 到 36,表示字符串的基数。例如指定 16 表示被解析值是十六进制数[可选]。
返回值: 从给定的字符串中解析出的一个整数。
parseInt('123', 3) // 将'123'看作3进制数,返回十进制数18 => 1*3^2 + 2*3^1 + 3*3^0 = 18
结果解答
parseInt 经常被带着一个参数使用, 但是他接受两个参数:第一个参数是一个表达式,而第二个是基数;
Array.prototype.map 会传递3个参数:
- currentValue
- index
- array
其中第三个参数被parseInt忽视了。因此可能出现混淆。下面是迭代步骤的简明示例:
// parseInt(string, radix) -> map(parseInt(value, index))
/* first iteration (index is 0): */ parseInt("1", 0); // 1
/* second iteration (index is 1): */ parseInt("2", 1); // NaN
/* third iteration (index is 2): */ parseInt("3", 2); // NaN
ok,现在就明白结果为什么是:[1, NaN, NaN]了吧,下次应该不会答错了吧!