一、大概梳理一下map和parseInt,它俩是干嘛的
1. map相关:
- 1.1
map的作用是用来遍历数组,并生成一个新数组。 - 1.2
map需要接收一个回调函数作为参数,这个回调函数的执行体内如果没有return,那么map遍历数组过程中处理每一项调用回调函数后return一个undefined,反之输出回调函数处理后的return值。 - 1.3 要求回调函数有三个形参,分别代表遍历项
item(必选)、遍历项的索引index(可选)、原数组arr(可选)。 - 1.4 ps:重点:当我们使用
map方法,只有map遍历数组时map的这个暗自运行过程中,才会进行相应的传参执行调用回调函数!!!所以我们在使用map方法时,形参上传入的参数其实是一个声明的函数或者已经声明过的函数地址,而不是直接运行调用某个函数。(此处的parseInt就是一个已经声明过可以全局使用的函数地址)
// 声明一个函数handleItem
function handleItem(item,index) {
return `原数组索引为${index}的值为${item}`
}
// 使用map方法
['1','hello', 8787687786].map(handleItem) // [ '原数组索引为0的值为1', '原数组索引为1的值为hello', '原数组索引为2的值为8787687786' ]
2. parseInt相关
- 2.1 公共的全局方法
parseInt,它本身自带return - 2.2
parseInt(参数1,参数2),parseInt函数执行的就是将参数1转化为参数2要求的进制并输出。所以不难理解,参数1表示要转化处理前的值,参数2为进制数要求(比如:2、3、10等等),若参数2为空==> 触发默认值2(2进制)。 - 2.3
parseInt(参数1,参数2)输出结果有两种情况,第一种是得到相应的正确值,第二种是NaN
parseInt(1,2) // 1
parseInt(10,2) // 2
parseInt(11,2) // 3
parseInt(100,2) // 4
parseInt(6355,10) // 6355
parseInt(211,2) // NaN
parseInt(3,2) // NaN
parseInt(010,2) // NaN
...
- 2.4
parseInt(参数1),如果参数2为空,默认就是10进制(注意实际上与map一起使用的时候,触发默认值是2而不是10 )。如果传参为浮点型,那么是对其浮点型取整,如果是字符串,那么是触发强制数据类型转换再进行运算
parseInt(12) // 12
parseInt(12.12121212) // 12
parseInt('12.12121212') // 12
二、有了上边的知识支撑,建立map、parseInt的同时使用联系
所以在使用map的时候,对 map形参需要的参数,传入parseInt这个函数地址
[1,2,3,4].map(parseInt) // [1, NaN, NaN, NaN]
// 理解其原理,等价如下(以下几行其实是多此一举,可以选择跳过不看):
function handleNum(param1,param2 = 2) {
return parseInt(param1, param2)
}
// 测试 handleNum(100,2) ==> 4
[1,2,3,4].map(handleNum) // [1, NaN, NaN, NaN]
ps:为什么理解的时候不能这么写:[1,2,3,4].map(handleNum(item,index)),这是对“步骤一 1.4”的重点理解
[1,2,3,4].map(handleNum(item,2)) // 浏览器报错,Uncaught ReferenceError: item is not defined
三、总结
以上就是对该[1,2,3].map(parseInt)类似问题的个人理解 <==>
其实也就是:
- 对
map方法的作用以及如何使用的一个理解、 - 对
parseInt方法的作用以及如何使用的一个理解、 - 重中之重:js中几大难点之回调函数(尤其重要)。3.1
map的形参需要接收一个回调函数。它可以是声明过的函数的地址(或者函数变量名),也可以是直接写入其中的匿名函数。就像我们平时使用map的时候的这样--map(function(item, index, arr){ // 执行体... }))。3.2 无论是哪种回调函数进行传参,都只是传入的未执行的函数声明,而不是执行调用。真正调用该回调的时机由map方法内部接口决定,即map方法被使用后的某个时间节点决定,人为不可干涉。(理解上就是,map方法内部接口在执行遍历原数组的每一项时,当遍历这个动作产生,执行到具体的某一项,就中间停止,进行处理原数组该项,也就是此时调用回调函数,对该项处理完毕后,再次执行遍历到下一项,又再次执行回调处理那一项..依次直到结束/报错)