为何Array.fill()创建的数组用map/forEach/for-in处理结果不符预期？

为什么你的三种方法都失效？ #

你用Array(5)创建的是稀疏数组，里面的位置1、3并不是undefined，而是根本没被初始化的「空位」（empty slot）：

• map()、forEach()：JS数组的这两个方法会自动跳过稀疏数组里的空位，不会执行回调函数，所以这些位置的内容根本不会被处理
• for...in：只会遍历数组中存在的索引（也就是你用fill填充过的0、2、4），同样会跳过空位，自然没法替换

满足需求的正确实现方式 #

核心是要遍历数组的所有索引，包括空位对应的位置，下面是几种可靠的方法：

方法1：用Array.from()直接转换

Array.from()会遍历数组的每一个位置，把空位当作undefined处理，配合空值合并运算符??可以直接替换：

let data = Array(5).fill(-2, 0, 1).fill(0,2,3).fill(2,4,5);
const result = Array.from(data, item => item ?? "");
// 输出：[-2, "", 0, "", 2]

方法2：用普通for循环遍历所有索引

直接基于数组长度遍历每个索引，不管是不是空位，都进行判断替换：

let data = Array(5).fill(-2, 0, 1).fill(0,2,3).fill(2,4,5);
const result = [];
for (let i = 0; i < data.length; i++) {
  result.push(data[i] ?? "");
}
// 输出：[-2, "", 0, "", 2]

方法3：先转成密集数组再处理

用Object.assign()把稀疏数组转成密集数组（空位会被转为undefined），之后再用map处理：

let data = Array(5).fill(-2, 0, 1).fill(0,2,3).fill(2,4,5);
const denseData = Object.assign([], data);
const result = denseData.map(item => item ?? "");
// 输出：[-2, "", 0, "", 2]

内容的提问来源于stack exchange，提问作者Jordy