JavaScript字符串操作技巧与方法大全

JavaScript字符串看似简单，实则暗藏玄机：它作为不可变原始类型，所有“修改”操作都返回新字符串而非原地变更；面对emoji、中文等Unicode字符时，传统截取方法极易导致乱码，需借助Array.from()或Intl.Segmenter精准处理；判断子串应优先使用语义清晰的includes()，全局替换务必警惕replace()只换首个的陷阱，善用replaceAll()或带g标志的正则；而标准trim()对全角空格、NBSP等无效，必须自定义正则才能真正“干净”去空白——掌握这四大高频痛点，才能避开真实项目中最常踩的坑。

JavaScript 字符串是原始类型，不可变——所有“修改”操作实际都返回新字符串，原字符串不变。这点不理解，后续踩坑会非常多。

如何判断字符串是否包含某个子串

别再用 indexOf() !== -1 手动判断了，ES6 起直接用 includes()：

• str.includes('abc') 返回布尔值，支持第二个参数指定起始位置
• 注意大小写敏感，如需忽略大小写，先转成统一大小写：str.toLowerCase().includes('abc')
• indexOf() 没过时，但仅当你需要知道位置时才用；search() 支持正则但不支持全局标志 g，容易误判

如何安全地截取字符串（尤其含 emoji 或中文）

用 substring() 或 slice() 前必须意识到：JavaScript 字符串基于 UTF-16 编码，一个 emoji（如 ?）或某些生僻汉字可能占 2 个 code unit。直接按索引截取会得到乱码（如 '?'.substring(0, 1) 返回 ''）。

• 优先用 Array.from(str) 或 [...str] 转为真正字符数组，再操作：Array.from(str).slice(0, 3).join('')
• Node.js 16+ 或现代浏览器可用 Intl.Segmenter（更准确切分字形），但兼容性差，日常简单场景够不着
• substr() 已废弃，不要用

如何替换所有匹配项（不止第一个）

replace() 默认只换第一个匹配，这是高频翻车点。

• 要全局替换，正则必须带 g 标志：str.replace(/a/g, 'b')
• 若替换内容来自变量，需手动转义正则特殊字符，或改用 replaceAll()（ES2021+）：str.replaceAll(searchStr, replaceStr)
• replaceAll() 不支持正则（只接受字符串），且在旧环境（如 Safari 15.4 之前）不可用，上线前务必检查目标环境

如何去除首尾空白（包括全角空格、NBSP 等）

trim() 只处理 ASCII 空白（U+0009–U+000D、U+0020、U+0085、U+200B–U+200F、U+2028–U+2029），对中文全角空格（U+3000）、不间断空格（U+00A0）无效。

• 通用方案：str.replace(/^[\s\uFEFF\xA0\u3000]+|[\s\uFEFF\xA0\u3000]+$/g, '')
• 如确定只处理中文环境，可简化为：str.replace(/^[　\s]+|[　\s]+$/g, '')（　 是全角空格）
• Node.js 18+ 支持 trimStart()/trimEnd() 的增强版，但浏览器兼容性仍不齐，慎用

字符串方法看着简单，但 Unicode 处理、环境兼容、不可变语义这三点，才是真实项目里最常卡住人的地方。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《JavaScript字符串操作技巧与方法大全》文章吧，也可关注golang学习网公众号了解相关技术文章。