js array批量赋值

在JavaScript中，对数组进行批量赋值有多种方法，以下是一些常见的基础概念、类型、应用场景以及示例代码：

基础概念

批量赋值指的是一次性为数组中的多个元素赋予新的值。这在需要初始化数组或更新数组内容时非常有用。

类型及方法

1. 直接赋值：通过索引直接为数组元素赋值。
2. Array.prototype.fill()：用一个固定值填充数组。
3. Array.from()：根据一个类似数组或可迭代的对象创建一个新数组。
4. 展开运算符（...）：用于合并数组或复制数组。
5. map()：创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后的返回值。

应用场景

• 初始化具有默认值的数组。
• 更新数组中的多个元素。
• 根据现有数据生成新的数组。

示例代码

直接赋值

let arr = [1, 2, 3, 4, 5];
arr[1] = 10; // arr 现在是 [1, 10, 3, 4, 5]

使用 fill()

let arr = new Array(5).fill(0); // 创建一个长度为5，所有元素都是0的数组

使用 Array.from()

let arr = Array.from({length: 5}, (_, i) => i + 1); // 创建一个从1到5的数组

使用展开运算符

let arr1 = [1, 2, 3];
let arr2 = [...arr1, 4, 5]; // arr2 是 [1, 2, 3, 4, 5]

使用 map()

let arr = [1, 2, 3, 4, 5];
let doubled = arr.map(x => x * 2); // doubled 是 [2, 4, 6, 8, 10]

常见问题及解决方法

问题：为什么在使用 fill() 方法时，如果填充值是一个对象或数组，所有数组元素都指向同一个引用？

这是因为 fill() 方法填充的是同一个对象的引用，而不是独立的对象。

解决方法： 使用 Array.from() 或 map() 来创建独立的对象或数组。

let arr = Array.from({length: 5}, () => ({})); // 创建一个长度为5，每个元素都是独立对象的数组

问题：如何批量更新数组中的对象属性？

可以使用 map() 方法来遍历数组并更新对象属性。

let arr = [{id: 1, value: 10}, {id: 2, value: 20}];
let updatedArr = arr.map(item => ({...item, value: item.value * 2})); // 更新每个对象的value属性

通过这些方法，你可以灵活地对JavaScript数组进行批量赋值操作。