['1','2','3'].map(parseInt)详解

看到学生的一道前端面试题，['1','2','3'].map(parseInt)，结果是：[1, NaN, NaN]，有很多人不理解，下面来解释以下

我们先来了解一下

map函数

map 方法 (Array) (JavaScript)
对数组的每个元素调用定义的回调函数并返回包含结果的数组。
array1.map(function(a,b,c){
a 是数组中的每一项即‘1‘’2‘’3‘
b 是数组的下标 即0 1 2
c 是原数组 即 array1
})
如下例子

var arr = ['1','2','3'];
  function fn(num,a,c){
    console.log(num,a,c);  
    //num       a           c
    //1         0      ["1", "2", "3"]
    //2         1      ["1", "2", "3"]
    //3         2      ["1", "2", "3"]
    return num;
  }
  // console.log(arr.map(fn));

由上可知map如果里面是一个函数，将会将它的参数传递到函数中去

parseInt(string, radix)

参数 描述
string 必需。要被解析的字符串。
radix 可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。
如果省略该参数或其值为 0，则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头，将以 16 为基数。
如果该参数小于 2 或者大于 36，则 parseInt() 将返回 NaN。

例子如下

// parseInt(3,2); //NaN
// parseInt(3,4); //3
// parseInt(3,26); // 3
// parseInt(3,36); //3
// parseInt(3,37); //NaN

  console.log(["1", "2", "3"].map(parseInt));
  //  parseInt('1', 0) -> 1   radix 为 0，parseInt() 会根据十进制来解析，所以结果为 1；
  //  parseInt('2', 1) -> radix 为 1，超出区间范围，所以结果为 NaN；
  //  parseInt('3', 2) -> NaN radix 为 2，用2进制来解析，应以 0 和 1 开头，所以结果为 NaN。

  // 因为parseInt接收两个参数，所以结果为 [1, NaN, NaN]