JavaScript數組拆分詳解

一、基本概念

JavaScript中的數組Aray是一種有序的集合，它可以包含任意類型的數據，包括數字、字符串、對象或函數等。拆分數組指的是將一個大數組按照一定規則，分成若干個小數組。在實際開發中，拆分數組是一個常用的技能，可以有效的幫助我們處理數據。

二、按元素個數拆分

按照元素個數拆分數組是最常用的一種方法，它可以將一個大數組拆成若干個固定大小的小數組。實現這個功能有很多種方法，接下來我們將介紹三種實現方法。

1. splice()方法

const arr = [1, 2, 3, 4, 5];
const size = 2;
const result = [];

while (arr.length) {
  result.push(arr.splice(0, size));
}

console.log(result); // [[1, 2], [3, 4], [5]]

這個方法每次截取前面的size個元素，將它們推入result數組中，同時從原數組中刪除這些元素。這個過程循環執行，直到原數組為空為止。

2. reduce()方法

const arr = [1, 2, 3, 4, 5];
const size = 2;

const result = arr.reduce((acc, val, i) => {
  const idx = Math.floor(i / size);
  const page = acc[idx] || (acc[idx] = []);
  page.push(val);
  return acc;
}, []);

console.log(result); // [[1, 2], [3, 4], [5]]

這個方法使用reduce()函數，將原數組逐個遍歷，並根據元素在原數組中的索引，計算出當前元素應該被推入哪個小數組中。如果當前位置沒有小數組，則創造一個新的小數組，並將當前元素推入其中。

3. slice()方法

const arr = [1, 2, 3, 4, 5];
const size = 2;
const result = [];

for (let i = 0; i < arr.length; i += size) {
  const slice = arr.slice(i, i + size);
  result.push(slice);
}

console.log(result); // [[1, 2], [3, 4], [5]]

這個方法使用了for循環和slice()函數，每次從原數組中取出size個元素，並將它們推入result數組中。

三、按特定條件拆分

除了按照元素個數拆分以外，我們還可以根據需求將數組按照其他條件進行拆分。

1. 根據奇偶性拆分

const arr = [1, 2, 3, 4, 5];
const evens = [];
const odds = [];

for (let i = 0; i < arr.length; i++) {
  if (arr[i] % 2 === 0) {
    evens.push(arr[i]);
  } else {
    odds.push(arr[i]);
  }
}

console.log(evens); // [2, 4]
console.log(odds); // [1, 3, 5]

這個例子將原數組按照奇偶性拆分成了兩個小數組。它使用常規的for循環遍歷原數組，根據元素是否為偶數，將元素推入evens或odds數組中。

2. 根據值的範圍拆分

const arr = [1, 4, 6, 8, 10];
const small = [];
const medium = [];
const large = [];

for (let i = 0; i < arr.length; i++) {
  if (arr[i] < 5) {
    small.push(arr[i]);
  } else if (arr[i] < 9) {
    medium.push(arr[i]);
  } else {
    large.push(arr[i]);
  }
}

console.log(small); // [1, 4]
console.log(medium); // [6, 8]
console.log(large); // [10]

這個例子將原數組按照值的大小拆分成了三個小數組。它使用常規的for循環遍歷原數組，根據元素值的大小，將元素推入small、medium或large數組中。

3. 根據字符串關鍵詞拆分

const arr = ['apple', 'orange', 'mango', 'banana'];
const startsWithO = [];
const containsN = [];

for (let i = 0; i < arr.length; i++) {
  if (arr[i].startsWith('o')) {
    startsWithO.push(arr[i]);
  }
  if (arr[i].includes('n')) {
    containsN.push(arr[i]);
  }
}

console.log(startsWithO); // ['orange']
console.log(containsN); // ['orange', 'mango', 'banana']

這個例子將原數組按照字符串關鍵詞拆分成了兩個小數組。它使用常規的for循環遍歷原數組，根據元素的字符串形式包含特定的關鍵詞，將元素推入startsWithO或containsN數組中。