美文网首页前端开发那些事儿
关于['1','2','3'].map(parseInt)的解析

关于['1','2','3'].map(parseInt)的解析

作者: 糖小羊儿 | 来源:发表于2021-03-16 00:21 被阅读0次

    1.进制问题

    进制有二进制,八进制,十进制,十六进制

    • 二进制:只有0,1
    • 八进制:只有0、1、2、3、4、5、6、7
    • 十进制:只有0,1、2、3、4、5、6、7、8、9
    • 十六进制:有0,1、2、3、4、5、6、7、8、9、A、B、C、D、E、F
      我们写css用的色值 #f5f5f5 就是16进制

    2.parseInt 方法

    parseInt() 函数可解析一个字符串,并返回一个整数。
    两个参数:

    • string 要解析的字符串
    • radix 要解析的数字的基数,我们可以理解成,要把字符串解析成多少进制,取值是 2 ~ 36,如果没有参数,或者是0,按10进制处理
    parseInt('3')//3 如果没有参数,或者是0,按10进制处理
    parseInt('3',1) //NaN  因为参数2取值区间为2-36,不满足直接返回NaN
    parseInt('3',2) //NaN  因为2进制只有0,1,所以parseInt无法将3转换成二进制,只好返回NaN
    parseInt('1001',2) //9  将'1001'转换为二进制
    parseInt('98',8) //NaN  因为8进制只有0-7,所以parseInt无法将‘98’转换成八进制,只好返回NaN
    parseInt('f5f5f5',16) // 16119285 将'f5f5f5'转换成16进制
    parseInt('f5f5f5',37) //NaN  因为参数2取值区间为2-36,不满足直接返回NaN
    parseInt('3',3) //同理,我们可以理解为想要转换为三进制,但是三进制只有0,1,2,所以无法将'3'转换成三进制只能返回NaN
    

    3.map方法

    对数组进行循环遍历,返回新的数组

    • 参数1:遍历时当前元素的值
    • 参数2:遍历时的索引值
    • 参数3:原始数组对象
    let re= ['a','b','c','d'].map(function(curValue,index,arr){
         console.log(curValue) // 'a','b','c','d'
         console.log(index) // 0 1 2 3 
         console.log(arr) // ['a','b','c','d']
          return 'a';
     })
    

    4.改造map方法

    将map的匿名函数变成方法调用,相当于map的参数也传递给了fn

     function fn(curValue,index,arr){
         console.log(curValue) // 'a','b','c','d'
         console.log(index) // 0 1 2 3 
         console.log(arr) // ['a','b','c','d']
          return 'a';
     }
    let re= ['a','b','c','d'].map(fn)
    

    5.将map匿名函数换成parseInt

    let re= ['1','2','3','4'].map(parseInt);
    

    相当于执行了:

    parseInt('1',0) // 1  如果没有参数,或者是0,按10进制处理
    parseInt('2',1)// NaN   参数2取值区间为2-36
    parseInt('3',2)// NaN  2进制只有0,1
    parseInt('4',3)// NaN   2进制只有0,1,2
    

    所以最后执行结果是 [1,NaN,NaN,NaN]

    相关文章

      网友评论

        本文标题:关于['1','2','3'].map(parseInt)的解析

        本文链接:https://www.haomeiwen.com/subject/siakcltx.html