也是一道面试题,估计除了面试题,一般情况下,也不会写出类似的代码了。

['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. 通过 ['1', '2', '3'].map(parseInt) 学习 map 和 parseInt 函数

    看到一道笔试题: ['1', '2', '3'].map(parseInt) 这道题目中涉及到 map 和 parseInt 函数的运用,如果对这两个函数的理解不充分的话,是很难思考出正确的结果的. ...

  2. JavaScript之map与parseInt的陷阱

    问题来源 ​ 这个问题的来源是学习廖雪峰老师JS教程.问题如下:小明希望利用map()把字符串变成整数,他写的代码很简洁: 'use strict'; var arr = ['1', '2', '3' ...

  3. JavaScript - map和parseInt的坑

    问题: var arrs = ['1', '2', '3']; var r = arrs.map(parseInt); alert(r);//1,NaN,NaN map arr.map(functio ...

  4. 使用map()的小陷阱:parseInt

    假设我们想要把一个字符串数组的每一项转换成整数,我们很自然就想到了把parseInt作为回调函数传给map()函数,但这样做可能会出现意想不到的结果: var strArr = ["1&qu ...

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

    // 下面的语句返回什么呢: ["1", "2", "3"].map(parseInt); // 你可能觉的会是[1, 2, 3] // 但 ...

  6. 关于面试题:[1, 2, 3].map(parseInt)问题的剖析

    一.前言 最近有小伙伴在公号中咨询了胡哥这道面试题,窃以为是比较有意思的一道面试题,于此分享给各位小伙伴.先把答案给了各位,和你理解的一样吗?! [1, 2, 3].map(parseInt) // ...

  7. JavaScript Array.map + parseInt

    map 生成新数组的函数,3个参数 1-currentValue, callback数组中正在处理的当前元素 2-index(可选): callback数组中正在处理的当前元素的索引 3-array( ...

  8. JavaScript map+parseInt 容易产生的误区

    map /** * 语法: * var new_array = arr.map(function callback(currentValue[,index[,array]]){ * // return ...

  9. 面试题:JS中map的陷阱

    题目: ['2', '3', '4'].map(parseInt); 请说出上面代码的执行结果 错误回答: [2, 3, 4] 真正答案: [2, NaN, NaN] 解析: 因为 map 的算子是有 ...

随机推荐

  1. java.lang.UnsupportedClassVersionError: JVMCFRE003解决方法--jdk 1.6 中switch的参数无法使用String类型

    在jdk 1.6版本中,switch的参数无法使用String类型,只支持int,char,enum类型. 1.6版本之前不支持switch语句存在字符串的判断,升级到1.7或1.8及以上版本即可.

  2. Web测试常见问题点汇总

    UI测试 [目标] 确保用户可以访问产品所提供的浏览功能.符合企业或行业标准,包含用户易用性,友好性.可操作性等 [关注点] 菜单.对话框以及上边的文字.按钮.错误提示.帮助信息.图标.位置等. [常 ...

  3. git版本管理工具常用命令

    git是分布式版本管理工具,一台电脑既可以是客户端,也可以是服务端.工作过程中可以断开网络.svn是集中式版本管理工具,一台服务器控制很多客户端,使用过程不能断网. git的优点有:适合分布式开发,强 ...

  4. onkeyup+onafterpaste 只能输入数字和小数点

    1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafter ...

  5. 腾讯地图api 地址解析 js版

    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" ...

  6. Filter用户例子

    用Filter防止用户访问一些未被授权的资源,比如一个用户未登录就不允许访问网站的某些页面,并将页面重定向到需要用户登录的页面,下面是一个相关的例子: package com.drp.util.fil ...

  7. Privoxy代理的使用

    目录 1. Privoxy介绍 1.1 安装 1.2 配置 1.3 使用 1.4 其他配置 1.5 测试链接及查看配置 2. 相关信息 https://www.privoxy.org/ http:// ...

  8. centos7通过yum安装mysql8

    1.检查是否安装mariadb rpm -qa | grep mariadb 若有会显示 mariadb-libs-5.5.56-2.el7.x86_64 2.卸载mariadb rpm -e --n ...

  9. SG函数和SG定理

    Fibonacci again and again 利用SG函数求出每一堆的SG值,如果三个值的异或和为零 先手必败态,否则,先手必胜态. #include <bits/stdc++.h> ...

  10. 学习笔记TF063:TensorFlow Debugger

    TensorFlow Debugger(tfdbg),TensorFlow专用调试器.用断点.计算机图形化展现实时数据流,可视化运行TensorFlow图形内部结构.状态.有助训练推理调试模型错误.h ...