js数组方法 forEach() map() filter() find() findIndex() every() some() include()

110 阅读2分钟

forEach():对数组进行遍历循环,对数组中的每一项运行给定函数。这个方法没有返回值。参数都是 function 类型,默认有传,。

参数分别为:遍历的数组内容;第对应的数组索引,数组本身

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

var arr = [11, 22, 33, 44, 55];

arr.forEach(function(x, index, a)

{ console.log(x +  |  + index +  |  + (a === arr));});

输出为:

11|0|true 

22|1|true 

33|2|true 

44|3|true 

55|4|true 

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

该方法不会改变原数组

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(function(item){ 
return item*item;});
console.log(arr2); //[1, 4, 9, 16, 25] 

filter():“过滤”功能,数组中的每一项运行给定函数,返回满足过滤条件组成的数组。


var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

var arr2 = arr.filter(function(x, index) { 

return index % 3 === 0 || x >= 8;

});

console.log(arr2); //[1, 4, 7, 8, 9, 10]

fill()方法能使用特定值填充数组中的一个或多个元素。当只是用一个参数时,该方法会用该参数的值填充整个数组。


let arr = [1, 2, 3,  cc , 5];

arr.fill(1);

console.log(arr);//[1,1,1,1,1];

如果不想改变数组中的所有元素,而只是想改变其中一部分,那么可以使用可选的起始位置参数与结束位置参数(不包括结束位置的那个元素)

3 个参数: 填充数值,起始位置参数,结束位置参数(不包括结束位置的那个元素)


let arr = [1, 2, 3,  arr , 5];

arr.fill(1, 2);

console.log(arr);//[1,2,1,1,1]

arr.fill(0, 1, 3);

console.log(arr);//[1,0,0,1,1];

every():判断数组中每一项都是否满足条件,只有所有项都满足条件,才会返回 true。


var arr = [1, 2, 3, 4, 5];

var arr2 = arr.every(function(x) { 

return x < 10;

});

console.log(arr2); //true

var arr3 = arr.every(function(x) { 

return x < 3;

});

console.log(arr3); // false

some():判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回 true。


var arr = [1, 2, 3, 4, 5];

var arr2 = arr.some(function(x) { 

return x < 3;

});

console.log(arr2); //true

var arr3 = arr.some(function(x) { 

return x < 1;

});

console.log(arr3); // false

includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则 false。

参数有两个,其中第一个是(必填)需要查找的元素值,第二个是(可选)开始查找元素的位置


const array1 = [22, 3, 31, 12,  arr ];

const includes = array1.includes(31);

console.log(includes); // true

const includes1 = array1.includes(31, 3); // 从索引3开始查找31是否存在

console.log(includes1); // false

需要注意的是:includes使用===运算符来进行值比较,仅有一个例外:NaN 被认为与自身相等。


let values = [1, NaN, 2];

console.log(values.indexOf(NaN));//-1

console.log(values.includes(NaN));//true

reduce()和 reduceRight() 这两个方法都会实现迭代数组的所有项(即累加器),然后构建一个最终返回的值。

reduce()方法从数组的第一项开始,逐个遍历到最后。

reduceRight()则从数组的最后一项开始,向前遍历到第一项。

4 个参数:前一个值、当前值、项的索引和数组对象


var values = [1,2,3,4,5];

var sum = values.reduceRight(function(prev, cur, index, array){

return prev + cur;

},10);   //数组一开始加了一个初始值10,可以不设默认0

console.log(sum);  //25 

find()与 findIndex()方法均接受两个参数:一个回调函数,一个可选值用于指定回调函数内部的 this。

该回调函数可接受三个参数:数组的某个元素,该元素对应的索引位置,以及该数组本身。

该回调函数应当在给定的元素满足你定义的条件时返回 true,而 find()和 findIndex()方法均会在回调函数第一次返回 true 时停止查找。

二者的区别是:find()方法返回匹配的值,而 findIndex()返回匹配位置的索引。


let arr = [1, 2, 3,  arr , 5, 1, 9];

console.log(arr.find((value, keys, arr) => {

    return value > 2;

})); // 3 返回匹配的值

console.log(arr.findIndex((value, keys, arr) => {    

  return value > 2;})); // 2 返回匹配位置的索引