JS中map和parseInt的用法详解

作者:异步漫步时间:2026-10-31 04:28:42浏览:449

本文详解JavaScript中map方法与parseInt函数的配合使用。map回调默认传递元素、下标和原数组三个参数,而parseInt仅接收一个参数时,会将下标误作基数,导致非0和1的下标返回NaN。文章解析了参数传递机制,并给出正确转换数组字符串为整数的解决方案。

map

map函数旨在生成包含原数组各元素经回调处理结果的新数组,且原数组保持不变。

参数

map(callbackFn, thisArg)

callbackFn为回调函数,遍历数组每个元素并执行处理,结果存入新数组。调用时传入以下参数:

  • item表示当前处理的元素
  • index表示当前处理元素的下标
  • arr表示原始数组

thisArg(可选)用于指定回调函数内的this指向

使用

// 给数组中每一项增加一个label属性!
const arr = [{name:'测试1'},{name:'测试2'},{name:'测试3'}]
const newArr = arr.map(item=>{
  item.label = '通过map添加'
  return item
})
// 结果: newArr =  [{name:'测试1',label: "通过map添加"},{name:'测试2',label: "通过map添加"},{name:'测试3',label: "通过map添加"}]

由于开发中常使用箭头函数,thisArg参数在实际场景中较少使用。

const arr = [{name:'测试1'},{name:'测试2'},{name:'测试3'}]
const newArr = arr.map(function(item){
  console.log(this); // Number {1}
},1)

map与parseInt结合使用

通常map回调仅接收一个item参数,这可能导致如下情况:

console.log(["1", "2", "3"].map(parseInt));

map

预期输出 [1, 2, 3],实际结果为 [1, NaN, NaN]。原因在于map执行回调时默认传递三个参数,而parseInt接收到的第二个参数为下标,从而导致 [1, NaN, NaN] 的结果!

# parseInt() string(必选),待解析的字符串 radix(可选),解析数字的基数 radix取值范围2至36。若省略或为0,默认以10为基数;若字符串以0x或0X开头,则以16为基数。若radix小于2或大于36,parseInt()返回NaN。

本文关于JS中map和parseInt用法的详解到此结束,更多相关JS map parseInt内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!

作者最新文章