16进制es6_ES6对unicode的支持

Chrome 内置抓包工具

Block requests

截取长图

代码的覆盖率分析

Make site better

ES5只支持\uffff(65535)以内的unicode

比如你写"\u22000" //在unicode中对应为生僻字&＃xff1a;&＃x22000;

但是最后展示为&＃xff1a;"∀0"。

结论&＃xff1a;Javascript 内部&＃xff0c;字符以 UTF-16 的格式储存&＃xff0c;每个字符固定为2个字节。对于那些需要4个字节储存的字符(Unicode 码点大于0xFFFF的字符)&＃xff0c;Javascript 会认为它们是两个字符。

那么参考下各种字符的unicode区间&＃xff0c;其实还是有很多会用到的字符&＃xff0c;它们的区间大于0xFFFF的。比如我们常见的emoji表情。这些在ES5中就没办法进行处理了。

ES6的写法

万能写法&＃xff1a;{}"\u{22000}"

这种写法比较简便&＃xff0c;在正则中也可以使用&＃xff0c;前提是要有u标示符, 否则会被识别为正则语法中的花括号"&＃x22000;的蛋".match(/\u{22000}/u) //return ["&＃x22000;"]

"&＃x22000;的蛋".match(/\u{22000}/) //return null

String.prototype.charCodeAt vs String.prototype.codePointAt

前者是ES5的写法&＃xff0c;后者是ES6的写法&＃xff0c;均由字符返回十进制的unicode编码&＃xff0c;区别在于是否支持0xffff以上。"&＃x22000;".charCodeAt() //55368 这个值是错的

"&＃x22000;".codePointAt() //139264 十进制

"&＃x22000;".codePointAt().toString(16) //"22000" 转为16进制的快捷方法

String.fromCharCode vs String.fromCodePoint

前者是ES5的写法&＃xff0c;后者是ES6的写法&＃xff0c;由unicode编码返回相应的字符串。

需要注意参数默认为十进制String.fromCodePoint(0x22000) //"&＃x22000;"

String.fromCodePoint(22000) //"嗰"

正则表达式的Unicode Property支持

ES5中的正则是不支持Unicode Property的&＃xff0c;而ES6可以支持&＃xff0c;这样我们可以更方便的用正则包含或排除某些字符(常用的unicode字符属性)&＃xff0c;比较好用的一个是C属性&＃xff0c;表示不对应任何字符的unicode码&＃xff0c;可以有效的过滤掉没用的unicode码。

比如这个例子&＃xff1a;\uffff是一个不对应任何字符的码点&＃xff0c;我们就可以很容易的过滤掉这个非法字符。"\u6211\uffff".replace(/\p{C}/u, &＃39;&＃39;); //我

Babel能不能兼容&＃xff1f;

能。Babel编译器可以转换uncode regex, babel-polyfill可以兼容String.fromCodePoint和String.prototype.codePointAt。

注&＃xff1a;String.fromCodePoint和String.prototype.codePointAt属于新的API&＃xff0c;所有ES6&＃43;中新的API&＃xff0c;都需要使用babel-polyfill&＃xff0c;可以在项目中引用babel-polyfill&＃xff0c;或在编译器中配置babel-plugin-transform-runtime.

参考文章

彩蛋&＃xff1a;一些有意思的小bugvar reg &＃61; /[\u{ffff}-\u{fffff}]/u

reg.test("&＃x1f601;") //true

var reg &＃61; /[\u0030-\uffff]/

reg.test("&＃x1f601;") //true

var reg &＃61; /[\u{0030}-\u{ffff}]/u

reg.test("&＃x1f601;") //false

var reg &＃61; /[\u4e00-\u9fa5]/

reg.test("&＃x1f601;") //false

不用u&＃xff0c;进入特殊字符区间&＃xff0c;就会出错&＃xff0c;期望是false, 实际是true

var reg &＃61; /[\u4e00-\uffff]/

reg.test("\u{fffff}")

var reg&＃61; /&＃x1f601;/

reg.test("&＃x1f601;") //true

var reg&＃61; /&＃x1f601;{2}/

reg.test("&＃x1f601;&＃x1f601;") //false

var reg&＃61; /&＃x1f601;{2}/u

reg.test("&＃x1f601;&＃x1f601;") //true