substring和substr有什么区别

substring() 和 substr() 都是用于截取字符串的方法，但它们在参数含义和行为上有重要区别。substr() 现已废弃，不建议在新项目中使用。

主要区别对比表

特性	substring(start, end)	substr(start, length)
参数含义	start: 起始索引 end: 结束索引	start: 起始索引 length: 要截取的字符数
结束参数	第二个参数是结束索引（不包含）	第二个参数是要截取的长度
负数参数	将负数转换为 0	负数 start: 从字符串末尾倒数 负数 length: 返回空字符串
参数顺序	如果 start > end，会自动交换参数	不会交换参数
ECMAScript 状态	推荐使用	已废弃 (不推荐使用)
替代方案	本身可用	使用 slice() 或 substring()

详细说明

substring(startIndex, endIndex)

• 参数 ：
  • startIndex：必需，起始位置（包含）
  • endIndex：可选，结束位置（不包含）
• 特点 ：
  • 如果省略 endIndex，则截取到字符串末尾
  • 如果任一参数为负数，会被当作 0 处理
  • 如果 startIndex > endIndex，会自动交换两个参数
  • 如果参数是 NaN，会被当作 0

const str = "Hello World";

console.log(str.substring(6));      // "World"
console.log(str.substring(6, 11));  // "World"
console.log(str.substring(6, 7));   // "W"
console.log(str.substring(3, 0));   // "Hel" (参数自动交换)
console.log(str.substring(-3));     // "Hello World" (负数变0)

substr(startIndex, length) ❌（已废弃）

• 参数 ：
  • startIndex：必需，起始位置
  • length：可选，要截取的字符数
• 特点 ：
  • startIndex 可以是负数，表示从字符串末尾倒数
  • 如果 length 为 0 或负数，返回空字符串
  • 如果省略 length，则截取到字符串末尾

const str = "Hello World";

console.log(str.substr(6));       // "World"
console.log(str.substr(6, 5));    // "World"
console.log(str.substr(6, 1));    // "W"
console.log(str.substr(-3));      // "rld" (从倒数第3个开始)
console.log(str.substr(-5, 2));   // "Wo"

现代替代方案：slice()

由于 substr() 已废弃，推荐使用 slice() 作为替代：

const str = "Hello World";

// 基本用法
console.log(str.slice(6));       // "World"
console.log(str.slice(6, 11));   // "World"

// 支持负数索引
console.log(str.slice(-5));      // "World" (最后5个字符)
console.log(str.slice(0, -6));   // "Hello" (从开头到倒数第6个)

// 负数参数表示从末尾开始计数
console.log(str.slice(6, -1));   // "Worl" (从索引6到倒数第1个)

三种方法对比

const str = "JavaScript";

// 正数参数
console.log(str.substring(4, 7));  // "Scr" (索引4到7)
console.log(str.substr(4, 3));     // "Scr" (从索引4开始，取3个字符)
console.log(str.slice(4, 7));      // "Scr" (索引4到7)

// 负数参数
console.log(str.substring(-3));     // "JavaScript" (负数变0)
console.log(str.substr(-3));        // "ipt" (最后3个字符)
console.log(str.slice(-3));         // "ipt" (最后3个字符)

// 参数交换
console.log(str.substring(7, 4));   // "Scr" (自动交换为4,7)
console.log(str.substr(7, 4));      // "ipt" (从索引7取4个，实际只有3个)
console.log(str.slice(7, 4));       // "" (start>end，返回空)

最佳实践建议

1. 不再使用 substr() ，因为它是已废弃的旧方法
2. 根据需求选择 ：
   • 使用 substring()：当需要明确的开始和结束索引时
   • 使用 slice()：当需要负数索引功能时，或作为 substr() 的替代
3. 记忆技巧 ：
   • substring：第二个参数是"到哪里结束"
   • substr：第二个参数是"要截取多长"（已废弃）
   • slice：类似于数组的 slice 方法，支持负数索引

简单来说：请使用 slice() 或 substring()，避免使用 substr()。