JS 关于map和parseInt的一道大厂面试题

上次写过一遍关于这道题的讲解，有些繁琐，现在重新写一下

1. 题目是这样的

let arr = [1,2,3,4];
arr = arr.map(parsetInt);
console.log(arr);

2. 分析

arr = arr.map(parsetInt); 重点就是在这一句话，这里有两个知识点，一个是map，一个是parseInt

[].map()是数组原型上的一个方法，它是遍历数组中的每一项，并且支持返回值的。例如：

[1,2,3].map(item=>{
  return item*2;   //[2,4,6]
});

具体的map方法：mdn讲解

从上面的例子可以看出来，map是可以遍历数组中的每一项的，在这个题目中就是，当map遍历数组中的每一项时，都会执行一次parseInt，传递给它两个参数：当前项和对应的索引，并且把parseInt执行的返回结果替换数组中当前项，最后以新数组方式返回，原始数组不变

let arr = [1,2,3,4];
arr = arr.map(parsetInt);
console.log(arr);

/*
 *  arr = arr.map(parsetInt) => 
 *  arr = arr.map((item,index)=>{
 *    return parseInt(item,index)
 *  });
*/

parseInt(item,index)

它可以支持两个参数：parseInt([value],[radix])：

1. [value]必须是string类型,如果不是默认要转换为string类型再进行处理；
2. 第二个参数是一个进制的基数（2~36之间），把[value]当做[radix]进制，最后转换为10进制的数字；

• 第二个参数不写，默认是10，但是如果[value]是以0x开头的字符串，默认的[radix]是16
• [radix]设置为0和设置10是一样的，但是除此之外，只要不在2~36之间，返回的结果都是NaN

parsetInt的理解:

1. parseInt中第一个参数是基本数据类型

parseInt('12px');
/*
 * => 第二个参数默认是10： parseInt('12px',10)
 * => 接下来找字符串中符合10进制的值，从左到右找，遇到一个非10进制的值，则结束查找（不论后面是否还有，都不在查找了）
 * => 遇到不是10进制是停止查找，因此查找到的就是：'12'
 * => 再把找到的结果转换为10进制的数字
 * => 最后结果：12
*/ 

 parseInt('12px',0) => 12   //第二个参数是0，和10是一样的,因此按照10进制查找即可
 parseInt('12px',1) => NaN  //第二个参数是1，不在2~36之间，所以是NaN

1. parseInt中第一个参数是引用数据类型

parseInt([10,20,30])
// 把数组变为字符串，再把radix补充
// => parseInt('10,20,30',10)
// 找符合10进制的内容
// => '10'
// 最后转换为10进制
// => 10

把其它进制转换为二进制和十进制

1. 把其它进制转换为二进制：除以2取余数，用上一次除数的结果在除以2取余数...一步步的操作即可，一直到除完的结果是零为止，最后把所有的余数倒着拼接在一起即可

// 把n转为二进制
let n = 32;
/*
 * 32/2   => 16    余数:0
 * 16/2   => 8     余数:0
 * 8/2    => 4     余数:0
 * 4/2    => 2     余数:0
 * 2/2    => 1     余数:0
 * 1/2    => 0     余数:1
 * 倒着把所有的值拼接起来就是转换为二进制的值
 * (32).toString(2) 这也是直接转换为二进制 => "100000"
 */

2.把其它进制N转换为10进制：按照当前位的权重，计算对应的方来求出结果

let n = 2057; //按照八进制 => 十进制
//  2*8^3 + 0*8^2+ 5*8^1 + 7*8^0
//  1024 + 0 + 40 + 7 => 1071 

let n = '23AF'; //把16进制转换为十进制
// 2*16^3 + 3*16^2 + A(10)*16^1 + F(15)*16^0
// 8192 + 768 + 160 + 15 =>9135

let n = 12.21; //三进制转换为十进制
//1*3^1 + 2*3^0 + 2*3^-1 + 1*3^-2
// 3 + 2 + 2*(1/3) + 1*(1/(3*3))  => 5.777777777777778

返回改题

/*
 * parseInt(1,0)  => 1  => 10进制的1转为10进制还是1
 * parseInt(2,1)  => NaN  => 1不在2~36的范围内，直接返回NaN
 * parseInt(3,2)  => parseInt('3',2) => NaN  => 字符串中并没有符合2进制的值
 * parseInt(4,3)  => parseInt('4',3) => NaN  => 字符串中并没有符合3进制的值
 */

3. 引申题目（看一下是否真的掌握该类型）

let arr = [10.18, 0, 10, 25, 23];
arr = arr.map(parseInt);
console.log(arr);

步骤：

• 确定第二个参数（0和10都是10进制，2~36是对应的进制，只要不在2~36之间，返回的结果都是NaN）
• 找到符合第二参数中进制的值（遇到不符合该进制的就停止查找）
• 将它转为数字类型
• 转为十进制 （利用进制的转换）
• 输出结果

/*
 * parseInt(10.18,0)  => parseInt('10.18',10) => parseInt('10',10) => 10
 * parseInt(0,1) => NaN
 * parseInt(10,2) => parseInt('10',2) => parseInt('10',2) => 0*2^0 + 1*2^1 => 2
 * parseInt(25,3) => parseInt('25',3) => parseInt('2',3) => 2*3^0 => 2
 * parseInt(23,4) => parseInt('23',4) => parseInt('23',4) => 3*4^0 + 2*4^1 => 11
 */