【JS面试题】面试官：“[1,2,3].map(parseInt)“ 输出结果是什么？答上来就算你通过面试

还在担心面试不通过吗？给大家推荐一个超级好用的刷面试题神器：牛客网，里面涵盖了各个领域的面试题库，还有大厂真题哦！

赶快悄悄的努力起来吧，在这里衷心祝愿各位大佬都能顺利通过面试。
面试专栏分享，感觉有用的小伙伴可以点个订阅，不定时更新相关面试题：面试专栏 。

文章目录

• ??前言
• ??正文
• • 1. `map()`方法
  • • 语法：
    • 参数
    • 返回值
    • 代码示例
  • 2. `parseInt()`函数
  • • 语法
    • 参数
    • 返回值
    • 描述
    • 代码示例
  • 3. 题目详解来咯
• ??文末

??前言

前端面试中我们可能遇到很多种有趣的面试题，就比如标题这种。对于这种问题，我们一定不能慌，要冷静分析一下。
首先我们要掌握map方法和parseInt函数的作用,才能去知道这个问题的输出结果，如果不是很熟练的话，就跟着我的思路学习一下吧。

??正文

1. map()方法

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

语法：

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
 // Return element for new_array 
}[, thisArg])

参数

• callback：生成新数组元素的函数，使用三个参数：
  • currentValue：callback 数组中正在处理的当前元素。
  • index可选：callback 数组中正在处理的当前元素的索引。
  • array可选：map 方法调用的数组。
• thisArg可选：执行 callback 函数时值被用作this。

返回值

回调函数的结果组成了新数组的每一个元素。

代码示例

const arr = [1,2,3,4]
const result = arr.map(function(num){
    return num+2
})
console.log(result)// [ 3, 4, 5, 6 ]

上述示例代码想得到的效果是：遍历arr中的元素，返回每个元素值加2的结果

2. parseInt()函数

parseInt(string, radix) 将一个字符串 string 转换为 radix 进制的整数， radix 为介于2-36之间的数。

语法

parseInt(string, radix);

参数

• string：要被解析的值。如果参数不是一个字符串，则将其转换为字符串(使用 ToString 抽象操作)。字符串开头的空白符将会被忽略。
• radix：一个介于2和36之间的整数(数学系统的基础)，表示上述字符串的基数。比如参数 10 表示使用十进制数值系统。始终指定此参数可以消除阅读该代码时的困惑并且保证转换结果可预测。当未指定基数时，不同的实现会产生不同的结果，通常认为其值默认为10，但是如果你的代码运行在过时的浏览器中，那么请在使用时总是显式地指定 radix。

返回值

返回解析后的整数值。 如果被解析参数的第一个字符无法被转化成数值类型，则返回 NaN。

注意：radix参数为n 将会把第一个参数看作是一个数的n进制表示，而返回的值则是十进制的。例如：parseInt(‘123’, 5) // 将’123’看作5进制数，返回十进制数38 => 1_5^2 + 2_5^1 + 3*5^0 = 38

描述

parseInt 函数将其第一个参数转换为字符串，解析它，并返回一个整数或NaN。如果不是NaN，返回的值将是作为指定基数（基数）中的数字的第一个参数的整数。

代码示例

parseInt("546", 2);   //NaN     除了“0、1”外，其它数字都不是有效二进制数字
parseInt("F", 16); // 15 
parseInt(4.7, 10); // 4
parseInt(11,8); // 9 => 1*8+1

3. 题目详解来咯

我们一步步来现将数组与map

原题

const result = [1, 2, 3].map(parseInt)
console.log(result)

题目拆解

// 首先新建一个nums数组存我们的三个数组
const nums = [1, 2, 3]
// 将nums数组用map方法进行遍历返回parseInt函数处理后的值
const result = nums.map((item, index) => {
    /* 
        item:1,index:0    
        item:2,index:1
        item:3,index:2
    */
    return parseInt(item, index)
    // parseInt(1,0)   radix值为0，表示没有，默认使用十进制，返回 1
    // parseInt(2,1)   不满足radix范围2-36，返回 NaN
    // parseInt(3,2)   二进制不会出现3这个值，所以返回NaN

})
console.log(result) // [1,NaN,NaN]



所以这道题的答案就是 [1,NaN,NaN]，你做对了吗？

---

??文末

名 言 警 句 ： 说 能 做 的 ， 做 说 过 的 extcolor{red} {名言警句：说能做的，做说过的} 名言警句：说能做的，做说过的

原 创 不 易 ， 还 希 望 各 位 大 佬 支 持 一 下 extcolor{blue}{原创不易，还希望各位大佬支持一下} 原创不易，还希望各位大佬支持一下

?? 点 赞 ， 你 的 认 可 是 我 创 作 的 动 力 ！ extcolor{green}{点赞，你的认可是我创作的动力！} 点赞，你的认可是我创作的动力！

收 藏 ， 你 的 青 睐 是 我 努 力 的 方 向 ！ extcolor{green}{收藏，你的青睐是我努力的方向！} 收藏，你的青睐是我努力的方向！

评 论 ， 你 的 意 见 是 我 进 步 的 财 富 ！ extcolor{green}{评论，你的意见是我进步的财富！} 评论，你的意见是我进步的财富！

先自我介绍一下，小编13年上师交大毕业，曾经在小公司待过，去过华为OPPO等大厂，18年进入阿里，直到现在。深知大多数初中级java工程师，想要升技能，往往是需要自己摸索成长或是报班学习，但对于培训机构动则近万元的学费，着实压力不小。自己不成体系的自学效率很低又漫长，而且容易碰到天花板技术停止不前。因此我收集了一份《java开发全套学习资料》送给大家，初衷也很简单，就是希望帮助到想自学又不知道该从何学起的朋友，同时减轻大家的负担。添加下方名片，即可获取全套学习资料哦