Array.prototype.fill() 是 ECMAScript 2016（ES7）中新增的方法，它是用于填充数组中的元素的。这个方法的功能非常简单，它将指定的值填充到数组中的每个位置上，并返回修改后的数组。在这篇文章中，我们将深入探讨 Array.prototype.fill() 的用法，并给出一些示例代码。
用法
Array.prototype.fill(value[, start[, end]]) 方法接受三个参数，其中 value 是用于填充数组的值，它可以是任意类型的数据。start 是填充的起始位置，默认值是 0，end 是填充的结束位置，默认值是数组的长度。下面是一个使用示例：
--- --- - --- -- -- -- --- ----------- -- --- -- --- -- -- -- --
在这个示例中，我们创建了一个数组 arr，它包含了 5 个数字。然后我们使用 fill() 方法将数组中从索引 2 到 4（不包括 4）的元素填充为 0，最终返回的数组是 [1, 2, 0, 0, 5]。
需要注意的是，fill() 方法并不改变原有的数组，而是返回一个新的已经修改过的数组，所以对于原有数组的修改需要重新赋值。
示例代码
将数组中所有元素重置为默认值
这是一个很常见的用例，我们需要将数组中所有的元素设为默认值。下面的代码演示了如何使用 fill() 方法：
--- --- - --- -- -- -- --- ------------ -- --- -- -- -- --
在这个示例中，我们将数组中的所有元素都设置为 0。
使用 fill() 填充数组并创建原有数组子集
Array.prototype.fill() 方法允许我们使用一个简单的语法填充数组来创建一个新的数组的子集：
--- --- - -------------------------- -- ---- -- - --- --- --- --- -- -
Array(5) 创建了一个长度为 5 的数组，我们使用 fill(null) 填充了这个数组。随后，我们通过 map() 来将这个数组的每个元素都映射为一个新数组 []，最终得到了一个包含了 5 个空数组的数组。
填充一个数组来创建一个点阵
下面的代码演示了如何使用 Array.prototype.fill() 方法生成一个简单的二维点阵（matrix）：
--- ------ - ---------------------------------- -- - - ---- ---- --- -- - ---- ---- --- -- - ---- ---- --- - -
在这个示例中，我们使用 Array(3) 创建一个 3 x 3 的数组，使用 fill() 方法填充每个元素为一个含有三个 . 的数组，最终得到一个包含了 3 行 3 列的二维点阵。
结论
Array.prototype.fill() 方法是一个非常简单却实用的方法，它可以帮助我们更加方便地填充数组中的元素。在本文中，我们讨论了如何使用这个方法，给出了一些基本的示例代码，希望能帮助你更好地理解这个方法的用法并加以应用到你的前端开发中。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/670e235b5f551281025fcc49