讲师中心 微信公众号
AI工具推荐 视频效率加速

JS字符串编码_Unicode处理技巧

星伟同学_1380

星伟同学_1380

发布时间:2025-11-19 17:49:02

|

350人浏览过

|

来源于php中文网

原创

JavaScript字符串基于UTF-16编码,BMP字符占2字节,非BMP如emoji需代理对占4字节;'?'.length为2但实际是1个字符,应使用Array.from('?').length或扩展运算符获取正确长度;访问字符时charAt可能截断代理对导致乱码,推荐用String.prototype.at()或codePointAt判断;正则需加u标志支持Unicode,如/^.$/u.test('?')返回true,\p{Emoji}可匹配emoji。

js字符串编码_unicode处理技巧

JavaScript 中的字符串基于 UTF-16 编码,这使得处理 Unicode 字符时容易出现一些意料之外的问题。掌握正确的 Unicode 处理技巧,能有效避免字符截断、长度误判等问题。

理解 Unicode 与 UTF-16 编码

Unicode 是为全球字符设计的统一编码标准,每个字符对应一个码点(Code Point),例如 U+1F600 表示“?”。但 JS 字符串使用 UTF-16 编码存储,这意味着:

  • 基本多文种平面(BMP)字符(U+0000 到 U+FFFF)占 2 个字节,用一个 16 位单元表示
  • 超出 BMP 的字符(如 emoji、部分汉字)需用代理对(Surrogate Pair)表示,占 4 个字节,即两个 16 位单元

例如,“?” 的码点是 U+20BB7,在 JS 中会被表示为两个 \u{20BB7} 才能正确解析。

正确获取字符串长度

直接使用 string.length 可能返回错误结果,因为代理对会被算作两个字符。

错误示例:

'?'.length 返回 2,但实际上它是一个字符。

正确做法:

使用 ES6 的 Array.from() 或扩展运算符:

chartjs-reporter
chartjs-reporter

此技能用于在用户需要将结构化数据(查询结果、CSV 摘要、JSON 记录或 Python 字典/列表)转换为独立的 HTML 页面时使用。

下载
  • Array.from('?').length → 1
  • [...'?'].length → 1

或者使用 String.prototype.codePointAt() 遍历码点来计数。

安全地访问和截取字符

使用 charAt() 或索引访问可能只拿到代理对的一半,导致乱码。

  • '?'.charAt(0) 返回空字符或乱码

推荐使用 String.prototype.at()(现代浏览器支持)或结合 codePointAt 手动判断:

安全截取函数示例:

function getChar(str, index) { const code = str.codePointAt(index); if (code >= 0x10000) return str.slice(index, index + 2); return str[index]; }

正则表达式中的 Unicode 支持

默认正则不识别代理对或 Unicode 属性。使用 u 标志启用完整 Unicode 支持。

  • /^.$/u.test('?') → true(匹配单个码点)
  • /\p{Emoji}/u 可匹配 emoji(需配合属性)

利用 \p{} 和 Polyfill 可实现更复杂的 Unicode 字符分类匹配。

基本上就这些常见场景。只要注意码点与编码单元的区别,使用现代 API 处理,就能避免大多数 Unicode 陷阱。

热门AI工具

更多
豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

讯飞绘文

讯飞绘文是一款由科大讯飞推出的一站式 AIGC 内容运营平台。

PixPix
PixPix Hot

PixPix是一款面向电商视觉生产的AI商品图生成工具。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

切问学术

切问学术是一款AI论文写作工具,复旦大学NLP团队推出的AI学术智能体。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

火山引擎

火山引擎是一款面向企业的云计算与AI服务平台。

Seko
Seko Hot

一款AI视频创作工具,主要用于商汤科技推出的创编一体的AI短视频创作Agent,适合需要提升相关任务效率的用户。

讯飞智作

讯飞智作是一款AI视频创作工具,AI文本配音工具,数字人课程、营销视频制作。

相关专题

更多
js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

4516

2023.06.20

正则表达式不包含
正则表达式不包含

正则表达式,又称规则表达式,,是一种文本模式,包括普通字符和特殊字符,是计算机科学的一个概念。正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串,通常被用来检索、替换那些符合某个模式的文本。php中文网给大家带来了有关正则表达式的相关教程以及文章,希望对大家能有所帮助。

3021

2023.07.05

java正则表达式语法
java正则表达式语法

java正则表达式语法是一种模式匹配工具,它非常有用,可以在处理文本和字符串时快速地查找、替换、验证和提取特定的模式和数据。本专题提供java正则表达式语法的相关文章、下载和专题,供大家免费下载体验。

8362

2023.07.05

java正则表达式匹配字符串
java正则表达式匹配字符串

在Java中,我们可以使用正则表达式来匹配字符串。本专题为大家带来java正则表达式匹配字符串的相关内容,帮助大家解决问题。

812

2023.08.11

正则表达式空格
正则表达式空格

正则表达式空格可以用“s”来表示,它是一个特殊的元字符,用于匹配任意空白字符,包括空格、制表符、换行符等。本专题为大家提供正则表达式相关的文章、下载、课程内容,供大家免费下载体验。

520

2023.08.31

Python爬虫获取数据的方法
Python爬虫获取数据的方法

Python爬虫可以通过请求库发送HTTP请求、解析库解析HTML、正则表达式提取数据,或使用数据抓取框架来获取数据。更多关于Python爬虫相关知识。详情阅读本专题下面的文章。php中文网欢迎大家前来学习。

693

2023.11.13

正则表达式空格如何表示
正则表达式空格如何表示

正则表达式空格可以用“s”来表示,它是一个特殊的元字符,用于匹配任意空白字符,包括空格、制表符、换行符等。想了解更多正则表达式空格怎么表示的内容,可以访问下面的文章。

406

2023.11.17

正则表达式中如何匹配数字
正则表达式中如何匹配数字

正则表达式中可以通过匹配单个数字、匹配多个数字、匹配固定长度的数字、匹配整数和小数、匹配负数和匹配科学计数法表示的数字的方法匹配数字。更多关于正则表达式的相关知识详情请看本专题下面的文章。php中文网欢迎大家前来学习。

719

2023.12.06

Gradle插件开发入门教程
Gradle插件开发入门教程

本专题介绍Gradle插件开发的基本流程,涵盖插件类编写、自定义任务注册、扩展参数设计和插件应用方法,帮助你理解插件如何组织构建逻辑,减少多个项目之间的重复配置。

60

2026.10.22

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.3万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn