如何通过循环连接两个数组，Javascript？

Question

假设我有这个数组。

const arr = [['grass', 'water'], ['fire', 'ground'], ['fairy', 'mage'], ['fighter', 'fire']];

所以我想要的是连接 arr[0] 和 arr[2]，连接 arr[1] 和 arr[3]。

这必须通过一些数组方法或循环来完成，因为我不知道我将拥有多少元素。

结果应该是这样的

const arr = [['grass', 'water', 'fairy', 'mage'], ['fire', 'ground', 'fighter', 'fire']];

Answer 1

如果你用数组长度的一半修改当前索引，那么你会在结果数组中得到对应的索引。

原始数组中的索引

0 1 2 3 4 5

结果数组中的索引

0 1 2 0 1 2  // After taking modulus with 3 i.e. half of the array length

解决方案

1. 如果所需位置为空，我已使用 Nullish coalescing operator 为 res 数组分配空数组。

2. 然后将所有元素推入这个位置，最后返回结果。

注意：此解决方案仅适用于偶数长度的数组。

const arr = [
  ["grass", "water"],
  ["fire", "ground"],
  ["fairy", "mage"],
  ["fighter", "fire"],
  ["water", "ice"],
  ["ground", "rock"],
];

const result = arr.reduce(
  (r, el, i) => (
    (r[i % (arr.length / 2)] ??= []), r[i % (arr.length / 2)].push(...el), r
  ),
  []
);

console.log(result);

Answer 2

你可以这样做：

const arr = [['grass', 'water'], ['fire', 'ground'], ['fairy', 'mage'], ['fighter', 'fire']];
const newArr = [];
for (let i = 0; i <  arr.length/2; i++){
    newArr.push(arr[i].concat(arr[i + 2]));
}
console.log(newArr);

Answer 3

这里有几个适用于偶数数组的选项。

没有突变

1. 从头开始迭代到数组的一半。

2. 将当前索引处的项目与与数组中间距离相等的项目连接：

   • 迭代 1：

   [0, 1, 2, 3]
    ^     ^
   

   • 迭代 2：

   [0, 1, 2, 3]
       ^     ^
   

3. 将这些中的每一个添加到一个新数组中。原版及其所有成员均未受影响。

带循环

function* slice(start, end, arr) {
  if (start < 0) 
    start = arr.length + start;

  if (end < 0) 
    end = arr.length + start;
    
  for (let i = start; i < end; i++) {
    yield arr[i];
  }
}

const arr = [['grass', 'water'], ['fire', 'ground'], ['fairy', 'mage'], ['fighter', 'fire']];

const middle =  arr.length / 2;

const result = Array.from(
  slice(0, middle, arr), 
  (first, i) => first.concat(arr[middle + i])
);
console.log(result);

使用数组方法

const arr = [['grass', 'water'], ['fire', 'ground'], ['fairy', 'mage'], ['fighter', 'fire']];

const middle =  arr.length / 2;
const result = arr
  .slice(0, middle)
  .map((first, i) => first.concat(arr[middle + i]));

console.log(result);

使用生成器

为避免来自.slice() 的中间数组，您可以使用a generator function 并将其传递给Array.from()，提供映射函数以生成数组：

const arr = [['grass', 'water'], ['fire', 'ground'], ['fairy', 'mage'], ['fighter', 'fire']];

const middle =  arr.length / 2;
const result = arr
  .slice(0, middle)
  .map((first, i) => first.concat(arr[middle + i]));

console.log(result);

有突变

1. 在数组中间之前开始并向后走。

2. 删除数组中的最后一项。将其成员添加到当前索引处的项目。

   • 迭代 1：

   [0, 1, 2, 3]
       ^     ^
   
   remove last: 3
   combine with: 1
   

   • 迭代 2：

   [0, 13, 2]
    ^      ^
   
   remove last: 2
   combine with: 0
   

   • 最终结果：

   [02, 13]
   

3. 这一切都在原地完成。 arr 及其成员都被修改了。

const arr = [['grass', 'water'], ['fire', 'ground'], ['fairy', 'mage'], ['fighter', 'fire']];

const middle =  arr.length / 2;
for (let i = middle - 1; i >= 0; i--) {
  const first = arr[i];
  const second = arr.pop();
  first.push(...second);
}

console.log(arr);