map在js中的功能相当强大,故整理此文加深记忆。
一、概念
map()
方法定义在JavaScript的Array
中,它返回一个新的数组,新返回数组中的每个元素为原始数组的每一个元素分别调用map中的回调函数处理后的值。
注意:
map()
不会对空数组进行检测map()
不会改变原始数组(返回新数组)map()
不会为数组中缺少的元素调用回调函数- 除数组对象外,
map()
可由具有length属性且具有已按数字编制索引名的任何对象使用(如字符串对象)
二、语法
array.map(function(currentValue, index, arr), thisIndex)
参数说明:
function(currentValue, index, arr)
:必须。为一个回调函数,数组中的每个元素都会执行这个函数。其中函数参数:
currentValue
:必须。当前元素的的值。index
:可选。当前元素的索引。arr
:可选。当前元素属于的数组对象。
thisValue
:可选。对象作为该执行回调时使用,传递给函数,用作"this
"的值。
三、应用
案例一
var arr = [1,2,3].map(parseInt);
document.write(arr);
结果如下:
分析:
(1)原始数组为[1,2,3],回调函数为parseInt()方法,返回的新数组为arr;
(2)作为回调函数,parseInt()被传递了三个参数:currentValue, index, arr
;
(3)parseInt(string,radix)函数可解析一个字符串,并返回一个整数,即将string解析为以radix为基准的有符号整数。其中:
string:必需。要被解析的字符串。
radix:可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。如果省略该参数或其值为 0,则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头,将以 16 为基数。如果该参数小于 2 或者大于 36,则 parseInt() 将返回 NaN。当参数 radix 的值为 0,或没有设置该参数时,parseInt() 会根据 string 来判断数字的基数。(如果 string 以 "0x" 开头,parseInt() 会把 string 的其余部分解析为十六进制的整数。如果 string 以 0 开头,那么 ECMAScript v3 允许parseInt() 的一个实现把其后的字符解析为八进制或十六进制的数字。如果 string 以 1 ~ 9 的数字开头,parseInt()将把它解析为十进制的整数。)
a、只有字符串中的第一个数字会被返回;
b、如果字符串的第一个字符不能被转换为数字,那么 parseFloat() 会返回 NaN;
(4)根据map的概念:分别对数组的每一个元素调用回调函数,则:
arr = [1,2,3].map(parseInt) = [parseInt(1,0),parseInt(2,1),parseInt(3,2)] = [1,NaN,NaN];
关于parseInt(3,2) = NaN的解释:
parseInt(string,radix) 方法规定 radix的值应该大于等于2或者小于36,即介于2~36之间。
a、parseInt(3,2)满足radix介于2~36之间的条件;
b、由于radix=2是作为基数,要将字符串3转换为基数为2的整数,基数为2的数中仅包含0、1、2三个数,3不在基数为2的 数中,因此parseInt(3,2) = NaN。
案例二
var arr = [1,1,1,1].map(parseInt);
document.write(arr);
结果如下:
分析:
var arr = [1,1,1,1].map(parseInt) = [parseInt(1,0),parseInt(1,1),parseInt(1,2),parseInt(1,3)] = [1,NaN,1,1];
parseInt(1,1)中radix参数小于2,因此返回NaN。