前言
在JavaScript面试中，map和parseInt的组合常常被用作考察候选人对这两个方法理解深度的题目。让我们通过一个简单的例子来深入探讨其中的原理。
问题现象
['1', '2', '3'].map(parseInt) // 输出结果是什么？
很多人可能会预期输出[1, 2, 3]，但实际结果是[1, NaN, NaN]。为什么会这样？
理解map方法
首先，我们需要明确map方法的工作原理。根据文档：
array es6 新增的方法，返回一个全新数组
map方法会对数组中的每个元素调用提供的回调函数，并基于回调函数的返回值构建一个新数组。回调函数接收三个参数：
- 当前元素
- 当前元素的索引
- 原数组
parseInt函数
parseInt函数用于将字符串转换为整数。它接收两个参数：
- 要解析的字符串
- 基数（进制），表示要解析的数字是几进制的
问题分析
当我们执行['1', '2', '3'].map(parseInt)时，实际上相当于：
['1', '2', '3'].map((num, index, arr) => parseInt(num, index, arr))
即每次调用时：
-
第一次：
parseInt('1', 0, ['1', '2', '3'])-
基数为0时，JavaScript会尝试自动判断进制：
- 以"0x"或"0X"开头的字符串会被解释为十六进制
- 其他情况被解释为十进制
-
所以结果为1
-
-
第二次：
parseInt('2', 1, ['1', '2', '3'])- 基数为1是无效的（必须在2-36之间）
- 返回NaN
-
第三次：
parseInt('3', 2, ['1', '2', '3'])- 基数为2表示二进制，但’3’不是有效的二进制数字
- 返回NaN
解决方案
如果确实需要将字符串数组转换为数字数组，应该明确指定parseInt的基数为10：
['1', '2', '3'].map(num => parseInt(num, 10))
或者直接不传第二个参数，这样他会默认这个数是十进制的：
['1', '2', '3'].map(num => parseInt(num))
或者更简洁地使用Number构造函数：
['1', '2', '3'].map(Number)
面试要点
这个题目考察了几个关键点：
- 对
map方法参数的理解 - 对
parseInt函数参数的理解 - 函数作为参数传递时的行为
理解这些JavaScript基础概念对于写出健壮的代码至关重要。在面试中遇到类似问题时，应该逐步分析每个方法的参数传递和行为，而不是仅凭直觉猜测结果。
总结
JavaScript中的隐式行为常常会导致意料之外的结果。作为开发者，我们应该：
- 明确函数的参数和返回值
- 避免依赖隐式行为
- 在不确定时查阅文档或进行测试
这种深入理解语言特性的能力，正是区分初级和高级JavaScript开发者的关键所在。
