如何交换坐标数组元素值并生成新数组？Regions数组处理方案

嘿，我来帮你理清这个问题！你想要的是交换每个坐标对里的x和y值，而不是反转整个坐标点的顺序——这就是为什么reverse方法不是合适选择的原因。

为什么reverse不适用？ #

Array.reverse()的作用是反转整个数组的元素顺序：

• 如果直接对coords数组调用reverse()，你会得到整个坐标点的排列顺序颠倒（比如最后一个点变第一个），完全不是你要的每个点内部x、y互换；
• 就算你对每个单个坐标对（比如[3110,2323]）调用reverse()，虽然结果看起来对，但它是原地修改原数组的，而且语义上完全不对——reverse的本意是反转数组元素顺序，不是交换两个元素的位置，用它来做坐标交换会让代码可读性变差，其他开发者看到会困惑。

最佳实现方式 #

1. 生成新数组（推荐：无副作用，保持数据不可变性） #

这种方式不会修改原数组，而是返回一个全新的数组，是函数式编程的最佳实践：

// 原数组
var Regions = [ {"group": "region_01", "coords": [ [3110, 2323], [3119, 2344], [3117, 2385], [3110, 2417], [3110, 2323] ]}];

// 生成新数组，保留原数据不变
var newRegions = Regions.map(region => ({
  ...region, // 复制region的其他属性（比如group）
  coords: region.coords.map(([x, y]) => [y, x]) // 交换每个坐标对的x和y
}));

console.log(newRegions);

• 用map遍历Regions数组，对每个区域对象，通过扩展运算符...region复制所有原有属性；
• 重写coords属性：再次用map遍历每个坐标对，通过解构赋值([x, y])快速获取x和y值，返回交换后的[y, x]。

2. 修改原数组（仅当不需要保留原数据时使用） #

如果确定不需要保留原数组的内容，可以直接原地修改：

// 直接修改原数组的coords
Regions.forEach(region => {
  region.coords.forEach(coord => {
    // 解构赋值交换两个元素
    [coord[0], coord[1]] = [coord[1], coord[0]];
  });
});

console.log(Regions);

这种方式会直接改变原数组的内容，适合内存敏感或必须原地修改的场景，但要注意可能带来的副作用（比如其他依赖原数组的代码出错）。

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