JavaScript中数组的22种方法必学(推荐)(6)

if (typeof Array.prototype.reduce != "function") { Array.prototype.reduce = function (callback, initialValue ) { var previous = initialValue, k = 0, length = this.length; if (typeof initialValue === "undefined") { previous = this[0]; k = 1; } if (typeof callback === "function") { for (k; k < length; k++) { this.hasOwnProperty(k) && (previous = callback(previous, this[k], k, this)); } } return previous; }; }

【reduceRight()】

　　reduceRight()的工作原理和reduce()一样，不同的是它按照数组索引从高到低（从右到左）处理数组，而不是从低到高

var values = [1,2,3,4,5]; var sum = values.reduceRight(function(prev, cur, index, array){ console.log(prev,cur); return prev + cur; }); console.log(sum); //5 4 //9 3 //12 2 //14 1 //15

　reduceRight()方法兼容写法

if (typeof Array.prototype.reduceRight != "function") { Array.prototype.reduceRight = function (callback, initialValue ) { var length = this.length, k = length - 1, previous = initialValue; if (typeof initialValue === "undefined") { previous = this[length - 1]; k--; } if (typeof callback === "function") { for (k; k > -1; k-=1) { this.hasOwnProperty(k) && (previous = callback(previous, this[k], k, this)); } } return previous; }; }

数组迭代方法

　　ECMAScript5为数组定义了5个迭代方法。每个方法都接收两个参数：要在每一项上运行的函数和（可选的）运行该函数的作用域对象——影响this的值。传入这些方法中的函数会接收三个参数：数组项的值、该项在数组中的位置和数组对象本身。根据使用的方法不同，这个函数执行后的返回值可能会也可能不会影响访问的返回值

function(item,index,array){ //todo }

【map()】

　　map()方法对数组的每一项运行给定函数，返回每次函数调用的结果组成的数组

//f是array的每一个元素调用的函数。它的返回值成为返回数组的元素；o是f调用时的可选this值 array.map(f,o); [1,2,3].map(function(item,index,arr){return item*item});//[1,4,9] [1,2,3].map(function(item,index,arr){return item*index});//[0,2,6]

　map()方法还可以接受第二个参数，表示回调函数执行时this所指向的对象

var arr = ['a','b','c']; [1,2].map(function(item,index,arr){return this[item]},arr);//['b','c']

在实际使用的时候，可以利用map()方法方便获得对象数组中的特定属性值

var users = [{name:'t1',email:'t1@qq.com'},{name:'t2',email:'t2@qq.com'},{name:'t3',email:'t3@qq.com'}]; console.log(users.map(function(item,index,arr){return item.email}));//["t1@qq.com", "t2@qq.com", "t3@qq.com"]

map()方法还可以用于类数组对象

Array.prototype.map.call('abc',function(item,index,arr){return item.toUpperCase()});//["A", "B", "C"]

　对于稀疏数组，map()方法不会在实际上不存在元素的序号上调用函数

var a = [1,,3]; console.log(a.map(function(item,index,arr){return item*2;}));//[2, 2: 6]

　map()方法兼容写法

if (typeof Array.prototype.map != "function") { Array.prototype.map = function (fn, context) { var arr = []; if (typeof fn === "function") { for (var k = 0, length = this.length; k < length; k++) { arr.push(fn.call(context, this[k], k, this)); } } return arr; }; }

【forEach()】

　　forEach()方法对数组中的每一项运行给定函数，这个方法没有返回值。本质上与for循环迭代数组一样。如果需要有返回值，一般使用map方法

[1,2,3,4].forEach(function(item,index,arr){ console.log(item) }); //1 //2 //3 //4

　　类似于如下的for循环

var array = [1, 2, 3, 4]; for (var k = 0, length = array.length; k < length; k++) { console.log(array[k]); }

　　使用forEach()方法实现简单的加法

var sum = 0; [1, 2, 3, 4].forEach(function (item, index, array) { sum += item; }); console.log(sum);//10

　　forEach()方法除了接受一个必须的回调函数参数，第二个参数还可以接受一个可选的上下文参数(改变回调函数里面的this指向)

var out = []; [1, 2, 3].forEach(function(elem){ this.push(elem * elem); }, out); console.log(out);// [1, 4, 9]

　　第二个参数对于多层this非常有用，因为多层this通常指向是不一致的，可以使用forEach()方法的第二个参数固定this

var obj = { name: '张三', times: [1, 2, 3], print: function () { //该this指向obj console.log(this); this.times.forEach(function (n) { //该this指向window console.log(this); }); } };