Array_at_includes

Array.prototype.includes + Array.prototype.at 合并讲解

一、Array.prototype.includes()

语法

arr.includes(searchElement, [fromIndex])

作用

检测数组中是否存在目标元素，返回布尔值 true / false

• searchElement：要查找的元素
• fromIndex（可选）：起始检索下标

示例

const arr = [10, 20, 30, NaN];
console.log(arr.includes(20));     // true
console.log(arr.includes(50));     // false
console.log(arr.includes(20, 2)); // false，从下标2开始找
console.log(arr.includes(NaN));   // true

核心特点

1. 内部采用 SameValueZero 比较，可以识别 NaN

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

2. 只能匹配原始值，无法直接匹配引用类型

const obj = {a:1};
const list = [obj];
console.log(list.includes({a:1})); // false 两个不同对象
console.log(list.includes(obj));   // true 同一引用

3. fromIndex 支持负数，负数代表从倒数位置开始查找

适用场景

只想判断「数组有没有这个元素」，替代 indexOf !== -1

// 旧写法
if(arr.indexOf(20) !== -1){}
// ES6推荐
if(arr.includes(20)){}

---

二、Array.prototype.at()

语法

arr.at(index)

作用

根据下标获取数组元素
最大亮点：支持负数索引！
正数：从头部开始计数；负数：从尾部倒数取值。

示例

const arr = [10, 20, 30];
console.log(arr.at(0));   // 10
console.log(arr.at(-1));  // 30 最后一项
console.log(arr.at(-2));  // 20 倒数第二项
console.log(arr.at(99));  // undefined 下标越界

ES5传统写法对比

想要拿最后一个元素：

// ES5
const last = arr[arr.length - 1];
// ES6+ at
const last = arr.at(-1);

注意事项

1. 参数不填、传入undefined，默认等价at(0)
2. 越界下标返回 undefined，不会报错
3. 不能修改数组元素！只是读取

arr.at(-1) = 99; // ❌无效，at只做读取

---

三、两个API快速区分

方法	作用	返回值	核心亮点
includes	查找元素是否存在	布尔true/false	识别NaN
at	按下标读取元素	数组元素 / undefined	支持负下标，快速取末尾元素

四、常见面试小题

1. 获取数组最后一项最简写法？arr.at(-1)
2. 数组能否用indexOf查找NaN？不能，改用includes