JavaScript常用数组API（2）

数组API

indexOf

描述：indexOf用于在数组中arr中查找searchElement

找到第一个匹配元素后返回它在数组中的索引值

没有找到则返回-1

语法： arr.indexOf(searchElement[,fromIndex=0]);

参数：searchElement需要在数组中查找的元素

fromIndex（number）开始查找的索引，默认值0

返回值：返回searchElement在arr中的索引值

var arr = [1, 2, 32, 4, 5, 226, 1, 32, 56];
console.log(arr.indexOf(32, 3));//7

//indeOf的原理分析
var arr = [1, 2, 32, 4, 5, 226, 1, 32, 56];// console.log(arr.indexOf(32, 5));Array.prototype.indexof = function(searchElement, fromIndex) {fromIndex = fromIndex || 0;// console.log(this);// this关键字出现在函数中，谁调用该函数，this就指向谁for (var i = fromIndex; i < this.length; i++) {if (this[i] === searchElement) return i;}return -1;
}
console.log(arr.indexof(32, 5));

forEach

描述：forEach函数会遍历数组为每一个数组的元素执行一个回调函数

语法：arr.forEach(callback);

参数：callback（回调函数）

回调参数：currentValue 当前值

[index] 当前值对应的索引

[array] 当前数组

var arr = [1, 2, 3, 4, 5];
arr.forEach(function(currentValue, index) {console.log(currentValue, index);
});arr.forEach(function(val) {console.log(val * 5);
});

//forEach原理分析
Array.prototype.foreach = function(callback) {for (var i = 0; i < this.length; i++) {callback(this[i], i, this);// this关键字出现在函数中，谁调用该函数，this就指向谁}
}
var arr2 = [2, 3, 4, 5, 6];
arr2.foreach(function(val, i) {console.log(val, i);
});

filter

描述：filter方法用于检测数组中的每一个元素是否符合给定函数中的布尔表达式条件

将所有结果为true的数组组成一个新数组并返回

语法：arr.filter(callback);

参数：callback（回调函数）

回调参数：currentValue 当前值

[index] 当前值对应的索引

[array] 当前数组

返回值：新数组，包含了所有通过测试的元素

var arr = [6, 543, 867, 543, 32, 13, 12, 11, 28, 513, 52];
//选出数组中所有的偶数//for循环var arr2 = [];for (var i = 0; i < arr.length; i++) {if (arr[i] % 2 == 0) arr2.push(arr[i]);}console.log(arr2);//forEacharr.forEach(function(elm) {if (elm % 2 == 0) arr2.push(elm);});console.log(arr2);//filtervar result = arr.filter(function(val) {return val % 2;});console.log(result);
//选出age大于18的对象var data = [{name: 'zhangsan',age: 25}, {name: 'lisi',age: 15}, {name: 'wangwu',age: 13}, {name: 'zhaoliu',age: 27}, {name: 'fengqi',age: 11}];var result = data.filter(function(val) {return val.age >= 18;});console.log(result);

//filter原理分析
Array.prototype.filter1 = function(callback) {var result = [];for (var i = 0; i < this.length; i++) {if (callback(this[i], i, this)) {result.push(this[i]);}}return result;
}
var arr = [6, 543, 867, 543, 32, 13, 12, 11, 28, 513, 52];
var result = arr.filter1(function(val, i) {return val % 2 == 0;
});
console.log(result);

map

描述：映射

1、遍历数组为数组中的每一个元素执行一个回调函数传入每一个元素

2、修改(操作)数组中的元素

3、返回一个修改后的新数组

语法：arr.map(callback);

参数：callback（回调函数）

回调参数：currentValue 当前值

[index] 当前值对应的索引

[array] 当前数组

返回值：新数组

//奇数乘3偶数乘4
var arr = [1, 2, 3, 4, 5];arr = arr.map(function(val) {if (val % 2) {return val * 3;} else {return val * 4;}});
console.log(arr);
//挑选出对象中的age并将数值放到一个新的数组var data = [{name: 'zhangsan',age: 25}, {name: 'lisi',age: 15}, {name: 'wangwu',age: 13}, {name: 'zhaoliu',age: 27}, {name: 'fengqi',age: 11}];var result = data.map(function(val) {return {ee: val.age};});console.log(result);

//map原理
Array.prototype.map1 = function(callback) {var result = [];for (var i = 0; i < this.length; i++) {result.push(callback(this[i], i, this));}return result;
}var arr = [2, 654, 1, 32, 6];
var arr2 = arr.map1(function(val) {return val / 2;
});
console.log(arr2);
console.log(arr);

every

描述： every会遍历数组，为每一个数组的元素执行一个回调函数

在回调函数中提供一个布尔表达式，如果数组中的每一个元素都通过布尔表达式的测试则every的结果返回true，否则返回false

语法： arr.every(callback(element[,index[,array]]));

参数：callback（回调函数）

回调参数： element 元素

[index] 当前值对应的索引

[array] 当前数组

返回值：布尔值

//判断数组中的每一个元素是否都是奇数
var arr = [15, 221, 31, 77, 19];
var result = arr.every(function(val) {return val % 2;
});
console.log(result);//判断年龄是成年人
var data = [{name: 'zhangsan',age: 25
}, {name: 'lisi',age: 18
}, {name: 'wangwu',age: 21
}, {name: 'zhaoliu',age: 27
}, {name: 'fengqi',age: 19
}];
var res = data.every(function(val) {return val.age >= 18;
});
console.log(res);

//every原理
Array.prototype.every1 = function(callback) {var temp;for (var i = 0; i < this.length; i++) {temp = callback(this[i], i, this);if (!temp) return false; // 只要有一个是false就retrun结果}return true; //循环结束都没有false则返回true
}
var arr = [152, 221, 31, 77, 19];
var res = arr.every1(function(val) {return val % 2;
});
console.log(res);

some

描述： some会遍历数组，为每一个数组的元素执行一个回调函数

在回调函数中提供一个布尔表达式，如果数组中有一个元素都通过布尔表达式的测试则every的结果返回true，否则返回false

语法： arr.some(callback(element[,index[,array]]));

参数：callback（回调函数）

回调参数： element 元素

[index] 当前值对应的索引

[array] 当前数组

返回值：布尔值

var arr = [1, 2, 3, 4, 5];
var res = arr.some(function(val) {return val > 10;
});
console.log(res);

reduce

描述：归并

语法：arr.reduce(callback[,object]);

参数：callback(function)

object 传入到回调中的对象

回调参数：

prev 上一个

next 下一个

当拥有object参数时

回调参数：

object

currentValue

返回值：归并结果

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.reduce(function(prev, next) {// 当回调设置返回值后,prev是前一次的返回值// 没有设置返回值为undefined// 第一次调用回调时，prev是数组中的一个值// next始终是下一个值console.log(prev, next);return 2;
});
//求和
var result = arr.reduce(function(prev, next) {return prev + next;
});
console.log(result);//统计
var arr = [6, 54, 24, 325, 34, 5, 4363, 1654, 87, 6, 327];
var result = arr.reduce(function(obj, cur) {// console.log(obj, cur);cur % 2 ? obj.odd++ : obj.even++;obj.sum += cur;return obj;
}, {odd: 0,even: 0,sum: 0});
console.log(result);

//reduce原理
Array.prototype.reduce1 = function(callback, object) {var result; // 用于临时存放 结果对象if (typeof object === 'object' && object !== null) {for (var i = 0; i < this.length; i++) {result = callback(object, this[i]);}return result;}
}var arr = [1, 2, 3, 4, 5, 6, 7];
var result = arr.reduce1(function(obj, current) {current % 2 ? obj.odd++ : obj.even++;return obj;
}, {odd: 0,even: 0
});console.log(result);

find

描述：find方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

语法：arr.find(callback);

参数：callback(function)

回调函数：currentValue

index

array

返回值：返回第一个符合布尔表达的值

var arr = [11, 654, 65, 35, 72];
var result = arr.find(function(val) {return val % 5 == 0;
});
console.log(result);

//find原理
Array.prototype.find1 = function(callback) {for (var i = 0; i < this.length; i++) {if (callback(this[i], i, this)) {return this[i];}}
}var arr = [11, 654, 65, 35, 72];
var result = arr.find1(function(val) {return val % 17 == 0;
});console.log(result);

findIndex

描述：findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1

语法：arr.findIndex(callback);

参数：callback(function)

回调参数：currentValue

index

array

var arr = [11, 654, 65, 35, 72];
var index = arr.findIndex(function(val) {return val % 19 == 0;
});
console.log(index);

//findIndex原理
Array.prototype.findIndex1 = function(callback) {for (var i = 0; i < this.length; i++) {if (callback(this[i], i, this)) {return i;}}return -1;
}