parseInt的作用
parseInt(string, radix) parseInt使得一个字符串转换成十进制整数,它接受两个参数,参数一将要转换的字符串,参数二可选表示为解析时的基数未传参时默认为10
遵循以下主要规则:
1.如果parseInt的参数不是字符串,则会先转为字符串再转换
let a = parseInt(1234)// 1234
1234 =>'1234' =>1234
复制代码
2.字符串依次转换,如果遇到不能转为数字的字符,就不再进行下去,返回已经转好的部分,如果字符第一个值为非正常数值则返回NaN。
let a = parseInt('123adf',10)//123
let a = parseInt('a12',10)//NaN
复制代码
3.如果字符串以0x或0X开头,parseInt会将其按照十六进制数解析。
let a = parseInt('0x16')//22
let a = parseInt('0X16')//22
复制代码
4.如果字符串以0开头,将其按照10进制解析。
let a = parseInt('016')//16
复制代码
5.当进行进制转换时基数未填或者传0那么将默认为10.
let a = parseInt('016',0)//16`
复制代码
6.当基类小于2大于36时将返回NaN.
let a = parseInt('10',1)//NaN
let a = parseInt('10',37)//NaN
复制代码
7.依照规则二转换,当字符串第一个值大于等于基数的时候返回NaN
let a = parseInt('5',4)//NaN
let a = parseInt('3',4)//3
let a = parseInt('2',2) //NaN
let a = parseInt('1',2) //1
复制代码
这里罗列了主要规则更多的可自行查阅 MDN
map的作用
MDN给的说明 map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果
。 它有两个参数一个callback一个是执行 callback 函数时使用的this 值。 这里主要说说callback 它传入三个值 参数一当前元素,参数二当前元素索引,参数三map方法被调用的数组。 用法如下
var array1 = [1, 4, 9, 16];
const map1 = array1.map(function(item,index,arr){
//do somothing......
return item * 2
});//[ 2, 8, 18, 32 ]
复制代码
上面的栗子我们让每个元素乘2返回,当然你可以在回调里面为元素做任何处理并返回它
介绍完了parseInt 和map的作用和主要用法后对于本篇的问题就比较明朗了
['1', '2', '3'].map(parseInt) 解析为什么后面两个是NaN?
我们知道parseInt会传入两个参数,一个要转换的字符串一个是基类, 而map的回调会将当前元素,索引,数组依次传入, 因此会给parseInt传入当前元素和下标索引['1', '2', '3'].map(parseInt)的过程就变成下面这个样子
['1', '2', '3'].map(parseInt('1',0))//1
['1', '2', '3'].map(parseInt('2',1))//NaN
['1', '2', '3'].map(parseInt('3',2))//NaN
复制代码
分别根据上述规则
- 第一次调用的时候基数传入当前的索引0 ,当基数为0时默认为10得到结果1,;
- 第二次调用的时候基数传入当前的索引1,当基数小于2大于36时 返回NaN;
- 第三次调用的时候基数传入当前的索引2,当要转换的值大于或等于基数时返回NaN.
如何解决这种问题呢?
主要原因我多穿了参数给parseInt那么我们不传那么多参数就好了,可以如下这样解决
const c = ['1', '2', '3'].map(function (item) {
return parseInt(item)
})// [1,2,3]
复制代码
或者这样
const c = ['1', '2', '3'].map(Number)//[1,2,3]
复制代码