小伙伴們，你們會用 JavaScript 的 split 方法嗎？最近我才發(fā)現，原來我多年來一直沒真正掌握它，結果在解題時被卡住了。所以今天，我決定好好整理一下這個方法的用法。

在討論問題之前，先來看一下 split 的兩種基本用法。

一、split 的兩種基本用法

1. 字符參數拆分

split 方法的主要用途就是分割字符串，最常見的就是用某個特定字符作為分隔符，比如電商平臺上生成商品編號時，需要根據特定字符對名稱進行拆分：

'Product:Code:2024'.split(':');
// 結果：['Product', 'Code', '2024']

在這個例子中，使用 : 作為分隔符，把字符串分割成多個部分。這個用法大家應該很熟悉，在生成或解析帶有固定分隔符的數據時非常常用。

2. 正則表達式分隔：按字符類型拆分

有時候，我們并不是按某個具體字符，而是按一類字符來分割字符串。比如在評論數據處理中，我們想去掉所有標點符號，只保留文字內容：

'Hello, how are you?'.split(/\W+/).filter(Boolean);
// 結果：['Hello', 'how', 'are', 'you']

在這個例子中：

• 使用正則表達式 \W+ 來匹配一個或多個非字母字符，并將它們作為分隔符。
• split 按這些分隔符將字符串分割成單詞列表。
• filter(Boolean) 去除了分割后產生的空字符串，確保得到的數組只包含有效的單詞。

這種用法在清理用戶輸入的文本或提取內容時非常有用。

二、為什么說我沒學會 split 呢？

1. 帶捕獲組的正則分割

看看下面這個代碼示例：

'alphaABbetaCDgamma'.split(/(AB|CD)/);

如果你以為結果是 ['alpha', 'beta', 'gamma']，那么需要重新思考了！

// 實際結果：['alpha', 'AB', 'beta', 'CD', 'gamma']

沒錯，結果數組中不僅包含分割后的文本，還包含了分隔符 AB 和 CD。當 split 使用正則表達式分隔時，如果正則中有捕獲組，那么匹配到的捕獲組內容也會出現在最終的結果中。這一點非常容易被忽略。

2. 處理多分隔符日期字符串

假設我們需要處理一組日期字符串，這些日期可能用 - 或 / 作為分隔符。我們想把年份加 1 并保留原有的分隔符格式。這種場景下，用帶捕獲組的正則表達式非常便捷：

function addOneYear(date) {
  const parts = date.split(/(-|\/)/);  // 捕獲分隔符 - 或 /
  parts[0] = Number(parts[0]) + 1;     // 將年份加 1
  return parts.join('');               // 保留分隔符
}

console.log(addOneYear('2023-05-15')); // 輸出: 2024-05-15
console.log(addOneYear('2023/05/15')); // 輸出: 2024/05/15

在這里，分隔符 - 或 / 被保留在結果數組中，這樣在處理完數據后可以重新拼接出原來的日期格式，非常方便。

3. 限制分割次數

split 方法的第二個參數 limit 可以限制返回數組的長度。在處理一些日志或長文本時，我們可能只想要前幾段內容，后續(xù)內容可以忽略。這時 limit 就派上用場了。

'section1ABsection2CDsection3'.split(/(AB|CD)/, 3);
// 結果：['section1', 'AB', 'section2']

在這個例子中，我們用 limit 限制了數組長度為 3，因此 split 從第一個匹配位置分割，并在達到限制長度后停止，剩下的部分被忽略。這種用法對于需要提取特定部分內容時很實用，比如只保留標題和前兩段描述。

三、總結

通過以上進階用法，我們可以更靈活地使用 split 處理字符串數據。無論是在電商中生成規(guī)范的商品代碼，還是在處理評論內容、日期格式等場景中，這些技巧都能幫助我們更高效地進行字符串分割。