JS 字符串反转，别再只用 split() 硬怼了

前端面试里，“实现字符串反转”是个老生常谈的考题。很多人脱口而出就是 split('').reverse().join('')，这行代码确实简洁，在纯英文或普通中文场景下完全够用。但在实际业务中，如果你把它用在用户昵称、表情混排的评论文案里，大概率会遭遇“翻车现场”。

问题出在哪？主要在于字符编码机制。JavaScript 里的 String 本质上是 UTF-16 编码序列。对于像中文这样的双字节字符，或者像常见 Emoji（如 😀）这种位于基本多文种平面之外的字符，它们由两个独立的码元组成。用 split('') 切割时，浏览器只能按码元断开，导致一个完整的字符被劈成两半。想象一下，一个表情符号被反转后变成一堆乱码，用户体验瞬间崩塌。

更棘手的是组合字符，比如“家庭组”表情 👨‍👩‍👧‍👦。它由多个单人图标通过零宽连接符（ZWJ）拼凑而成。普通的数组转换无法识别这种视觉上的整体性，反向排列后，连接符错位，原本完整的一家子就变成了支离破碎的单个人形。

既然常规手段有缺陷，咱们得换个思路。想要兼容大部分现代浏览器，推荐使用 扩展运算符 [...str] 或者 Array.from(str)。这两者在底层都能更好地处理 Unicode 码点（Code Point），而不是简单的 UTF-16 单元。把它们配合 reverse() 使用，能解决绝大多数生僻字和基础表情的反转问题。

const str = "你好 World";
console.log([...str].reverse().join('')); // 输出：dlroW 好你

这种方法比 split('') 更稳健，因为它把每个完整的字符当作独立元素。对于国内大部分以单字为主的业务场景，[...str] 方案性价比最高，既保留了原生语法的清爽，又规避了乱码风险。

但如果你对精度要求极高，比如涉及复杂的国际化 UI 编辑功能，还得关注 Intl.Segmenter。这是 ECMAScript 较新的 API，专门用来区分“词素边界”（Grapheme Clusters）。它能精准识别那些由零宽连接符粘合在一起的复合表情，保证它们在反转时依然作为一个整体移动。虽然目前兼容性不如前者广泛，但在 Node.js 环境或新版 Chrome 里已经可用，是处理复杂文本的未来方向。

性能方面也不用过度焦虑。如果是短文本（比如几百字内的标题、评论），无论哪种方案耗时都在毫秒级，几乎可以忽略不计。只有在处理万级以上的长日志或大段富文本时，才需要担心遍历开销。这时候建议先评估需求：真的需要全量反转吗？能否分段处理？盲目追求算法最优解往往是过早优化。

归根结底，工具选择取决于场景。后台管理系统的 ID 生成用 split 没问题；面向 C 端用户的动态输入框，请务必升级到扩展运算符方案；若涉及严格的文本对齐或富文本渲染，再考虑引入分词逻辑。技术没有绝对的好坏，只有适不适合当下的业务。下次写反转函数时，不妨多问自己一句：这里的字符串里，藏着多少隐藏的彩蛋？