面试题[‘1‘,‘2‘,‘3‘].map(parseInt) 结果是什么？为什么 ?(深度解析)

第一眼看到这个题目的时候，脑海跳出的答案是 [1, 2, 3]，但是真正的答案是[1, NaN, NaN]。

我想了一下，与其深度解析这个难度低一点的面试题，不如我们直接来看一到难度稍微高一丢丢的面试题:

['1','2','3','4','5','6','7','8','9','10'].map(parseInt) 结果是什么？为什么？下面开始我们的深度解析！！！

• 首先让我们回顾一下，map函数的第一个参数callback：

var new_array = arr.map(function callback(currentValue[, index[, array]]) { // Return element for new_array }[, thisArg])
这个callback一共可以接收三个参数，其中第一个参数代表当前被处理的元素，而第二个参数代表该元素的索引。

• 而parseInt则是用来解析字符串的，使字符串成为指定基数的整数。
  parseInt(string, radix)
  接收两个参数，第一个表示被处理的值（字符串），第二个表示为解析时的基数（2~36）。

• 了解这两个函数后，我们可以模拟一下运行情况

1. parseInt('1', 0) //radix为0时，且string参数不以“0x”和“0”开头时，按照10为基数处理。这个时候返回1
2. parseInt('2', 1) //radix为1时，radix范围为2~36，所以无法解析，返回NaN
3. parseInt('3', 2) //radix为2（2进制）表示的数中，范围为0~1小于3，所以无法解析，返回NaN
4. parseInt('4', 3) //radix为3（3进制）表示的数中，范围为0~2小于4，所以无法解析，返回NaN
5. parseInt('5', 4) //radix为4（4进制）表示的数中，范围为0~3小于5，所以无法解析，返回NaN
6. parseInt('6', 5) //radix为5（5进制）表示的数中，范围为0~4小于5，所以无法解析，返回NaN
7. parseInt('7', 6) //radix为6（6进制）表示的数中，范围为0~5小于6，所以无法解析，返回NaN
8. parseInt('8', 7) //radix为7（7进制）表示的数中，范围为0~6小于7，所以无法解析，返回NaN
9. parseInt('9', 8) //radix为8（8进制）表示的数中，范围为0~7小于8，所以无法解析，返回NaN
10. parseInt('10', 9) //radix为9（9进制）表示的数中，范围为0~8，1和0在此范围，因此10=1*9^1+0*9^0=9，返回9
11. parseInt('11', 10) //基数为10（10进制）表示的数中，范围为0~9，1在此范围，因此11=1*10^1+1*10^0=11，返回11

• map函数返回的是一个数组，所以最后结果为[1, NaN, NaN,NaN,NaN,NaN,NaN,NaN,NaN,9,11]