JavaScript是一种强大的动态编程语言，提供了许多内置方法和API来简化开发人员的作业。 ECMAScript 2019为数组和对象引入了一些新的功能和改进。其中之一是Array.fill（）方法。
理解Array.fill()方法
填充一个数组可能是您工作中的常见任务。例如，您可能需要初始化一个由唯一值组成的巨大数据集，或者想要在Dom对象创建表格时自动填充模板行。Fill（）方法可以实现这些操作。
Fill（）方法将选定的数组范围替换为静态值。该方法有三个参数：要用来填充数组的值以及包含开始索引号和结束索引号的起始/关闭点。
array.fill(value, start, end);
value - 必需。用于填充数组元素的值。
start - 可选。被填充的开始索引位置，默认为0
end - 可选。被填充的结束索引位置，默认为array.length
实例
让我们看一个简单的示例，初始化一个具有10个元素和静态的默认值0的应用程序状态数组：
let appState = new Array(10).fill(0); console.log(appState); // [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
进一步扩展
Array.fill()方法不仅可以使用单个值填充数组元素。您可以使用变量、生成器及其他表达式。例如，下面的示例使用生成器将10个随机整数填充到数组中：
let randomArray = new Array(10).fill().map(() => Math.round(Math.random() * 100)); console.log(randomArray); // [84, 98, 58, 23, 91, 45, 92, 71, 88, 6]
替代原型模式
如果您正在使用JavaScript ES6或更高版本，则可以结合Array.from()和Array.fill()来创建 空/默认值数组，替换使用传统的原型方式。
const defaultSize = 5;
const emptyArray = Array.from({ length: defaultSize }).fill(undefined);
console.log(emptyArray); // [undefined, undefined, undefined, undefined, undefined]性能注意事项
在考虑使用Array.fill()时，请记住性能可能是个问题。当要完全修改大型数组之类的情况时，不要使用Array.fill()。 即使只需要修改一个子集，也要检查受影响的元素数量是否超过可接受的限制。
结论
我们已经了解了如何使用ECMAScript 2019的Array.fill（）方法，以便为JavaScript应用程序初始化、填充和重置数据集。我们还探讨了如何使用它来替代旧的原型方式，并研究了一些性能注意事项。
这种简单的技巧可以提高您的应用程序开发效率并减少代码长度，让您专注于更重要的任务。实践和官方文档是获得更多有关Array.fill（）及其其他数组方法的信息和示例的最佳资源。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672d670eddd3a70eb6da4b43