使用 ES8 中的 Array.prototype.includes() 方法查找数组元素

什么是 Array.prototype.includes() 方法?

Array.prototype.includes() 是 JavaScript 中一个用于查找数组中是否包含指定元素的方法,它在 ES7(2016 年)中被引入,并在 ES8(2017 年)中被正式纳入标准。Array.prototype.includes() 方法的语法如下:

其中,searchElement 参数表示要查找的元素,fromIndex 参数表示开始查找的位置(可选)。如果没指定 fromIndex 参数,则默认从数组头部开始查找。

Array.prototype.includes() 方法的返回值是一个 Boolean 类型的值,当数组中包含指定元素时,返回 true,否则返回 false

使用 Array.prototype.includes() 方法的优势

相较于老版本的 indexOf() 方法,Array.prototype.includes() 方法使用起来更加简单易懂,额外的 fromIndex 参数也使得查找更加灵活方便。此外,对于一些复杂类型的数组(例如对象数组),Array.prototype.includes() 方法的性能优势也比传统的 for 循环和 indexOf() 方法更明显。

示例代码

让我们通过一些代码示例来更好地了解如何使用 Array.prototype.includes() 方法。假设我们有这样一个数组:

const fruits = ['apple', 'banana', 'kiwi', 'watermelon'];

查找指定元素是否存在

我们可以使用 Array.prototype.includes() 方法来查找一个指定元素是否存在于该数组中:

console.log( fruits.includes('apple') ); // true
console.log( fruits.includes('orange') ); // false

从指定位置开始查找

我们可以使用第二个参数 fromIndex 来指定开始查找的位置。

console.log( fruits.includes('apple', 1) ); // false,因为从第二个位置开始查找,而 'apple' 在第一位。
console.log( fruits.includes('kiwi', 2) ); // true

查找对象元素

Array.prototype.includes() 方法同样适用于查找对象数组中的元素。比如,我们有这样一个数组:

const people = [{ name: '张三', age: 20 }, { name: '李四', age: 25 }, { name: '王五', age: 28}];

我们可以使用 Array.prototype.includes() 方法来查找年龄为 20 的人是否在这个数组中:

const person = people.find(p => p.age === 20);
console.log(people.includes(person)); // true

总结

在 JavaScript 开发中,查找数组元素是一项非常常见的任务。使用 Array.prototype.includes() 方法可以使得这项任务更加简单和高效,同时代码可读性也更加友好和清晰。希望本文对您在学习、开发和调试时有所帮助。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/65abb1d0add4f0e0ff55c51c