当map遇到parseInt
也是一道面试题,估计除了面试题,一般情况下,也不会写出类似的代码了。
['1', '2', '3'].map(parseInt)
这么一道题的返回结果是什么?
如果不用浏览器去验证,乍一看,似乎确实没什么头绪。
我们先看一下map函数的官方解释:
map 方法会给原数组中的每个元素都按顺序调用一次callback 函数。callback 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。
map本身接受两个参数:callback回调函数和thisArg(可选的)执行 callback 函数时使用的this 值。至少到目前为止,我都没有用过这第二个参数。事实上thisArg也没什么好解释的,其实有点相当于使用call或者apply绑定的this值。我们关注的焦点在callback,他也接受3个参数:value-->当前值, index-->索引, arr-->调用map函数的数组本身。后两个参数是可选的。
那么我们再回头看一下上面的题目。
是不是可以理解为parseInt就是map方法的回调函数?那么在这种情况下parseInt会接受两个参数:数组元素本身,和索引。
我们重新拆解一下这道题目:
['1', '2', '3'].map(function (item, index) {
return parseInt(item, index)
})
是不是更容易理解了?
那么我们需要解答的也就是三次调用parseInt的返回结果。
第一次: parseInt("1", 0);
第二次: parseInt("2", 1);
第三次: parseInt("3", 2);
很好,我们回头去看一下parseInt函数:
parseInt() 函数解析一个字符串参数,并返回一个指定基数的整数 (数学系统的基础)。
用法:parseInt(string, radix);

如果仅仅看到这里,那么我们似乎能够得出答案了,三次调用结果将都返回NaN。
但是,请注意:这里有一个特殊的地方,基数radix是可选的,那么如果没有填radix,系统是如何判定的呢?不难理解,从js角度来理解,没有传递的话,系统会默认为radix=undefined

那么问题来了,undefined在JavaScript当中是一种falthy值,而JavaScript中,falthy值是可数的,我们是不是应该验证一下其他的falthy值呢?
很明显,如果radix传递的是一个falthy值的话,他会依据上述radix=undefined的处理方法处理。到这里基本上能够理解parseInt了。
但是,如果我们进一步验证radix参数值的话,会发现一件很有意思的事情。
就是如果你传递的radix值可以肉眼可见的转换成数字的话,他会将他当做数字,而明显就是非数字的值,也不可以转换成正常的数字的话,他会当做类似于falthy值来处理。这里仅仅当做笑谈而已,大可不必在意。完全没有什么研究价值。
当map遇到parseInt的更多相关文章
- 通过 ['1', '2', '3'].map(parseInt) 学习 map 和 parseInt 函数
看到一道笔试题: ['1', '2', '3'].map(parseInt) 这道题目中涉及到 map 和 parseInt 函数的运用,如果对这两个函数的理解不充分的话,是很难思考出正确的结果的. ...
- JavaScript之map与parseInt的陷阱
问题来源 这个问题的来源是学习廖雪峰老师JS教程.问题如下:小明希望利用map()把字符串变成整数,他写的代码很简洁: 'use strict'; var arr = ['1', '2', '3' ...
- JavaScript - map和parseInt的坑
问题: var arrs = ['1', '2', '3']; var r = arrs.map(parseInt); alert(r);//1,NaN,NaN map arr.map(functio ...
- 使用map()的小陷阱:parseInt
假设我们想要把一个字符串数组的每一项转换成整数,我们很自然就想到了把parseInt作为回调函数传给map()函数,但这样做可能会出现意想不到的结果: var strArr = ["1&qu ...
- ["1", "2", "3"].map(parseInt) 结果
// 下面的语句返回什么呢: ["1", "2", "3"].map(parseInt); // 你可能觉的会是[1, 2, 3] // 但 ...
- 关于面试题:[1, 2, 3].map(parseInt)问题的剖析
一.前言 最近有小伙伴在公号中咨询了胡哥这道面试题,窃以为是比较有意思的一道面试题,于此分享给各位小伙伴.先把答案给了各位,和你理解的一样吗?! [1, 2, 3].map(parseInt) // ...
- JavaScript Array.map + parseInt
map 生成新数组的函数,3个参数 1-currentValue, callback数组中正在处理的当前元素 2-index(可选): callback数组中正在处理的当前元素的索引 3-array( ...
- JavaScript map+parseInt 容易产生的误区
map /** * 语法: * var new_array = arr.map(function callback(currentValue[,index[,array]]){ * // return ...
- 面试题:JS中map的陷阱
题目: ['2', '3', '4'].map(parseInt); 请说出上面代码的执行结果 错误回答: [2, 3, 4] 真正答案: [2, NaN, NaN] 解析: 因为 map 的算子是有 ...
随机推荐
- JavaScript创建对象的方式
一.工厂模式 工厂模式是软件工程领域一种广为人知的设计模式,这种模式抽象了创建具体对象的过程. 考虑到在 ECMAScript 中无法创建类,开发人员就发明了一种函数,用函数来封装以特定接口创建对象的 ...
- sping配置头文件
spring配置文件头部xmlns配置精髓 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 <beans xmlns="http://www.s ...
- 同时使用多个JDK版本的方法
开发环境需要使用JDK1.8,但是有些系统仅支持JDK1.6,以下方法可满足此需求: 1.使用安装包安装JDK1.6,安装之后记得设置不自动更新,控制面板-JAVA: 2.使用免安装版J ...
- JavaScript新手入门 贪吃蛇
从小就在玩贪吃蛇,但是知道今天自己做了一遍才知道原理的具体的实现步骤. 刚进入界面时显示开始游戏(不重要,本人比较喜欢吹毛求疵) 中间黑色部分为游戏的主要展示部分 主要步骤及源码: body中代码,红 ...
- elipse使用,Java和Javaee模式区别
Java带有用户界面的基本ide,缺少数据库和web开发工具 IDE(Integrated Development Environment,集成开发环境).集成开发环境(简称IDE)软件是用于程序开发 ...
- 【开发】iOS入门 - Touch事件处理学习笔记
网上介绍iOS事件机制的文章,有不少都讲得很好,搬运一次意义不大,这里我就列一些要点吧. 跟Android一样,iOS的Touch事件也是从外到内传递,然后从内到外响应,可以看成一个U型结构.然而,个 ...
- 学习笔记CB001:NLTK库、语料库、词概率、双连词、词典
聊天机器人知识主要是自然语言处理.包括语言分析和理解.语言生成.机器学习.人机对话.信息检索.信息传输与信息存储.文本分类.自动文摘.数学方法.语言资源.系统评测. NLTK库安装,pip insta ...
- 对TSNU网站的初步分析
这是一个教育网的网站,其中网站的教务子系统,html页面是用表单嵌套来格式化显示样式的,另外还有<div>.<iframe>等等 .在这个上有个form表单,提交的参数有如下几 ...
- 企业SQL笔试
Student(SID, Sname, Sage, Ssex) 学生表 Course(CID, Cname, TID) 课程表 SC(SID, CID, score) 成绩 ...
- EXCEL日期格式要双击一下单元格才变正确格式
今天遇到标题问题,问度娘后看到一个大神的解答,特此记录整理. 步骤1:在excel中把文本格式日期改为想要的日期格式 步骤2:在旁边空格中输入1,并设置成日期格式,变成1900/1/1: 步骤3:复制 ...