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

胡哥有话说 等级 352 0 0

一、前言

最近有小伙伴在公号中咨询了胡哥这道面试题,窃以为是比较有意思的一道面试题,于此分享给各位小伙伴。先把答案给了各位,和你理解的一样吗?!

[1, 2, 3].map(parseInt) // [1, NaN, NaN]

如果你答案你都明白,请出门左转:React源码/原理了解一下。

二、剖析

这道面试题,本身并不复杂。不能正确回答问题的小伙伴,大多数集中于对parseInt这个函数的不了解或者了解的不全面,下面就由胡哥为大家抽丝剥茧一一讲述。

1. map函数

map()方法创建一个新数组,其结果是该数组中每个元素都调用一个提供的函数后返回的结果。

语法

let newArray = arr.map(function calback(currentValue[, index[, array]]) {
    // Return element for newArray
}[, thisArg])

callback回调函数

参数名 含义 可选
currentValue callback 数组中正在处理的当前元素 必选
index calback 数组中正在处理的当前元素的索引 可选
array map方法调用的数组 可选

thisArg

thisArg,可选参数,支持callback函数时值被用作this

[1, 2, 3].map((v) => {
    return v * v
})
// [1, 4, 9]

2. parseInt函数

parseInt(string, radix)将一个字符串string转为radix进制的整数,radix为介于2-36之间的数。返回值:返回解析后的整数值,如果被无法被转化成数值则返回NaN

参数名 含义 可选 默认值
string 要被解析的值。如果参数不是一个字符串,则将其转为字符串 必选
radix 基数,介于2-36之间 可选 10
parseInt(10) // 10 ---- 10进制的字符串'10'转成10
parseInt(10, 2) // 2 ---- 2进制的字符串’10‘转成2
parseInt(3, 2) // NaN --- 在2进制中不存在3

额外补充:

在基数为 undefined,或者基数为 0 或者没有指定的情况下,JavaScript 作如下处理:

如果字符串 string 以"0x"或者"0X"开头, 则基数是16 (16进制).

如果字符串 string 以"0"开头, 基数是8(八进制)或者10(十进制),那么具体是哪个基数由实现环境决定。ECMAScript 5 规定使用10,但是并不是所有的浏览器都遵循这个规定。因此,永远都要明确给出radix参数的值。

如果字符串 string 以其它任何值开头,则基数是10 (十进制)。

三、见证奇迹的时刻

在完整了解了map和parseInt函数后,我们再来看这道面试题[1, 2, 3].map(parseInt),相当于将数组中元素1, 2, 3依次传入到parseInt中,同时不要忘记了同时传入的参数数组索引index

[1, 2, 3].map(parseInt) 可看做写法为:

[1, 2, 3].map((v, index) => {
    return parseInt(v, index)
})

结果为:[parseInt(1, 0), parseInt(2, 1), parseInt(3, 2)] ===> [1, NaN, NaN]

注意此处的写法为一种方便理解的写法,实际上parseInt就充当了callback。

四、结语

以上就是胡哥关于面试题:[1, 2, 3].map(parseInt)的讲述,欢迎大家关注、留言、分享。

后记

以上就是胡哥今天给大家分享的内容,喜欢的小伙伴记得收藏转发、点击右下角按钮在看,推荐给更多小伙伴呦,欢迎多多留言交流...

胡哥有话说,一个有技术,有情怀的胡哥!京东开放平台首席前端攻城狮。与你一起聊聊大前端,分享前端系统架构,框架实现原理,最新最高效的技术实践!

长按扫码关注,更帅更漂亮呦!关注胡哥有话说公众号,可与胡哥继续深入交流呦!

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

收藏
评论区

相关推荐

Dart 基础
Dart 基础 1.类型 dart String int 整数值,其取值通常位于 253 和 253 之间 double 64bit (双精度) 浮点数,符合 IEEE 754 标准。 DateTime Map 是一个键值相关的对象。 Function 可以赋值给变量,也可以当作其他方法的参数。可使用胖箭头。可选位置参
Swift 常见面试题解
基础 1、class 和 struct 的区别 2、不通过继承,代码复用(共享)的方式有哪些 3、Set 独有的方法有哪些? 4、实现一个 min 函数,返回两个元素较小的元素 5、map、filter、reduce 的作用 6、map 与 flatmap 的区别 7、什么是 copy on write 8、如何获取当前代码的函
utils.js 文件 工具类 方法分享
javascript / 时间解析工具 @param {(Object|string|number)} time @param {string} cFormat @returns {string | null} / export function parseTime(time, cFormat) { if (arguments.leng
关于面试题:[1, 2, 3].map(parseInt)问题的剖析
一、前言 最近有小伙伴在公号中咨询了胡哥这道面试题,窃以为是比较有意思的一道面试题,于此分享给各位小伙伴。先把答案给了各位,和你理解的一样吗?! 1, 2, 3.map(parseInt) // 1, NaN, NaN 如果你答案你都明白,请出门左转:React源码/原理了解一下。 二、剖析 这道面试题,本身并不复杂。不能正确回答问题的小伙
深入不可变类 -- 谈谈Java String与包装类的底层实现
深入不可变类——谈谈String与包装类的底层实现 一、走进不可变类 不可变类是指在创建实例后该例变量不可以改变的类。 比如String类和包装类。 定义不可变类需要遵守: 1. 成员变量设置为priavte ,final修饰 2. 提供带参构造器对成员变量进行初始化 3. 只提供getter,
前端面试题自检 JS CSS 部分
JS类型 JavaScript的简单数据类型Number , String , Boolean , Undefined , Null , Symbol typeof 操作符的返回值 number string boolean undefined object function
js-Answers一
JavaScript的组成 JavaScript 由以下三部分组成: 1. ECMAScript(核心):JavaScript 语言基础 2. DOM(文档对象模型):规定了访问HTML和XML的接口 3. BOM(浏览器对象模型):提供了浏览器窗口之间进行交互的对象和方法 JS的基本数据类型和引用数据类型
js高频手写大全
1. 手写instanceofinstanceof作用:判断一个实例是否是其父类或者祖先类型的实例。instanceof 在查找的过程中会遍历左边变量的原型链,直到找到右边变量的 prototype查找失败,返回 false2. 实现数组的map方法3. reduce实现数组的map方法4. 手写数组的reduce方法reduce() 方法接收一个函数作为累
[C#]ArrayList、string、string[]之间的转换
1、ArrarList 转换为 string\[\] :  ArrayList list new ArrayList();  list.Add("aaa");  list.Add("bbb");  string\[\] arrString (string\[\])list.ToArray(typeof( string)) ;2、string\[\] 转换
Java集合之综合论述
1.Java集合 1.1 集合应用场景1. 无法预测存储数据的数量的情况下,2. 同时存储一对一关系的数据3. 需要进行数据的增删4. 数据重复问题 1.2 集合框架的体系结构 集合框架分为两类,一是Collection,用于存储类的对象。二是Map,以键值对的形式存储信息。 Collection主要有三个子接口,List(序列),Queue(队列
js数组的遍历
js中数组的遍历 1\. Map()方法Map 映射的意思,可以看做是一个映射函数,所谓的映射。一个萝卜一个坑,一 一对应的关系; 语法:const arrArray();arr.map((item,index,arr) //函数体 return ;);//参数1:数组中的每一项(必选)//参数2:索引(可选)//参数3:当前遍历的数组本身(可选)//注
前端面试题集锦(奥利给!!!)
基础知识点与高频考题 JavaScript基础console.log(1 < 2 < 3); console.log(3  2  1); // 写出代码执行结果,并解释为什么 // 答案与解析 true false 对于运算符、<,一般的计算从左向右 第一个题:1 < 2 等于 true, 然后true < 3,true  1 ,因此结果是t
你不可不知的JS面试题(第一期)
1、JS中有哪些内置类型?7种。分别是boolean、number、string、object、undefined、null、symbol。 2、NaN是独立的一种类型吗?不是。NaN是number类型。 3、如何判断是哪个类型?Object.prototype.toString.call(),返回为[object Type]。现在我们来验证一下。Objec
你不可不知的JS面试题
1、JS中有哪些内置类型?7种。分别是boolean、number、string、object、undefined、null、symbol。 2、NaN是独立的一种类型吗?不是。NaN是number类型。 3、如何判断是哪个类型?Object.prototype.toString.call(),返回为\[object Type\]。 现在我们来验证一下
腾讯T3团队整理,持续更新中
Java基础1.JAVA 中的几种数据类型是什么,各自占用多少字节。2.String 类能被继承吗,为什么。3\. 两个对象的 hashCode() 相同,则 equals() 也一定为 true,对吗?4\. String 属于基础的数据类型吗?5.Java 中操作字符串都有哪些类?它们之间有什么区别?6.Java 中 IO 流分为几种?7.BIO、NIO