['1','2','3'].map(parseInt) 的结果及原因，parseInt参数详解

Posted 2021-09-13 茴香

结果为：[1,NaN,NaN], 原因如下

[\'1\',\'2\',\'3\'].map(parseInt) 实际执行的代码是：

[\'1\',\'2\',\'3\'].map((item,index)=>{
  return parseInt(item,index)
})

即返回的值分别为：

parseInt(\'1\',0)   //1
parseInt(\'2\',1)   //NaN
parseInt(\'3\',2)   //NaN

先了解map方法

map()方法创建了一个新数组，其结果是该数组的每个元素都调用一个提供的函数后返回的结果。并且不会改变原数组

var new_array = arr.map(function callback(currentValue,index,array){
  //可用箭头函数arr.map((currentValue,index,array)=>{})
  //currentValue:是callback数组中正在处理的当前元素，index可选，当前元素的索引，array可选，是callback方法被调用的数组，另外，thisAry可选，执行callback函数时使用的this值
},thisArg)

parseInt(string,radix)函数可解析一个字符串，并返回一个整数。

先看demo ,此处看似radix为进制。但官网文档解释为基数

var num1 = parseInt("10",2);          //2 (按二进制解析)
var num2 = parseInt("10",8);          //8 (按八进制解析)
var num3 = parseInt("10",10);        //10 (按十进制解析)
var num4 = parseInt("10",16);         //16 (按十六进制解析)

var num5 = parseInt("45",5)     //4（当解析45时，4属于范围内，所以得到4，但是5不属于，所以走到这里直接把后面抛弃掉，相当于parseInt("4",5)

var num6 = parseInt("445",5)    //24 (当解析445时，4属于范围内，但是在后面的5不属于， 相当于 parseInt("44",5); ， 根据进制算法，最终算出，从右往左 4*5^0+4*5^1 = 24)

当radix为0，小于2，或者大于36

parseInt(\'1\',0);       // 1  (radix是0的时候，按16/8进制解析，但是如果开头是1-9就按10进制解析，所以是1)

parseInt(\'2\',1);       // NaN  ( radix参数小于 2 或者大于 36，则 parseInt() 将返回 NaN。)

parseInt(\'3\',2);      // NaN   (radix的参数是2，所以按二进制解析，而二进制最大为1，只能为0，1, 3显然超了，转换不了，所以是NaN)

• string：需要被解析的字符串，必传

• 当参数 radix 的值为 0，或没有设置该参数时，parseInt() 会根据 string 来判断数字的基数。当忽略参数 radix , javascript 默认数字的基数如下:

  • 如果 string 以 "0x" 开头，parseInt() 会把 string 的其余部分解析为十六进制的整数。
  • 如果 string 以 0 开头，那么 ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进制或十六进制的数字。
  • 如果 string 以 1 ~ 9 的数字开头，parseInt() 将把它解析为十进制的整数。