面试题-[‘1‘, ‘2‘, ‘3‘].map(parseInt)

[‘1’, ‘2’, ‘3’].map(parseInt)

错误答案

[1, 2, 3]

正确答案

[1, NaN, NaN]

解析

• 首先我们来看看这里面的两个方法

1. map

   map()方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果

   参数

   ​ callback

   ​ 生成新数组元素的函数，使用三个参数：

   ​ currentValue

   ​ callback 数组中正在处理的当前元素。

   ​ index |可选

   ​ callback 数组中正在处理的当前元素的索引

   ​ array |可选

   ​ map 方法调用的数组

   ​ thisArg |可选

   ​ 执行 callback 函数时值被用作 this

   语法

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
    
    
    // Return element for new_array
}[, thisArg])

​ 返回值

回调函数的结果组成了新数组的每一个元素。并返回这个新数组

​ 描述

map 方法会给原数组中的每个元素都按顺序调用一次 callback。callback 每次执行后的返回值（包括 undefined）组合起来形成一个新数组。callback 函数只会在有值的索引上被调用。

callback 函数会被自动传入三个参数：数组元素，元素索引，原数组本身

map 不修改调用它的原数组本身

2. parseInt

   parseInt(string, radix) 将一个字符串 string 转换为 radix 进制的整数，radix 介于 2~36之间的数。

   那我们一般使用 parseInt 的时候，就只输入了一个 string 字符串，所以在这里会忽略其实它还会接受第二个参数 radix ，但是在本例中，index 值会被自动传入到 parseint 的第二个参数的地方，故这里就有：

   ['1', '2', '3'].map(parseInt);
   
   // parseInt('1', 0);   // 在规范里有很明确的说，如果基数为0，且字符串以其他（‘0x’,'0X','0'以外）任何值开头，则基数是10（十进制），所以这里是 1
   // parseInt('2', 1);   // radix 的范围是 2~36 所以这里返回 NaN
   // parseInt('3', 2);   // 3 也不是二进制，故而返回也是 NaN
   // [1, NaN, NaN]
   

   如果要实现返回值是三个整数，可以这样写：

   // 1. 规定死 radix 
   ['1', '2', '3'].map(n => parseInt(n, 10))
   
   // 或者直接不传
   ['1', '2', '3'].map(n => parseInt(n))
   

公众号：Coder 杂谈，欢迎关注