js数组高阶函数——includes方法
- 前言
- 数组的一般化操作
- 创建数组
- 获取数组长度
- 访问(遍历)数组元素
- 修改数组元素
- 删除数组元素
- 数组尾部添加
- 数组尾部删除
- includes()方法
- 举例说明
- 关键点
前言
⭐JS的数组是一种特殊的对象,其特点是在值的列表中按照顺序存放值。JS数组用于存储按照索引顺序排列的数据,例如数字、字符串和对象等。数组是一个类似于列表的高阶对象,它可以存储任何类型的数据,并且具有一些非常有用的方法。其中,includes()
方法是其中最常用的之一。
在 JS中,数组是由中括号 []
括起来的数值序列。数组可以包含不同类型的值,例如数字、字符串、对象等。以下是一些基础的 JS数组操作:
数组的一般化操作
创建数组
let myArray = []; // 创建一个空数组
let myArray = [1, 2, 3]; // 创建一个包含三个数值的数组
let myArray = new Array(); // 用构造函数创建一个空数组
let myArray = new Array(1, 2, 3); // 用构造函数创建一个包含三个数值的数组
获取数组长度
let myArray = [1, 2, 3];console.log(myArray.length); // 输出 3
访问(遍历)数组元素
let myArray = [1, 2, 3];
console.log(myArray[0]); // 输出 1
console.log(myArray[1]); // 输出 2
console.log(myArray[2]); // 输出 3
修改数组元素
let myArray = [1, 2, 3];
myArray[1] = 4;
console.log(myArray); // 输出 [1, 4, 3]
删除数组元素
let myArray = [1, 2, 3];
delete myArray[1];
console.log(myArray); // 输出 [1, 3]
数组尾部添加
let myArray = [1, 2, 3];
myArray.push(4);
console.log(myArray); // 输出 [1, 2, 3, 4]
数组尾部删除
let myArray = [1, 2, 3];
myArray.pop();
console.log(myArray); // 输出 [1, 2]
includes()方法
⭐对于数组中是否包含某个元素,我们可以使用 includes()
方法。includes()
方法用于判断数组中是否包含某个指定的元素,如果包含,则方法返回 true,否则返回 false。
以下是 includes()
方法的语法:
array.includes(searchElement[, fromIndex])
其中:
searchElement
:需要查找的元素,必选。fromIndex
:可选,从该索引处开始查找元素。如果省略该参数,则从数组的头开始查找。如果fromIndex
大于或等于数组长度,则返回 false。
举例说明
当我们使用includes()方法时,可以通过传入一个元素作为参数来判断数组中是否包含该元素。
⭐⭐⭐第一例:判断数组中是否包含某个数字
const numbers = [1, 2, 3, 4, 5];
console.log(numbers.includes(3));
console.log(numbers.includes(6));
数组numbers包含数字3,因此includes(3)返回true。而数组numbers不包含数字6,因此includes(6)返回false。
⭐⭐⭐第二例:判断数组中是否包含某个字符串
const fruits = ['长生界', '神墓', '遮天'];
console.log(fruits.includes('遮天'));
console.log(fruits.includes('完美世界'));
数组fruits包含字符串’遮天’,因此includes('banana')
返回true。而数组fruits不包含字符串’grape’,因此includes('grape')
返回false。
⭐⭐⭐第三例:判断数组中是否包含某个对象
const users = [
{ name: '叶天帝', age: 225 },
{ name: '石昊', age: 130 },
{ name: '辰南', age: 135 }
];
const user = { name: '石昊', age: 30 };
console.log(users.includes(user)); // true
数组users包含一个与user对象相等的对象,因此includes(user)返回true。
关键点
第一点:includes()
方法在比较元素时使用的是严格相等(===)的方式。
第二点:如果数组中有多个相同的元素,includes()方法只会返回第一个匹配到的元素。
第三点:兼容性:
includes()
方法并不兼容所有的浏览器。如果需要在不支持 includes()
方法的浏览器中使用该方法,可以使用以下 polyfill 实现:
if (!Array.prototype.includes) {
Array.prototype.includes = function(searchElement /*, fromIndex*/ ) {
'use strict';
var O = Object(this);
var len = parseInt(O.length) || 0;
if (len === 0) {
return false;
}
var n = parseInt(arguments[1]) || 0;
var k;
if (n >= 0) {
k = n;
} else {
k = len + n;
if (k < 0) {
k = 0;
}
}
while (k < len) {
var currentElement = O[k];
if (searchElement === currentElement ||
(searchElement !== searchElement && currentElement !== currentElement)) {
return true;
}
k++;
}
return false;
};
}
在这个 polyfill 中,Array.prototype.includes()
方法首先通过对象来获取数组的长度,并使用 while 循环来遍历数组。如果搜索的元素存在则返回 true,否则返回 false。