前端面试题 : [‘1‘, ‘2‘, ‘3‘].map(parseInt)

        这个面试题,会涉及到map,parseitn两个函数,所以我们先一下这两个函数(答案在最下方)

1.首先我们先说map

map是数组的一种方法,使用map()的数组会对数组里的元素进行迭代,与此同时呢还会对这些元素进行处理,处理完成之后返回一个数组,至于对元素进行怎么样处理是我们定义的,我们需要在括号里面放入一个函数,这个函数可以接收三个参数:

array.map(function(currentValue, index, arr), 会接收回调函数,和回调函数的this值 其中回调函数可以接收的参数说明: function(currentValue, index, arr):必须。为一个函数,数组中的每个元素都会执行这个函数。其中函数参数:currentValue:必须。表述当前元素的的值(item)i 等 index:可选。当前元素的索引也就是第几个数组元素。 arr:可选。当前元素属于的数组对象 map() 就会自动执行这个函数了,需要注意的是:1、map()函数不会对空数组进行检测; 2、map()函数不会改变原始数组,它形成的是一个新的数组。然后我们来看这个例子,这个例子执行了map()方法

var arr =["100","120","129"]
        arr.map(function (item,index,array){
            console.log("元素:" + item);
            console.log("序号:" + index);
            console.log("数组:" + array);
        })
 

我们可以看到,括号里的函数会自动获取里面对应的数组属性,包括,元素,序号,数组本身那么我们直接把括号里的函数全部删除掉,会发生什么呢,直接用console.log输出,

这个是什么样结果呢,会发现和上面的一样依旧会按顺序输出元素,序号,数组本身 ,因为console.log也是一个函数,只要是函数就会调用map()函数的方法。

如果说不明显,我们就再来举一个例子,还是在里面传入一个函数,这个 函数里面分别 输出元素序号,数组本身。

var arr =["100","120","129"]
         arr.map(function  (item,index,array){
             console.log( item,index,array);
         })
​

会发现结果和刚才的一样,

那么就说明了,只要数组的本身没有问题,无论如何map里面的函数都会传入三个参数对应 的值,因为这三个参数本身就是数组它本身的属性,即使你不定义他也是默认存在的,我们只能选择使不使用这些参数,或者 说使用多少个参数,这就是map的核心。

2. parselnt()

parselnt ()这个函数其实就是在括号里面输入一个字符串,然后返回一个整数结果,

var num = parseInt("666")
         console.log(num);  //666

最简单的用法就是输入一个字符串,然后把字符串里的数字提取出来 ,得到一个数字型的数字.

但是呢我们输入一个0x开关的字符串呢 (0x开头是十六进制 如 0x ab )那就是10*16+11

var num = parseInt("0xb")
          console.log(num); // 11 

就会按照 16进制的规则进行转换,

如果没有提前设定好规则呢就很容易发生混乱,因此parselnt可以传入第二个参数,第二个参数是一个基数,也就是告诉函数需要用多少进制(如果第二个数为3,那么也会把三当成一个进制3的的基数进行进制 3的运算)。

1.如果参数为0,那么就是通过十进制来进行转换 ,

2.参数如果 小于2,或者大于36 ,返回nan

也就是说这个参数要在2-36之间,我们来看下一个案例

var num0 = parseInt("110",0);  //110
var num1 = parseInt("110",1);  //nan
var num2 = parseInt("110",2);  //6
console.log(num0,num1,num2); 

第一个参数设置为0 , 因此用十进制办,真的转化成 110

第二个参数设置为1,不 在 参数如果 小于2,或者大于36之间 ,所以返回一个nan

第三个参数设置为2, 也就是二进制,所以110转二进制就是为6

这就是parselnt的核心了。

说完这些 我们就可以直入主题了,

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

首先我们把括号里的parsrlnt()去掉,

[‘1‘, ‘2‘, ‘3‘].map()

那么这里的意思就变成了对这个数组进行迭代了,每一个元素都会分别的执行这个里面的函数 ,前面刚刚说过无论如何,map()里面的函数都会传入三个参数对应的值所以我们就把里面的函数写出来。

蓝色,因此我们就把里面的函数写出来 ,这个函数需要返回,返回的是(绿色)parselnt(),前面刚刚说过,parselnt()接收的是两个参数 ,而原题中并没有写入参数 ,因此会把map()的默认的三个参数,都给了parselnt(),把这三行合在一块就是这样

  ['1', '2', '3'].map(function (item, index, array) {
      return parselnt(item, index, array)
    });

因为前面说过了,函数可以接收比定义时还要多的参数,那么就会变成每个元素都 会执行,这个parselnt函数了,相当于这样了

  <script>
    parselnt("1", 0, ["1","2","3"]);
    parselnt("2", 1, ["1","2","3"]);
    parselnt("3", 2, ["1","2","3"]);
  </script>

但是parselnt会忽略掉第三个参数因为他只定义了两个参数,所以就会变成下面这块代码

parselnt(“1”,0);    // 1
parselnt(“2”,1);    // nan
parselnt(“3”,2);    // nan

因为map()是会返回 一个数组所以我们的答案是【1,NAN,NAN】

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值