在 ECMAScript 2016 中，Array.fill 函数被引入用于填充一个数组中的所有元素。使用该函数，可以快速、方便地将数组填充为指定的值。但是，Array.fill 函数的高级用法比填充一个数组更加复杂，需要更深入的学习和理解。
基本用法
首先，我们来看一下 Array.fill 函数的基本用法。该函数有两个参数：要填充的值和填充的起始位置。
--- --- - --- -- -- -- --- ------------ -- --- --- ---------- -
上述代码将数组 arr 中的所有元素都填充为 0。如果想要从指定位置开始填充，可以传递第二个参数：
--- --- - --- -- -- -- --- ----------- --- -- --- --- ---- - ----------- -
高级用法
除了基本用法之外，Array.fill 函数还有一些高级用法，下面我们来逐个介绍。
1. 在数组中填充对象
在数组中填充对象时，需要注意的是，填充的是对象的引用，而不是对象本身。因此，如果填充了多个相同的对象，它们实际上是同一个对象的多个引用。
--- --- - ------- --- --- --- - ------------------- ------------------ --- -------- -- ----
上述代码中，我们创建了一个对象 obj，然后使用 Array.fill 函数将数组 arr 中的所有元素都填充为该对象。由于填充的是对象的引用，因此 arr[0] 和 arr[1] 实际上是同一个对象的两个引用。
如果想要填充多个不同的对象，可以使用 Array.from 函数结合箭头函数来实现：
--- --- - ------------------- --- -- -- -------- -----
上述代码中，我们使用 Array.from 函数创建了一个长度为 5 的数组，然后使用箭头函数将数组中的每个元素都设置为一个新的对象。
2. 在数组中填充函数
在数组中填充函数时，可以使用 Array.fill 函数的第一个参数传递一个函数，该函数将会被调用多次来填充数组。
--- --- - ---------------------- -- ---------------
上述代码中，我们使用 Array.fill 函数创建了一个长度为 5 的数组，然后使用 map 函数将数组中的每个元素都设置为一个随机数。
3. 在数组中填充字符串
在数组中填充字符串时，可以使用 Array.fill 函数的第一个参数传递一个字符串，该字符串将会被复制多次来填充数组。
--- --- - -----------------------
上述代码中，我们使用 Array.fill 函数创建了一个长度为 5 的数组，然后将数组中的每个元素都设置为字符串 'hello'。
4. 在数组中填充 NaN
在数组中填充 NaN 时，需要注意的是，NaN 与任何值都不相等，包括自身。因此，不能使用简单的等于运算符来判断数组中的元素是否为 NaN。
--- --- - ------------------- ------------------ --- -------- -- ----- ------------------ --- -------- -- ----
上述代码中，我们使用 Array.fill 函数创建了一个长度为 5 的数组，然后将数组中的每个元素都设置为 NaN。由于 NaN 与任何值都不相等，因此 arr[0] === arr[0] 的结果为 false，而 arr[0] !== arr[0] 的结果为 true。
如果想要判断数组中的元素是否为 NaN，可以使用 isNaN 函数：
--- --- - ------------------- --------------------------- -- ----
总结
在 ECMAScript 2016 中，Array.fill 函数是一个十分实用的函数，可以快速、方便地填充数组。除了基本用法之外，Array.fill 函数还有一些高级用法，例如在数组中填充对象、函数、字符串和 NaN 等。掌握这些高级用法可以帮助我们更好地使用 Array.fill 函数，提高编程效率。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/663098d8d3423812e4e7ceab