parseInt()详解,你真的知道可选参数radix的用法吗?

1,339 阅读2分钟

前言

parseInt()算是我开发过程中比较常用的函数之一,但前不久的一道笔试题,让我重新认识了这个函数。
笔试题如下:

["1", "2", "3"].map(parseInt)

大家可以先思考一下结果是什么,之后会讲到。

点击查看
[1, NaN, NaN]

parseInt函数

作用:解析一个字符串并返回指定基数的十进制整数(来源MDN
语法: parseInt(string, radix)
string:要解析的值,非字符串内部会先转化为字符串处理,开头结尾的空格会被忽略
radix:可选参数,数字基数,可以理解为进制,范围为2~36
radix上面说到可以理解为进制,radix值为多少,就转为多少进制来处理。 例:

parseInt("123", 6)  //51 按六进制处理
parseInt("123", 10) //123 按十进制处理
parseInt("123", 16) //291 按十六进制处理

当radix不填写时默认当做十进制处理,但注意10并不是默认值,当字符串以0x开头是会直接处理为16进制

parseInt("123", 16) === parseInt("0x123")

注意:字符串以0开头从ES5开始都处理为10进制,现在大部分浏览器都处理为10进制

看到现在不知道大家有没有思考两个问题:

  1. 字符串中的数字有超过了radix填写的进制数字,如二进制就0与1,字符串中出现了大于1的数,该如何处理?
  2. radix的范围为2~36,超过范围得到什么值?

先来看第一个问题:

parseInt("123", 2)  //?

二进制最大数为1,那么2,3该处理呢?在parseInt机制中,直接进行截断,舍弃掉本位与之后的数字,所以实质上述式子等价于

parseInt("1", 2)  //1

开头就超过进制最大数直接处理为NaN

第二个问题的答案为NaN,但存在着几个特例:

parseInt("123", 37)  //NaN 超过范围
parseInt("123", 0)  //123 当做10进制处理
parseInt("123", undefined)  //123 当做10进制处理
parseInt("123", null)  //123 当做10进制处理

记住0, undefined, null三种特殊的情况,这时字符串以0x开头同样也会被当做10进制处理

前言问题解答

看到上面parseInt的解析,相信大家都已经明白了为什么结果为[1, NaN, NaN]
map函数有三个形参,分别为value(当前值),index(当前索引),arr(整个数组)
前两个参数value,index会当做parseInt函数的参数传递进去,arr则被忽略
所以

["1", "2", "3"].map(parseInt)

相当于

parseInt("1", 0) //1
parseInt("2", 1) //NaN
parseInt("3", 2) //NaN

所以得出结果[1, NaN, NaN]

第一次在掘金发布自己的博客,希望大佬们多多指教