ecmascript5中数组的map()方法怎么用
这篇文章将为大家详细讲解有关ecmascript 5中数组的map()方法怎么用，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。
网站建设哪家好，找创新互联！专注于网页设计、网站建设、微信开发、微信小程序开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了元宝山免费建站欢迎大家使用！
在ecmascript中，map()方法可以对数组的每个元素调用指定的回调函数进行处理，并返回包含结果的数组；语法“array.map(function(currentValue,index,arr), thisValue)”。
本教程操作环境：windows7系统、javascript1.8.5版、Dell G3电脑。
map()方法可以对数组的每个元素调用指定的回调函数进行处理，并返回包含结果的数组。
map() 方法按照原始数组元素顺序依次处理元素。
语法
array.map(function(currentValue,index,arr), thisValue)
| 参数 | 描述 |
|---|---|
| function(currentValue, index,arr) | 必须。函数，数组中的每个元素都会执行这个函数。 函数参数：
|
| thisValue | 可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。 如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。 |
map() 方法将返回一个新数组，其中每个元素均为关联的原始数组元素的回调函数返回值。对于数组中的每个元素，map() 方法都会调用 callbackfn 函数一次（采用升序索引顺序），并不会为数组中缺少的元素调用回调函数。
除了数组对象之外，map() 方法可由具有 length 属性，且具有已按编制索引的属性名的任何对象使用，如 Arguments 参数对象。
map() 方法不直接修改原始数组，但回调函数可能会修改它。在 map 方法启动后修改数组对象所获得的结果说明如表所示。
| map 方法启动后的条件 | 元素是否传递给回调函数 |
|---|---|
| 在数组的原始长度之外添加元素 | 否 |
| 添加元素以填充数组中缺少的元素 | 是，如果该索引尚未传递给回调函数 |
| 元素已更改 | 是，如果该元素尚未传递给回调函数 |
| 从数组中删除元素 | 否，除非该元素已传递给回调函数 |
示例1
下面示例使用 map() 方法映射数组，把数组中每个元素的值平方，乘以 PI 值，把返回的圆的面积值作为新数组的元素值，最后返回这个新数组。
function f (radius) {
var area = Math.PI * (radius * radius);
return area.toFixed(0);
}
var a = [10,20,30];
var a1 = a.map(f);
console.log(a1);
示例2
下面示例使用 map() 方法映射数组，把数组中每个元素的值除以一个阈值，然后返回这个新数组其中回调函数和阈值都以对象的属性存在，通过这种方法演示如何在 map 中使用 thisArg 参数。
var obj = {
val : 10,
f : function (value) {
return value % this.val;
}
}
var a = [6,12,25,30];
var a1 = a.map(obj.f, obj);
console.log(a1); //6,2,5,0
示例3
下面示例演示如何使用 JavaScript 内置方法作为回调函数。
var a = [9, 16]; var a1 = a.map(Math.sqrt); console.log(a1); //3,4
示例4
下面示例演示如何使用 map 方法应用于一个类数组。在示例中通过动态调用的方法（Call）把 map 作用于一个字符串上，则 map 将遍历字符串中每个字符，并调用回调函数 threeChars，把每个字符左右 3 个字符截取出来，映射到一个新数组中。
function f (value, index, str) {
return str.substring(index - 1, index + 2);
}
var s = "Thursday";
var a = [].map.call(s, f);
console.log(a); //Th,Thu,hur,urs,rsd,sda,day,ay
关于“ecmascript 5中数组的map()方法怎么用”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。
名称栏目：ecmascript5中数组的map()方法怎么用
当前链接：http://6mz.cn/article/ipehcc.html