介绍
在 JavaScript 中,Array.prototype.fill() 方法允许你用一个固定值填充数组中指定的起始和结束位置。此方法是在 ES7 中添加的,它大大简化了一些用例,在某些情况下,它可以取代自己的一些替代品。
语法
Array.prototype.fill(value, start, end)
参数说明
- value:必需,要在数组中填充的固定值。
- start:可选,填充开始的索引位置,默认为 0。
- end:可选,填充结束的索引位置,默认为数组的长度。
返回值
修改后的数组。
示例说明
示例 1
下面的示例展示了 fill() 方法的基本用法:
const arr = new Array(5).fill(0); console.log(arr); // Output: [0, 0, 0, 0, 0] const arr2 = [1, 2, 3, 4, 5]; console.log(arr2.fill(0, 2, 4)); // Output: [1, 2, 0, 0, 5]
这个例子中,我们创建了一个长度为 5 的数组,并将其填充为 0。我们还使用 fill() 方法从第二个位置开始填充数组的 2 到 4 个位置为 0。
示例 2
fill() 方法也可以用于创建一个由指定元素重复填充的数组:
console.log(new Array(5).fill('hello')); // Output: ['hello', 'hello', 'hello', 'hello', 'hello']
在这个例子中,我们创建了长度为 5 的新数组,并用 "hello" 字符串填充了每个元素。
使用场景
fill() 方法在许多情况下都很有用,以下是一些常见的使用场景:
填充数组
我们可以使用 fill() 方法来填充数组,而不需要使用循环或其他迭代方法:
const arr = new Array(5).fill(0); console.log(arr); // Output: [0, 0, 0, 0, 0]
替换数组元素
fill() 方法还可以用于替换数组元素:
const arr = [1, 2, 3, 4, 5]; console.log(arr.fill(0, 2, 4)); // Output: [1, 2, 0, 0, 5]
在这个例子中,我们将数组 arr 中的元素替换为 0。
简化对象初始化
我们可以使用 fill() 方法来初始化一个由对象组成的数组:
const obj = { name: 'John', age: 20 }; const arr = new Array(5).fill(obj); console.log(arr); // Output: [{ name: 'John', age: 20 }, { name: 'John', age: 20 }, { name: 'John', age: 20 }, { name: 'John', age: 20 }, { name: 'John', age: 20 }]
在这个例子中,我们使用 fill() 方法将一个对象放入创建的数组中。
指导意义
fill() 方法可以使代码更简洁、易读和易于维护。在某些情况下,它可以取代自己的一些替代品,比如 for 循环或其他迭代方法。
总结
本文介绍了 ES7 中的 Array.prototype.fill() 方法及其用法。这个方法可以轻松的填充数组、替换数组元素和初始化对象的数组。它能够让代码更简洁、易读和易于维护,有利于提高工作效率和代码质量。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/649fed7248841e9894c490ea