数组map方法与如何使用ES5实现

数组map方法与如何使用ES5实现

JavaScript Array map() 方法

定义

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值

map() 方法按照原始数组元素顺序依次处理元素。

注意:

  • map() 不会检测数组是否为空。
  • map() 不会改变原始数组,而是返回一个新数组。

语法

arr.map(function(curVal,idx,arr), thisVal)

参数 描述
curVal 必须,当前元素的值。
Idx 可选,当前元素的索引值。
arr 可选,当前元素属于的数组对象。
thisVal 可选,传递给函数,用作this的值。

例子

let arr = [1,2,3,4,5];
arr.map(val => val+1); // [2,3,4,5,6]

使用ES5实现map()函数

Array.prototype.myMap = function(fn, ctx) {
    let oriArr = Array.prototype.slice.call(this);
    let mappedArr = [];
    for (let i = 0; i < oriArr.length; i++) {
        if (!oriArr.hasOwnProperty(i)) {
            // 若原数组为稀疏数组,不含索引为i的元素时,mappedArr直接增加length,来达到同样的稀疏效果
            mappedArr.length++;
        } else {
            mappedArr.push(fn.call(ctx, oriArr[i], i, this));
        }
    }
    return mappedArr;
};

检测

let a = [1,2,3,,,,4,];
a.map(val => val+1); // (8)?[2, 3, 4, empty × 3, 5, empty]
a.myMap(val => val+1); // (8)?[2, 3, 4, empty × 3, 5, empty]

原文地址:https://www.cnblogs.com/zmj97/p/10966552.html

时间: 2024-11-09 04:55:53

数组map方法与如何使用ES5实现的相关文章

使用 reduce 实现数组 map 方法

//使用 reduce 实现数组 map 方法 const selfMap2 = function (fn, context){ let arr = Array.prototype.slice.call(this) // 这种实现方法和循环的实现方法有异曲同工之妙,利用reduce contact起数组中每一项 // 不过这种有个弊端,会跳过稀疏数组中为空的项 return arr.reduce((pre, cur, index) => { return [...pre, fn.call(con

js 数组 map方法

map这里的map不是“地图”的意思,而是指“映射”.[].map(); 基本用法跟forEach方法类似: array.map(callback,[ thisObject]); callback的参数也类似: [].map(function(value, index, array) { // ... }); map方法的作用不难理解,“映射”嘛,也就是原数组被“映射”成对应新数组.下面这个例子是数值项求平方: var data = [1, 2, 3, 4]; var arrayOfSquare

我能考虑到的数组(老)方法就这些了(es5)

代码注释都写的很清楚了 关键字:斐波那契数组.二维数组.多维数组(矩阵)... <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta ht

JavaScript 数组遍历方法的对比

前言 JavaScript 发展至今已经发展出多种数组的循环遍历的方法,不同的遍历方法运行起来那个比较快,不同循环方法使用在那些场景,下面将进行比较: 各种数组遍历的方法 for 语句 代码: var arr = [1,2,4,6] for(var i = 0, len = arr.length; i < len; i++){ console.log(arr[i]) } 复制代码 这是标准for循环的写法也是最传统的语句,字符串也支持,定义一个变量i作为索引,以跟踪访问的位置,len是数组的长度

ES5新增数组的方法 (indexof/forEach/map/filter)

新增的数组常见方法:以下说明中,红色为必选参数,蓝色为可选参数 1.indexOf(data,start); 用于返回某个数组或者字符串中规定字符或者字符串的位置: var arr = ["a","b","c","d","e"]; arr.indexOf("a"); //0 //返回当前查询字符所在的位置的下标,如果查询不到,返回-1,start表示从第几位开始查询. 2.forEach

一些ES5的操作数组的方法

在ES5规范中新增了不少操作数组的方法,特此罗列一下以备使用 1. forEach循环 有点类似jQuery的each循环 [12,23,36,4,5].forEach(function(v,k){ console.log(v)   得到元素值,    12,23,36,4,5 console.log(k)   得到元素下标 ,0,1,2,3,4 }) 方便在不借助三方库的情况下遍历各类数组 2.filter过滤器 用于筛选元素 var arr = [12,23,36,4,5].filter(f

数组的map方法

map方法 不支持IE6.7 .8 array1.map(fn) array1.map(fn[,thisArg]) 注意: fn 必须是函数,如果不是函数则会报错  TypeError: undefined is not a function4 map()不会对空数组进行检测.map()不会改变原是数组 1 .理解 (官方:一个新数组,其中的每个元素均为关联的原始的数组元素的回调函数的返回值) 下图中我把上面的话翻译了一下 2 .内置JavaScript方法用做回调函数,例如:Math对象方法

数组reduce和map方法

1.有一个长度为100的数组,请以优雅的方式求出该数组的前10个元素之和 var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15],sum = 0; sum = a.slice(0, 10).reduce(function(pre, current) { return pre + current;}); console.log(sum); //55 2.不使用loop循环,创建一个长度为100的数组,并且每个元素的值等于它的下标. v

数组的方法 Array.map();Array.every()和Array.some();数组的indexof();

数组的方法 Array.map(); 栗子: var a=[1,2,,3]; var b=a.map( function(value){return value*value} ); alert(b); //[1,4,,9] 参数是一个函数,有返回值 返回值是一个新数组,函数调用原数组的每个元素进行函数格式化,空元素还存在. 数组的Array.every() 每一项都是真才是真;相似于&& Array.some() 某一个是真就是真:类似于|| 当验证一个空数组时: var a=[]; va