8种在JavaScript数组中查找指定元素的方法（用于开发中数据的处理）

1、Array.prototype.includes()

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

该方法支持两个参数valueToFind，fromIndex（可选），第一个参数是‘需要查找的元素值’,第二个参数是‘从哪个索引处开始查找’，第二个参数如果为负数，则会按升序从 array.length + fromIndex 的索引开始查找（即使从末尾开始往前跳 fromIndex 的绝对值个索引，然后往后搜寻）。

var a = [1,2,3,4,5,6]a.includes(2)  // true
a.includes(2,3)  // false
a.includes(5,-2)  // true
a.includes(5,-1)  // false

2、 Array.prototype.indexOf()

indexOf() 方法返回指定元素在数组中的第一个索引，如果不存在，则返回-1。

该方法支持两个参数searchElement，fromIndex （可选），第一个参数是‘要查找的元素’，第二个参数是‘开始查找的索引位置’，如果该索引值大于或等于数组长度，意味着不会在数组里查找，返回-1。

如果参数中提供的索引值是一个负值，则将其作为数组末尾的一个抵消，即-1表示从最后一个元素开始查找，-2表示从倒数第二个元素开始查找，以此类推。

注意：如果参数中提供的索引值是一个负值，并不改变其查找顺序，查找顺序仍然是从前向后查询数组。如果抵消后的索引值仍小于0，则整个数组都将会被查询。其默认值为0。

var array = [2, 5, 9];array.indexOf(2);     // 0
array.indexOf(7);     // -1
array.indexOf(9, 2);  // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0

3、Array.prototype.lastIndexOf()

lastIndexOf() 方法返回指定元素在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，从 fromIndex 处开始。

该方法支持两个参数 searchElement，fromIndex（可选），第一个参数是‘被查找的元素’。第二个参数是‘从此位置开始逆向查找’，默认为数组的长度减 1(arr.length - 1)，即整个数组都被查找。

如果该值大于或等于数组的长度，则整个数组会被查找。

如果为负值，将其视为从数组末尾向前的偏移。即使该值为负，数组仍然会被从后向前查找。

如果该值为负时，其绝对值大于数组长度，则方法返回 -1，即数组不会被查找。

var array = [2, 5, 9, 2];array.lastIndexOf(2);      // 3
array.lastIndexOf(7);      // -1
array.lastIndexOf(2, 3);   // 3
array.lastIndexOf(2, 2);   // 0
array.lastIndexOf(2, -2);  // 0
array.lastIndexOf(2, -1);  // 3

4、Array.prototype.some()

some() 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个 Boolean 类型的值。

语法：arr.some(callback(element[, index[, array]])[, thisArg])
「参数」：

callback：用来测试每个元素的函数，接受三个参数：

element 数组中正在处理的元素。

index 可选，数组中正在处理的元素的索引值。

array 可选，被遍历的数组本身。

thisArg：可选，执行 callback 时使用的 this 值。

下面的例子检测在数组中是否有元素大于 10。

function isBiggerThan10(element, index, array) {
return element > 10;
}

[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
[12, 5, 8, 1, 4].some(isBiggerThan10); // true
还可以使用箭头函数实现相同的效果。[2, 5, 8, 1, 4].some(x => x > 10);  // false
[12, 5, 8, 1, 4].some(x => x > 10); // true

5、 Array.prototype.every()

every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。

该方法的参数与 Array.prototype.some() 方法一样，这里就不再介绍了。它们两不同的是，some()只要数组中有一个元素满足条件就为真，every()要全部满足条件才为真。
检测数组中的所有元素是否都大于 10。

function isBigEnough(element, index, array) {return element >= 10;
}
[12, 5, 8, 130, 44].every(isBigEnough);   // false
[12, 54, 18, 130, 44].every(isBigEnough); // true

6、Array.prototype.filter()

filter() 方法创建一个新数组, 包含通过所提供函数实现的测试的所有元素。

该方法的参数与 some(),every()相同，callback 用来测试数组的每个元素的函数。返回 true 表示该元素通过测试，保留该元素，false 则不保留。

下例使用 filter 创建了一个新数组，该数组的元素由原数组中值大于 10 的元素组成。

function isBigEnough(element) {return element >= 10;
}var filtered = [12, 5, 8, 130, 35].filter(isBigEnough);
// filtered is [12, 130, 35]

7、Array.prototype.find()

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

该方法的参数与 some(),every(),filter()相同。
用对象的属性查找数组里的对象。

var inventory = [{name: 'apples', quantity: 2},{name: 'bananas', quantity: 0},{name: 'orange', quantity: 5}
];function findOranges(fruit) { return fruit.name === 'orange';
}console.log(inventory.find(findOrange));
// { name: 'orange', quantity: 5 }

8、Array.prototype.findIndex()

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

该方法参数与 find() 相同，只是一个返回该元素，一个返回该元素在数组中的索引值。
查找 name 为 orange 的对象在数组中的的索引。

var inventory = [{name: 'apple', quantity: 2},{name: 'banana', quantity: 0},{name: 'orange', quantity: 5}
];function findOrange(fruit) { return fruit.name === 'orange';
}console.log(inventory.findIndex(findOrange));
// { name: 'orange', quantity: 5 }

总结

为了方便查找和记忆，我将这些方法总结成了一张表格

方法名	参数	描述	返回值
includes	searchElement，fromIndex	判断数组中是否包含指定的值	布尔值
indexOf	searchElement，fromIndex	查找元素在数组中首次出现的索引值	索引值，或者-1
lastIndexOf	searchElement，fromIndex	查找元素在数组中最后一次出现的索引值	索引值，或者-1
some	callback[, thisArg]	判断数组中是否有符合条件的元素	布尔值
every	callback[, thisArg]	判断数组中是否每个元素都符合条件	布尔值
filter	callback[, thisArg]	返回符合条件的所有元素组成的数组	数组
find	callback[, thisArg]	返回数组中符合条件的第一个元素	数组中的元素，或者undefined
findIndex	callback[, thisArg]	返回符合条件的第一个元素的索引	索引值，或者-1