在日常 JavaScript 开发中，经常需要判断一个数组里是否存在某个元素，或者一个字符串里是否包含某段内容。ES6 之前，我们通常使用 indexOf 来实现：

if (arr.indexOf('apple') !== -1) {
    console.log('包含 apple');
}

这种写法虽然能用，但语义不够清晰。
自 ES6 起，JavaScript 引入了 includes() 方法，使得代码更加简洁、直观。本文将带你全面了解 includes() 的用法与注意事项。

一、语法

数组用法

array.includes(valueToFind, fromIndex)

• valueToFind：要查找的元素。

• fromIndex（可选）：从数组的哪个索引位置开始查找，默认是 0。

• 返回值：布尔值（true 或 false）。

字符串用法

string.includes(searchString, position)

• searchString：要查找的子串。

• position（可选）：开始查找的位置，默认是 0。

• 返回值：布尔值。

二、数组中的 includes()

1. 基本示例

let fruits = ['apple', 'banana', 'orange'];

console.log(fruits.includes('banana')); // true
console.log(fruits.includes('grape'));  // false

2. 指定起始索引

let numbers = [1, 2, 3, 4, 2];

console.log(numbers.includes(2));    // true，从头查找
console.log(numbers.includes(2, 2)); // true，从索引 2 开始，找到索引 4 的 2
console.log(numbers.includes(2, 4)); // true，索引 4 本身就是 2
console.log(numbers.includes(2, 5)); // false，超出数组范围

三、字符串中的 includes()

1. 基本示例

let str = "Hello World";

console.log(str.includes("Hello")); // true
console.log(str.includes("World")); // true
console.log(str.includes("world")); // false (大小写敏感)

2. 指定开始位置

let str = "JavaScript";

console.log(str.includes("Script", 4)); // true
console.log(str.includes("Java", 5));   // false

四、常见应用场景

1. 替代多个 || 判断

let reason = '5';

// 传统写法
if (reason === '2' || reason === '5') {
    console.log('匹配成功');
}

// includes 写法
if (['2', '5'].includes(reason)) {
    console.log('匹配成功');
}

2. 表单校验

let validTypes = ['jpg', 'png', 'gif'];
let ext = 'png';

if (validTypes.includes(ext)) {
    console.log('合法的文件类型');
}

3. 权限判断

let roles = ['admin', 'editor'];

if (roles.includes('admin')) {
    console.log('有管理员权限');
}

4. 文本搜索

let msg = "系统提示：操作成功";

if (msg.includes("成功")) {
    console.log("操作成功提示");
}

五、注意事项

1. 可以判断 NaN

   [NaN].includes(NaN); // true
   [NaN].indexOf(NaN);  // -1

2. 兼容性

   • includes() 属于 ES6 特性，在 IE 中不支持。

   • 可以使用 Babel 转译，或用 indexOf 替代。

3. 大小写敏感

六、includes() vs indexOf()

七、总结

• includes() 用于判断数组或字符串中是否包含某个值，返回布尔值。

• 相比 indexOf，语义更直观，还能判断 NaN。

• 常用于表单校验、权限判断、字符串匹配，以及替代多个 || 判断。

👉 一句话总结：当你想问“在不在”的时候，用 includes() 就对了。