如何循环数组为每4个元素添加指定键并生成对象数组

方法一：用你想到的for循环实现 #

你提到的for (var i = 0; i < super.length; i += 4)这个思路完全可行，循环体里只需要做两件事：

1. 从原数组中取出当前组的4个元素
2. 把这4个元素和keys数组的键一一对应，生成对象后放进结果数组

代码示例：

// 注意：super是JS关键字，这里改名为superArr避免报错
const superArr = ["Month 1","22 - Feb - 2024","29 - Feb - 2024","7 - Mar - 2024",  "Month 2","23 - Mar - 2024","30 - Mar - 2024","6 - Apr - 2024"];
const keys = ["tp","early","target","late"];
const final = [];

for (let i = 0; i < superArr.length; i += 4) {
  // 截取当前组的4个元素
  const group = superArr.slice(i, i + 4);
  // 生成对应键值对的对象
  const obj = {};
  keys.forEach((key, index) => {
    obj[key] = group[index];
  });
  final.push(obj);
}

console.log(final);

方法二：用map实现（先分组再映射） #

map本身是逐个遍历元素，没法直接按4个一组处理，所以可以先把原数组拆成每4个元素一组的二维数组，再用map遍历每组生成对象：

代码示例：

const superArr = ["Month 1","22 - Feb - 2024","29 - Feb - 2024","7 - Mar - 2024",  "Month 2","23 - Mar - 2024","30 - Mar - 2024","6 - Apr - 2024"];
const keys = ["tp","early","target","late"];

// 第一步：把原数组拆成每4个一组的子数组
const groups = [];
for (let i = 0; i < superArr.length; i += 4) {
  groups.push(superArr.slice(i, i + 4));
}

// 第二步：用map遍历每组生成对象
const final = groups.map(group => {
  const obj = {};
  keys.forEach((key, idx) => {
    obj[key] = group[idx];
  });
  return obj;
});

console.log(final);

补充：更简洁的写法（ES2019+支持） #

如果你的运行环境支持ES2019及以上，可以用Object.fromEntries简化对象生成步骤，代码更紧凑：

const superArr = ["Month 1","22 - Feb - 2024","29 - Feb - 2024","7 - Mar - 2024",  "Month 2","23 - Mar - 2024","30 - Mar - 2024","6 - Apr - 2024"];
const keys = ["tp","early","target","late"];
const final = [];

for (let i = 0; i < superArr.length; i += 4) {
  const group = superArr.slice(i, i + 4);
  // 把keys和group元素配对成键值对数组，直接转成对象
  const obj = Object.fromEntries(keys.map((key, idx) => [key, group[idx]]));
  final.push(obj);
}

console.log(final);

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