简介
字符编码、字符长度错误、截取字符错误、UTF8、Unicode
计算机重重底层之下都是由 0 和 1 组合,但是你知道他们是怎么一步步变成字符串的嘛?在我们现实生活中最常见的例子可以通过 wo 在新华字典中找到 我 这个字。同样计算机通过 0 和 1 组合在 字典 中查找到对应的字符,那 字典 内容是什么呢?
计算机诞生于 美国 它的使用者大多数使用英文,美国国家标准学会 便制定了这本字典包括了 26个大写英文字母、26个小写英文字母、10个阿拉伯数字等总共 256 个字符的 ASCII 字符集。
ASCII 用二进制来表示就是 0000 0000 到 1111 1111 被用得满满当当,汉字就没有地方可以放得下了这下怎么办?正所谓江山大有人才出,国标编码 GB 系列出现了,其中最耳熟能详的就是 GB2312。
那么问题来了世界拥有 2500 至 3500 种语言,有文字的语言有 930 种。你能想象你在浏览不同语言界面的时候,需要自己不断的去切换 字典 并且 每次切换查找不到的字符就会乱码出现。
书同文,车同轨,行同伦。
上面这句话歌颂了秦始王具有跨时代意义的成就,但是现实世界中统一语言显得不可能。那我们能否换个思路解决这个问题呢?先思考一个问题:“把大象放入冰箱需要几步”,答案大家都知道“打开,装进去,关上”。那统一字符怎么办呢?那就是创建一个足够大的字典把所有的字符都放进去。
Unicode 万国码 轰隆一声诞生了,顾名思义统一了全世界的所有文字编码可以到 Unicode Consortium 和 codepoints 中查看,对应的实现有UTF8、UTF16
、UTF-32。
UTF8、UTF16、UTF-32最大区别在于对应多少字节的数据,越大能存储的字符也就越多。其中 UTF-8 就是在互联网上使用最广的一种 Unicode 的实现方式,也就是现在 html 中最常看到的 所声明字符集。
UTF 最大的特点在于可变长的字节,例如 UTF8 可以是 1到4个字节来记录 万国码,为什么这么设计呢?日常使用得到的字符对应的字符编码没有必要占用这么多字节,例如 0000 0000 和 0000 0000 0000 0000 都能表示 0,那使用更短的字节所占用的空间更小,传输的速度更快。
在统一编码的过程中还出现了一个字符集 UCS-2,它固定使用 2个字节来编码 与 UTF 可变长度字符编码有一定程度上的不同,但是随着统一进程下被 UTF-16 收编了。
JavaScript 字符处理了解字符基本原理和进程后,那么 JavaScript 是什么编码呢?没错它就刚才 小插曲 中提到的 UCS-2,原因是 JavaScript 诞生时 UTF-16 还没有出现。
但是现在大家都在使用 UTF 可变长度字符编码,UTF-16 的可变字节为 2个或者 4个,而 UCS-2 却只有 2个。这样两个字符集之间就有存在一个 UCS-2 无法识别的 4字节,JavaScript 在处理字符时会傻傻的按着 UCS-2 的两字节去处理,再加上字典里没有这个字符笨笨的小脑袋瓜无法处理只能输出乱码。
由于 emoji 表情的普及,而且 emoji 刚好就是处于 UCS-2 的字典之外,在前端开发中遇到可能出现 emoji 的地方需要小心谨慎:
长度现在最为常用的 emoji 表情为 4个字节编码表示,由于 UCS-2 固定两个字节,在统计长度时 emoji 会被当做两个 UCS-2 字符,结果会和我们预期的输出大了一倍。
let emoji = "
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/102984.html
showImg(https://raw.githubusercontent.com/pushmetop/resource/master/30-seconds-for-everyday/url/poster.png); 简介 URL结构、组成、query、hash、axios数组传递错误、HTTP 请求 伴随着微信消息的提示音 小四 发来一段代码说 不知道为什么请求不到页面数据: axios.get...
showImg(https://segmentfault.com/img/remote/1460000018808058?w=900&h=500); 简介 SEO、sitemap、搜索引擎优化、简单教程 在暧昧期和暗恋期时心里总是悬挂着: ta 为什么还不和我表白? ta 是不是对我没感觉? ta 是不是只是把我当备胎? ta 是不是对谁都这样? 解决问题最简单的方式就是直接 问问对方...
简介 数组、对象、CSV、表格、工具 我们在 每日 30 秒之 arrayToCSV 中一起学习了将数组数据转化为 csv 表格数据并导出,那如果是对象数组怎么办呢?小脑袋瓜转得快的同学肯定会说:使用 Array.prototype.map 把需要导出的字段先遍历取出,再使用 arrayToCSV 将其导出为 CSV 数据表格。 可是你有没有想过如果一个对象数组数据非常之大时,使用 Array.p...
简介 字符串、数字、数组、对象、时间、类型、等于 科学家发现,人脑中会分泌多种能让人感到快乐、安全和成就感的物质,这些物质统称为快乐素。通常情况下,快乐素的释放水平很低,维持我们心情平静。只有当我们完成了预设目标,作为奖励,大脑才会增加快乐素的分泌,让人感受到满足和成功的喜悦。 这是之前看到的一篇关于 大脑奖励机制 文章的一段话,为了要获得奖励我们需要有预设目标,而是每日 30 秒系列也是为了帮助...
showImg(https://segmentfault.com/img/remote/1460000018771004?w=900&h=500); 简介 数组、CSV、表格、工具 将一个数组转化为逗号为分割符的字符串(CSV)即表格数据。 // 该源码来自于 https://30secondsofcode.org const arrayToCSV = (arr, delimiter = ,) =...
阅读 1596·2021-09-08 10:42
阅读 3585·2021-08-11 10:23
阅读 3915·2019-08-30 14:10
阅读 2703·2019-08-29 17:29
阅读 3070·2019-08-29 12:50
阅读 616·2019-08-26 13:36
阅读 3418·2019-08-26 11:59
阅读 1470·2019-08-23 16:23