在我们的日常开发中,
操作和
转换数组是一种非常常见的操作。下面我们来看一个例子:
复制代码代码如下所示:
无功descolors = { },
srccolors = {
{:255,g:255,b:255 }, /白色
{:128,g:128,b:128 },灰色
{:0,g:0,b:0 }
};
对于(var i = 0,艾朗= srccolors.length;i <艾朗;i++){
VaR的颜色= srccolors {我},
格式=
函数(颜色){
返回math.round(颜色 / 2);
};
DesColors.push({
R:格式(颜色),
g:格式(颜色),
B:格式(颜色B)
});
}
输出:
{ /
:128,g:128,b:128 },
:64,g:64,b:64 },
:0,g:0,b:0 }
;
console.log(descolors);
从以上可以看出,所有的重复率比较高,如何
优化它,幸运的是ECMAscript 5为我们提供了一个
方法,地图,我们可以用它来优化以上:
复制代码代码如下所示:
无功srccolors = {
{:255,g:255,b:255 }, /白色
{:128,g:128,b:128 },灰色
{:0,g:0,b:0 }
},
descolors = srccolors.map(
功能(Val){
var格式=函数(颜色){
返回math.round(颜色 / 2);
};
返回{
R:格式(val.r),
G:格式(val.g),
B:格式(val.b)
}
});
输出:
{ /
:128,g:128,b:128 },
:64,g:64,b:64 },
:0,g:0,b:0 }
;
console.log(descolors);
从上面的例子可以看出,我们使用map来代替for循环,它只需要对每个元素本身实现逻辑上的关心。请在这里
详细说明map方法的细节。
1.map基本定义:
Array.map(thisarg回调{,});
map方法调用原始数组中的每个元素,以便按
顺序调用回调函数。每次
执行后回调函数的返回值组合起来形成一个新数组。回调函数只在值索引上调用;未赋值的索引或使用
删除删除的索引不被调用。
回调函数将自动传递到三个
参数:数组元素、元素索引和原始数组本身。
如果thisarg参数的值,这将指向对象的thisarg参数每次回调函数被调用。如果省略thisarg参数,或指定一个空值或定义,那么这一点对全局对象。
map不会
修改调用它的原始数组本身(当然,当回调执行时它可以更改原始数组)。
当数组
运行图的方法,数组的长度是在第一次回调方法被调用来确定。地图的方法的整个操作过程中,元素被添加或删除的操作在回调函数中原始数组,映射方法将不知道如果数组中的元素的增加,新加入的元素将不会被地图。如果数组元素被减少了,那么map方法也将假定原始数组的长度不变,导致数组访问。如果数组中的元素被更改或删除,它们传递到回调中的值就是map方法遍历到它们时刻的值。
2.map例子:
复制代码代码如下所示:
示例:映射方法调用字符串
VaR结果= array.prototype.map.call(你好世界
字符串{ 0
console.log(ARR);
返回x.charcodeat(0);
});
输出:{ 72, 101, 108、108, 111, 32、119, 111, 114、108, 100 }
console.log(结果);
这个例子演示了在一个字符串中的每个字符的ASCII码的获取相应的字符串数组的使用方法图组成。请注意
打印console.log结果(ARR)印刷。
复制代码代码如下所示:
例二:操作结果下面是什么
var结果1
输出:{ 1,南,楠}
console.log(结果);
也许你有一个问题,为什么不是{1,2,3}我们知道,parseInt方法可接受两个参数,第一个参数是要转换的值,第二个参数是多少,和未知的可以盖在这里。当我们使用地图的方法,回调函数接受三个参数,和parseInt只能接受两个参数,第三个参数是直接丢弃,同时,parseInt通过索引值为十六进制,返回南数。看看下面的输出。
复制代码代码如下所示:
/ /输出:1
console.log(parseInt(1
/ /输出:1
console.log(parseInt(1
/ /输出:楠
console.log(parseInt(2
/ /输出:楠
console.log(parseInt(3
下两个很容易理解,但是为什么前两个返回到1为了解释这一点,让我们看看官方描述:
如果雷迪克斯未定义或0(或不存在),Javascript假定如下:
a)如果
输入字符串开始0x或0X,基数是。
b如果输入字符串开始)0
c)如果输入字符串以任何其他值开头,则基数为10。
在第三点时,当字符串是另一个值时,
默认值是10。
那么我们如何对上面的正常输出进行修改呢请看下面:
复制代码代码如下所示:
var结果1
返回parseInt(Val,10);
});
输出:{ 1, 2, 3 }
console.log(结果);
3.map相容性的方法:
地图的方法不是通过IE8及以下的
浏览器
支持。为了兼容旧版本的浏览器,你可以:
A)不使用地图。B)使用像ES5垫片使老,使)。
以上是map方法的理解,希望对初学者有所帮助,错了,还可以回头看看!