每天温习一个JS方法之Array.includes方法 第五天

1. Array.includes方法

1.1 描述

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

1.2 语法

arr.includes(searchElement) // return true or false
arr.includes(searchElement, fromIndex) // return true or false

参数：

• searchElement:需要查找的元素值
• fromIndex: 选填。从arr的fromIndex的索引处开始查找。接受正负值，若为负值，则从fromIndex+arr.length索引处开始查找。默认为0。

1.3 注意

1. 若fromIndex>arr.length，即索引开始值大于等于数组长度。则将直接返回false，且不搜索该数组。

2. arr.includes比较字符串和字符是区分大小写的。

3. 0 的值将全部视为相等，与符号无关（即 -0 与 0 和 +0 相等），但 false 不被认为与 0 相等。

4. 若开始索引为负值，且fromIndex+arr.length依旧为负值，则整个数组都会被搜索。

2. Array.includes应用

2.1 验证注意点

/* 验证注意点一 */
const arr = [1, 2, 3, 4, 5];
console.log(arr.includes(3, 5)); // 输出 false
console.log(arr.includes(1, 6)); // 输出 false

/* 验证注意点二 */
const arr = ['a', 'b', 'Ab', 'abc', '#'];
console.log(arr.includes('ab')); // 输出 false
console.log(arr.includes('Ab')); // 输出 true
console.log(arr.includes('A')); // 输出 false

/* 验证注意点三 */
const arr = [0];
console.log(arr.includes(+0)); // 输出 true
console.log(arr.includes(-0)); // 输出 true
const arr = [false];
console.log(arr.includes(0)); // 输出 false

/* 验证注意点四 */
const arr = [1, 2, 3, 4, 5];
console.log(arr.includes(3, -100)); // 输出 true

2.2 查验数组对象是否存在某属性值

const arr = [
  { id: 1, name: '张三' },
  { id: 2, name: '李四' },
  { id: 3, name: '王五' },
];
const result = arr.map((o) => o.name).includes('李四');
console.log(result); // 输出 true

虽然如此，但用Array.find效率更高些，再配合上??，如下：

const arr = [
  { id: 1, name: '张三' },
  { id: 2, name: '李四' },
  { id: 3, name: '王五' },
];
const result = arr.find((o) => o.name === '李四') ?? '无';
console.log(result); // 输出 {id: 2, name: '李四'}

const result = arr.find((o) => o.name === '李八') ?? '无';
console.log(result); // 输出 无

2.3 应用在字符串身上

const str = 'hello world!';
console.log(str.includes('hello')); // 输出 true

Object.includes 还有诸多与其它方法联用的应用，熟悉它，相信你在逻辑处理过程中能够广泛应用到