ECMAScript 2016 中的 Array.prototype.fill() 方法

在 ES6 提出的新特性中，Array.prototype.fill() 方法是一个非常实用的方法，它可以用来填充数组元素。在本文中，我们将深入探讨这个方法，带来详细的学习指导以及示例代码。

fill() 方法的作用

Array.prototype.fill() 方法接受一个固定的值作为参数，然后用这个值填充数组中指定的起始位置和结束位置之间的所有元素。我们可以用一个简单的例子来展示 fill() 方法的用途：

var arr = [1, 2, 3, 4, 5];
arr.fill(0, 1, 4);

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

上面的代码，我们将数组的第二个元素到第四个元素之间的值都改为了 0。fill() 方法的第一个参数是要填充的值，这里我们填的是 0，第二个参数是填充的起始位置，第三个参数是填充的结束位置（不包括结束位置本身）。

fill() 方法的使用

fill() 方法的使用非常简单，我们可以在数组对象上直接调用它。fill() 方法有三个参数，分别是填充的值，填充的起始位置和填充的结束位置。

如果我们只传递一个参数，则 fill() 方法将数组中所有的元素都填充为这个参数的值。

var arr1 = [1, 2, 3, 4, 5];
arr1.fill(0);

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

如果只传递两个参数，则 fill() 将从填充的起始位置开始一直填充到数组的结尾。

var arr2 = [1, 2, 3, 4, 5];
arr2.fill(0, 1);

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

如果填充的起始位置或填充的结束位置是负数，则 fill() 方法将从数组末尾开始计算。

var arr3 = [1, 2, 3, 4, 5];
arr3.fill(0, -2);

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

特别说明

需要注意的是，fill() 方法会修改原始数组，而不是返回一个新数组。如果我们在多个数组上使用 fill() 方法，所有的数组都将被修改。

另外，由于 fill() 方法是在 ECMAScript 2016 中引入的，你需要确保你的 JavaScript 环境支持该方法。

总结

Array.prototype.fill() 方法可以让我们轻松地填充一个数组，它的语法简单易懂，是一个实用的方法。在实际开发中，它可以用于初始化数组，替换数组中的某些元素等等。我们需要注意 fill() 方法会修改原始数组，而不是返回一个新数组。同时，由于它是在 ECMAScript 2016 中引入的，你需要确保你的 JavaScript 环境支持该方法。

示例代码

填充数组

var arr = [1, 2, 3, 4, 5];
arr.fill(0, 1, 4);

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

用同一个值填充整个数组

var arr1 = [1, 2, 3, 4, 5];
arr1.fill(0);

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

从指定的位置开始填充整个数组

var arr2 = [1, 2, 3, 4, 5];
arr2.fill(0, 1);

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

从数组末尾开始填充

var arr3 = [1, 2, 3, 4, 5];
arr3.fill(0, -2);

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

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