JavaScript处理字符串前缀startsWith与后缀方法

JavaScript 中判断字符串前缀用 startsWith()、后缀用 endsWith()，均为 ES6 新增原生方法，支持位置参数，比正则或 slice 更直观；需注意 endsWith 第二参数表示检查长度而非索引，IE 不支持，可用 indexOf/lastIndexOf 降级。

JavaScript 中判断字符串前缀用 startsWith()，判断后缀用 endsWith()，这两个方法都是 ES6 新增的原生字符串方法，简洁、可读性强，且支持指定起始 / 结束位置，比正则或 slice() 手动截取更直观可靠。

startsWith()：精准判断前缀

检查字符串是否以指定子串开头，返回布尔值：

• 基本用法："hello".startsWith("he") → true
• 支持第二个参数：从指定索引位置开始检查（常用于忽略首部空格或前缀长度）
  例如：" hello".startsWith("he", 2) → true（从下标 2 开始，即跳过两个空格）
• 注意：空字符串 "" 是任意字符串的合法前缀，"abc".startsWith("") 恒为 true

endsWith()：可靠判断后缀

检查字符串是否以指定子串结尾，同样返回布尔值：

• 基本用法："world".endsWith("ld") → true
• 第二个参数可选，表示检查范围的长度（不是起始索引），即只看前 N 个字符：
  例如："testing".endsWith("ing", 7) → true（只检查前 7 个字符 "testin"？错！实际是检查字符串前 7 个字符组成的子串 "testin" 是否以 "ing" 结尾？也不对 —— 正确理解是：endsWith(search, length) 表示在字符串的前 length 个字符范围内判断是否以 search 结尾。所以 "testing".endsWith("ing", 7) 等价于 "testin".endsWith("ing") → false；而 "testing".endsWith("ing", 9) 或省略第二参数才为 true）
• 常见误用：混淆第二参数含义。推荐不传第二个参数，或明确用 str.slice(-search.length) === search 做等价逻辑辅助理解

兼容性与降级方案

IE 完全不支持这两个方法，如需兼容旧环境：

立即学习 “Java 免费学习笔记（深入）”；

• 可用 String.prototype.indexOf() === 0 模拟 startsWith：
  str.indexOf(prefix) === 0
• 可用 String.prototype.lastIndexOf() === str.length - suffix.length 模拟 endsWith：
  str.lastIndexOf(suffix) === str.length - suffix.length
• 现代项目建议用 Babel + polyfill，或直接依赖 core-js

实用小技巧

结合其他方法提升表达力：

• 忽略大小写判断：str.toLowerCase().startsWith(prefix.toLowerCase())
• 批量检查多个前缀：["http://", "https://", "ftp://"].some(p => str.startsWith(p))
• 配合解构或条件链使用：url?.startsWith("https://") ? "secure" : "insecure"
• 注意 Unicode 和代理对（如 emoji）：这两个方法按 UTF-16 编码单位操作，对大多数场景无感，但处理罕见字符时需留意 length 与视觉长度差异