ES12 新增的 Array 操作方法：“includes” 和 “fill”

在 JavaScript 的开发中，Array 是非常常用的数据类型。在 ES12 中，新增了两个非常实用的 Array 操作方法：includes 和 fill。本文将详细介绍这两个方法的使用方法和指导意义。

includes

includes 方法用于判断一个数组是否包含某个元素，返回值为布尔值。该方法接收一个参数，表示要查找的元素。

示例代码：

const arr = [1, 2, 3];

console.log(arr.includes(2)); // true
console.log(arr.includes(4)); // false

在上面的示例代码中，arr.includes(2) 返回 true，因为数组 arr 中包含元素 2。而 arr.includes(4) 返回 false，因为数组 arr 中不包含元素 4。

除了普通的元素外，includes 方法还可以判断 NaN：

const arr = [1, 2, NaN];

console.log(arr.includes(NaN)); // true

在上面的示例代码中，arr.includes(NaN) 返回 true，因为数组 arr 中包含 NaN。

includes 方法还可以接收第二个参数，表示从哪个索引开始查找：

const arr = [1, 2, 3];

console.log(arr.includes(2, 1)); // true
console.log(arr.includes(2, 2)); // false

在上面的示例代码中，arr.includes(2, 1) 返回 true，因为从索引 1 开始查找到元素 2。而 arr.includes(2, 2) 返回 false，因为从索引 2 开始查找，数组中不存在元素 2。

fill

fill 方法用于将数组中的所有元素替换为指定的值。该方法接收一个参数，表示要替换的值。还可以接收两个可选参数，分别表示替换的起始位置和结束位置。

示例代码：

const arr = [1, 2, 3];

arr.fill(0);

console.log(arr); // [0, 0, 0]

在上面的示例代码中，arr.fill(0) 将数组 arr 中的所有元素替换为 0。

fill 方法还可以接收第二个参数，表示替换的起始位置：

const arr = [1, 2, 3];

arr.fill(0, 1);

console.log(arr); // [1, 0, 0]

在上面的示例代码中，arr.fill(0, 1) 将数组 arr 中索引大于等于 1 的元素替换为 0。

fill 方法还可以接收第三个参数，表示替换的结束位置：

const arr = [1, 2, 3];

arr.fill(0, 1, 2);

console.log(arr); // [1, 0, 3]

在上面的示例代码中，arr.fill(0, 1, 2) 将数组 arr 中索引大于等于 1 且小于 2 的元素替换为 0。

指导意义

includes 和 fill 方法是非常实用的 Array 操作方法，它们可以帮助我们更加方便地操作数组。在实际开发中，我们可以根据业务需求，灵活使用这两个方法。

需要注意的是，includes 和 fill 方法都是 ES12 新增的方法，在使用时需要注意浏览器的兼容性。如果需要在低版本浏览器中使用这两个方法，可以使用 polyfill 或者自己实现这两个方法。

总结

本文介绍了 ES12 新增的 Array 操作方法：includes 和 fill。includes 方法用于判断一个数组是否包含某个元素，fill 方法用于将数组中的所有元素替换为指定的值。这两个方法都是非常实用的，可以帮助我们更加方便地操作数组。在实际开发中，我们可以根据业务需求，灵活使用这两个方法。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6506b3a895b1f8cacd26c2a3