JavaScript如何将一维数组两两分组转换为{x,y}结构对象数组

原代码无法得到正确结果，存在两个核心错误：

• next 变量声明在for循环内部，每次循环迭代都会被重置为0，next += 2的修改仅在单次循环内生效，无法实现跨迭代的下标偏移
• 循环下标i步长设置为1，叠加始终为0的next值，实际取值时会出现下标错位，最终输出为[{x:1,y:2}, {x:2,y:3}, {x:3,y:4}]这类结构，和预期不符
  注：你给出的目标结构示例中{x: 1, y, 2}存在语法笔误，正确写法应为{x: 1, y: 2}

基础for循环实现（可读性最高） #

直接将循环步长设置为2，每次i指向每组x对应的元素下标，i+1就是同组y对应的下标，逻辑直观无冗余变量：

const arr = [1,2,3,4,5,6]
const res = []
for (let i = 0; i < arr.length; i += 2) {
  res.push({
    x: arr[i],
    y: arr[i + 1]
  })
}
console.log(res) 
// 输出结果: [{x:1,y:2}, {x:3,y:4}, {x:5,y:6}]

如果传入的数组长度为奇数，最后一组的y值会是undefined，可根据业务需求增加下标判断做兜底处理。

函数式简洁写法 #

如果偏好无循环副作用的写法，可以用Array.from直接生成目标长度的数组，按下标映射取值：

const arr = [1,2,3,4,5,6]
const res = Array.from({ length: Math.ceil(arr.length / 2) }, (_, idx) => ({
  x: arr[idx * 2],
  y: arr[idx * 2 + 1]
}))

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