当前位置:首页 > JavaScript

js 实现 unicode

2026-03-14 19:04:28JavaScript

Unicode 编码与解码

在 JavaScript 中,字符串是基于 Unicode 编码的,可以直接处理 Unicode 字符。以下是常见的 Unicode 操作方法:

直接使用 Unicode 字符

JavaScript 字符串可以直接包含 Unicode 字符:

const str = '你好世界'; // 直接使用 Unicode 字符

使用 Unicode 转义序列

通过 \u 前缀加上 4 位十六进制数表示 Unicode 字符:

const str = '\u4F60\u597D\u4E16\u754C'; // "你好世界"

获取字符的 Unicode 编码

使用 charCodeAt() 方法获取字符的 UTF-16 编码(0-65535):

'A'.charCodeAt(0); // 65

对于超出 BMP(基本多语言平面)的字符(如 emoji),使用 codePointAt()

'😊'.codePointAt(0); // 128522

从 Unicode 编码生成字符

使用 String.fromCharCode() 从 UTF-16 编码生成字符:

String.fromCharCode(65); // "A"

对于高位 Unicode 编码(> 0xFFFF),使用 String.fromCodePoint()

String.fromCodePoint(128522); // "😊"

处理代理对

高位 Unicode 字符(如 emoji)在 UTF-16 中由代理对表示:

const emoji = '😊';
emoji.length; // 2(代理对占用 2 个码元)
[...emoji].length; // 1(扩展运算符能正确识别)

正则表达式与 Unicode

启用 u 标志使正则表达式支持 Unicode:

/^\u{1F600}$/u.test('😀'); // true

字符串迭代

使用 for...of 或扩展运算符可正确迭代 Unicode 字符:

for (const char of '👨👩👧👦') {
  console.log(char); // 正确输出每个字符(包括组合字符)
}

常见编码转换

转换为 UTF-8 字节数组:

function encodeUTF8(str) {
  return new TextEncoder().encode(str);
}
encodeUTF8('你好'); // Uint8Array [228, 189, 160, 229, 165, 189]

从 UTF-8 解码:

js 实现 unicode

function decodeUTF8(bytes) {
  return new TextDecoder().decode(bytes);
}
decodeUTF8(new Uint8Array([228, 189, 160, 229, 165, 189])); // "你好"

注意事项

  • JavaScript 内部使用 UTF-16 编码字符串
  • 高位字符(如 emoji)会占用两个码元(length 为 2)
  • 使用 codePointAt()fromCodePoint() 处理高位字符更可靠
  • 现代浏览器已全面支持 Unicode 13.0+ 标准

标签: jsunicode
分享给朋友:

相关文章

css3结合js制作

css3结合js制作

CSS3 结合 JavaScript 制作动态效果 CSS3 和 JavaScript 结合可以实现丰富的动态效果,包括动画、交互和响应式设计。以下是几种常见的实现方式: CSS3 动画与 Java…

js实现拖拽

js实现拖拽

实现拖拽的基本步骤 通过监听鼠标事件(mousedown、mousemove、mouseup)实现拖拽功能。以下是核心代码逻辑: const draggableElement = document.…

js实现图片轮播

js实现图片轮播

实现基础图片轮播 使用HTML、CSS和JavaScript创建一个简单的图片轮播。HTML部分定义轮播容器和图片,CSS设置样式和动画效果,JavaScript处理轮播逻辑。 <div cl…

js实现复制到剪贴板

js实现复制到剪贴板

使用document.execCommand方法(传统方式,已废弃但部分浏览器仍支持) 该方法适用于旧版浏览器,但已被标记为废弃。执行前需确保文本已被选中: function copyToClipb…

js实现点击显示和隐藏

js实现点击显示和隐藏

实现点击显示和隐藏的JavaScript方法 使用classList.toggle切换类名 通过添加/移除CSS类控制元素的显示与隐藏,需提前在CSS中定义隐藏样式(如display: none)。…

js实现变形

js实现变形

使用 CSS 和 JavaScript 实现元素变形 在 JavaScript 中实现变形效果通常结合 CSS 的 transform 属性,通过动态修改该属性实现元素的旋转、缩放、倾斜或平移。 基…