JavaScript 中 endsWith() 方法的使用解析

endsWith() 是 JavaScript 字符串原生方法，用于判断字符串是否以指定子串结尾，返回布尔值，支持可选的长度参数，常用于条件过滤、权限校验等场景。

`endswith()` 是 javascript 字符串原生方法，用于判断字符串是否以指定子串结尾，返回布尔值，支持可选的长度参数，常用于条件过滤、权限校验等场景。

在前端开发中，String.prototype.endsWith() 是一个简洁高效的字符串匹配工具，尤其适用于处理具有固定后缀规则的标识符（如权限键名、路由路径、CSS 类名等）。它自 ES6（ECMAScript 2015）起成为标准 API，现代浏览器及 Node.js（≥4.0）均原生支持，无需 polyfill。

基本语法

str.endsWith(searchString[, length])

• searchString：必需，要搜索的子字符串；
• length：可选，指定在字符串的前 length 个字符内进行匹配（默认为字符串全长）。

实际应用示例（解决权限键过滤问题）

回到你的场景：你有一个权限映射对象 module_adlari，其中键名如 "bina-verisi:yazma" 包含 :yazma 后缀，而你在 DOM 操作中需跳过所有含 :yazma 的键，避免因 $("." + a) 解析 ".bina-verisi:yazma" 导致 jQuery 报错 Uncaught Error: Syntax error, unrecognized expression: unsupported pseudo: yazma（因 : 被误识别为 CSS 伪类）。

✅ 正确做法是在遍历前用 endsWith() 过滤：

if (!izinler.TASINMAZ_YONETICI) {  for (const ad in Ayarlar.module_adlari) {    if (!izinler[ad]) {      const adlar = ad.split(",");      adlar.forEach(a => {        // ✅ 仅处理不以 ':yazma' 结尾的键名        if (!a.trim().endsWith(':yazma')) {          $(`.${a.trim()}`).parent().remove();        }      });    }  }}

? 注意细节：

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

• 使用 .trim() 防止空格干扰（如 "kira-verisi:yazma, gsm-verisi" 分割后 gsm-verisi 前可能有空格）；
• endsWith() 区分大小写，:YAZMA 不会匹配 ':yazma'；
• 若需兼容老旧环境（如 IE），可用 a.slice(-6) === ':yazma' 替代，但推荐优先使用原生方法。

更灵活的扩展方案

若需排除所有含冒号的键（不限于 :yazma），可改用 includes()：

if (!a.trim().includes(':')) {  $(`.${a.trim()}`).parent().remove();}

或结合正则实现更复杂规则（如排除 :okuma、:yazma、:silme）：

if (!/:(okuma|yazma|silme)$/.test(a.trim())) {  $(`.${a.trim()}`).parent().remove();}

总结

• endsWith() 是语义清晰、性能优良的字符串判断方法，比正则更轻量，比 slice() 更可读；
• 在权限控制、路由守卫、模板渲染等场景中，它是精准过滤后缀型标识符的首选；
• 务必配合 trim() 处理分割后的空白字符，并注意浏览器兼容性要求（必要时降级）；
• 避免直接将未清洗的字符串拼入 CSS 选择器或 URL，这是引发运行时错误的常见根源。

掌握 endsWith()，让你的字符串逻辑更健壮、更易维护。