在 JavaScript 中，字符串截取主要通过以下方法实现，每种方法有不同的特性，适用于不同场景：

---

1. slice(startIndex, endIndex)

• 功能：从 startIndex 到 endIndex（不包含）截取子字符串。
• 特性：
  • 支持负数索引（从末尾倒数）。
  • 不修改原字符串。
• 示例：

  const str = "Hello World";
  
  // 正向索引
  str.slice(0, 5);      // "Hello"
  
  // 负索引
  str.slice(-5);        // "World"（从倒数第5位到末尾）
  str.slice(3, -2);     // "lo Wor"（第3位到倒数第2位前）
  
  // 省略 endIndex
  str.slice(6);         // "World"
  

---

2. substring(startIndex, endIndex)

• 功能：类似 slice，但自动处理索引顺序。
• 特性：
  • 负数索引视为 0。
  • 若 startIndex > endIndex，自动交换参数。
• 示例：

  const str = "Hello World";
  
  str.substring(0, 5);    // "Hello"
  str.substring(6, 11);   // "World"
  
  // 自动交换参数
  str.substring(5, 0);    // "Hello"
  
  // 负数视为0
  str.substring(-3, 5);   // "Hello"
  

---

3. substr(startIndex, length)（已弃用）

• 功能：从 startIndex 开始截取指定长度的子字符串。
• 注意：非标准方法，未来可能被移除，建议改用 slice。
• 示例：

  const str = "Hello World";
  str.substr(6, 5);      // "World"（从第6位开始，截5字符）
  str.substr(-5, 5);     // "World"（倒数第5位开始，截5字符）
  

---

4. 字符截取扩展方法

(1) 按分隔符截取：split()

// 分割字符串后取某一部分
const url = "https://example.com/path";
const domain = url.split("/")[2];  // "example.com"

(2) 正则表达式截取：match()

// 提取数字部分
const text = "ID: 12345";
const id = text.match(/\d+/)[0];   // "12345"

(3) 固定位置截取：charAt() 或 []

// 获取单个字符
const str = "Hello";
str.charAt(1);    // "e"
str[1];           // "e"（现代语法）

---

方法对比与选择建议

方法	推荐场景	注意点
slice	需要负数索引、灵活截取时	最常用，支持正向/反向索引
substring	明确知道索引且需自动处理参数顺序时	负数视为0，可能意外截取开头
split	按固定分隔符提取某部分（如URL处理）	分割数组后需索引访问
正则表达式	复杂模式匹配（如提取邮箱、日期格式）	需要熟悉正则语法

---

经典场景示例

1. 截取文件扩展名

const filename = "image.jpg";
const ext = filename.slice(filename.lastIndexOf(".") + 1); // "jpg"

2. 隐藏手机号中间四位

const phone = "13812345678";
const masked = phone.slice(0, 3) + "****" + phone.slice(-4); // "138****5678"

3. 提取URL路径

const url = "https://example.com/blog/post-1";
const path = url.split("/").slice(3).join("/"); // "blog/post-1"

---

注意事项

1. 索引范围：

   • 起始索引超过字符串长度 → 返回空字符串。
   • 结束索引超过字符串长度 → 截取到末尾。

2. 不可变性：

   • 所有方法返回新字符串，原字符串不变。

3. Unicode 字符：

   • 对包含 Emoji 或多字节字符的字符串，需注意索引位置：

     "👋🌍".slice(0, 2); // "👋"（正确）
     "👋🌍".substring(0, 2); // "�"（乱码，因每个 Emoji 占两个码位）
     

---

合理选择截取方法，可高效处理字符串操作。推荐优先使用 slice，慎用 substr。