【前端词典】arr.filter(parseInt) 考查点为什么

这一类的面试题目时不时出现，那么它的考点在哪里呢？

其实这类题的目的很清楚，即考察：

• 数组方法的基础知识
• 数值转换方法的基础知识

也就是考察 基础知识的扎实程度，换句话说这是一道基础题。

map()、filter()、reduce() 等数组方法

说明一下：map()、filter() 是 ES5 为数组定义的迭代方法， reduce() 是 ES5 为数组定义的归并方法。这些方法并非 ES6 新增的语法（以前在一场面试中，面试官很确定的说这是 ES6 新增的方法）。

• 你能够在 《JavaScript 高级程序设计-第三版》 96-97 页中看到明确的说明。

语法:

array.filter(callback[,thisObject]);
  // array.map(callback[,thisObject]);
  // array.reduce(callback[,initialValue])
复制代码

都不会改变原始数组。

参数：

callback：要对每一个数组元素执行的回调函数。
  thisObject：在执行回调函数时定义的 this 对象(没有传递或者为 null，将会使用全局对象)。
  // initialValue: 做为第一次调用 callback 函数时的第一个参数的值。
复制代码

map()

对原数组中的每一个元素按顺序执行一次指定的函数（即 callback），callback 每次执行后的返回值（包括 undefined）组合起来造成一个新数组。

回调函数能够有三个参数：当前元素，当前元素的索引 [可选] 和当前的数组对象 [可选] 。

filter()

对原数组中的每一个元素执行一次指定的函数（即 callback），而且建立一个新的数组，该数组元素是全部回调函数执行时返回值为 true 的原数组元素。

回调函数能够有三个参数：当前元素，当前元素的索引 [可选] 和当前的数组对象 [可选] 。

reduce()

对原数组中的每一个元素执行一次指定的函数（即 callback），返回最后一次回调返回值。

回调函数能够有四个参数：累计器，当前元素，当前元素的索引 [可选] 和当前的数组对象 [可选] 。

提醒：reduce() 区别于 map()/filter() 的地方就在回调函数的第一个参数 - accumulator : 累计器。

parseInt()、parseFloat() 两个数值转换方法

parseInt 语法

parseInt(string, radix)  
复制代码

将一个字符串 string 转换为 radix（值默认为 10） 进制的整数，radix 为介于 2-36 之间的数。

注意：string 将看做是一个数的 n 进制表示，返回的值为十进制。

返回值：

• 若是被解析参数的第一个字符没法被转化成数值类型，则返回 NaN
• 若是 radix 小于 2 或者大于 36，则返回 NaN

在 radix 为 undefined，或者 radix 为 0 或者没有指定的状况下，JavaScript 做以下处理：

• 若是字符串 string 以"0x"或者"0X"开头, 则 radix 是 16 (16进制).
• 若是字符串 string 以"0"开头, radix 是8（八进制）或者10（十进制），具体值由实现环境决定。ECMAScript 5 规定使用 10，可是并非全部的浏览器都遵循这个规定。所以，永远都要明确给出 radix 参数的值
• 若是字符串 string 以其它任何值开头，则 radix 是 10 (十进制)。

parseFloat 语法

parseFloat(string)
复制代码

只有一个参数，用做将给定值解析成浮点数（若是给定值不能被转换成数值，则会返回 NaN）。

解释 arr.filter(parseInt)

其实以上的过程就很好地解析了这个问题，此类问题只要理解基本方法的传参就不会出错了，并且不须要强记['1', '2', '3'].map(parseInt)的结果。

let arr = [2,0,11,10];
arr.filter(parseInt);

// arr.map(parseInt); // [2, NaN, 3, 3]
复制代码

一、首先 arr 的每一个元素执行一次 parseInt，传入 parseInt 的参数就是当前元素和当前元素的索引。

二、经历以下过程：

- parseInt(2,0)   // 结果为 2，转成 Boolean 为 true
- parseInt(0,1)   // 结果为 NaN，转成 Boolean 为 false
- parseInt(11,2)  // 结果为 3，转成 Boolean 为 true
- parseInt(10,3)  // 结果为 3，转成 Boolean 为 true
复制代码

因此最后返回 [2, 11, 10]。

总结

基础很重要，这是送分题。