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

前言

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

正文

1. map()方法

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

语法:

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

参数

  • callback:生成新数组元素的函数,使用三个参数:
    • currentValuecallback 数组中正在处理的当前元素。
    • 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 => 15^2 + 25^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],你做对了吗?

文末

名 言 警 句 : 说 能 做 的 , 做 说 过 的 \textcolor{red} {名言警句:说能做的,做说过的}

原 创 不 易 , 还 希 望 各 位 大 佬 支 持 一 下 \textcolor{blue}{原创不易,还希望各位大佬支持一下}

点 赞 , 你 的 认 可 是 我 创 作 的 动 力 ! \textcolor{green}{点赞,你的认可是我创作的动力!}

⭐️ 收 藏 , 你 的 青 睐 是 我 努 力 的 方 向 ! \textcolor{green}{收藏,你的青睐是我努力的方向!}

✏️ 评 论 , 你 的 意 见 是 我 进 步 的 财 富 ! \textcolor{green}{评论,你的意见是我进步的财富!}

你可能感兴趣的:(面试题,JavaScript高级语法,前端,javascript,开发语言)