ES6中对字符串处理的优点

1、字符的Unicode表示法

ES6之前 Unicode 只能表示 \u0000 -- \uFFFF 之间的字符。
ES6可以表示超过这个 范围的unicode字符 如

//原来 ES6 之前
"\uD842\uDFB7"
// "?"

"\u20BB7"
// " 7"

// ES6 

"\u{20bb7}"
// "?"

//?
"\u{1F680}" === "\uD83D\uDE80"

好多中文是的Unicode是超过 \uFFFF 的,有了这种表示,我们就可以用一个字节 表示表示一个字符而不像原来用两个字节。

JavaScript 的6中表示一个字符的方法

'\z' === 'z'  // true
'\172' === 'z' // true
'\x7A' === 'z' // true
'\u007A' === 'z' // true
'\u{7A}' === 'z' // true

2、字符串的遍历接口

for...of

他的优点
普通的for循环,不能识别编码大于 '\uffff' 的码点字符会把它拆分为两个

//普通遍历会把超表示范围的码点 是被为两个,拆分后如果是不可打印字符会输出空
let text = String.fromCodePoint(0x20BB7)
for (let i = 0;i < text.length; i++){
    console.log(text[i]);
}
//"�"
//"�"
 
// 用 for...of
for (let i of text) {
  console.log(i);
}
// "?"

3、直接输入 U+2028 和 U+2029(分行符 和 分段符)

JavaScript 规定有5个字符,不能在字符串里面直接使用,只能使用转义形式。
U+005C:反斜杠(reverse solidus)
U+000D:回车(carriage return)
U+2028:行分隔符(line separator)
U+2029:段分隔符(paragraph separator)
U+000A:换行符(line feed)
例如想输出 反斜杠 只能先转意 \ 或者 \005c

4、JSON.stringify() 的改造

根据标准,JSON 数据必须是 UTF-8 编码。但是,现在的JSON.stringify()方法有可能返回不符合 UTF-8 标准的字符串。
具体来说,UTF-8 标准规定,0xD800到0xDFFF之间的码点,不能单独使用,必须配对使用。比如,\uD834\uDF06是两个码点,但是必须放在一起配对使用,代表字符?。这是为了表示码点大于0xFFFF的字符的一种变通方法。单独使用\uD834和\uDFO6这两个码点是不合法的,或者颠倒顺序也不行,因为\uDF06\uD834并没有对应的字符。
JSON.stringify()的问题在于,它可能返回0xD800到0xDFFF之间的单个码点。
JSON.stringify('\u{D834}') // "\u{D834}"
为了确保返回的是合法的 UTF-8 字符,ES2019 改变了JSON.stringify()的行为。如果遇到0xD800到0xDFFF之间的单个码点,或者不存在的配对形式,它会返回转义字符串,留给应用自己决定下一步的处理。

JSON.stringify('\u{D834}') // ""\uD834""
JSON.stringify('\uDF06\uD834') // ""\udf06\ud834""

5、字符串模版
用反引号包裹

// 普通字符串
`In JavaScript '\n' is a line-feed.`

// 多行字符串
`In JavaScript this is
 not legal.`

console.log(`string text line 1
string text line 2`);

// 字符串中嵌入变量
let name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`

字符串模版中要包含 反引号 就需要用转移字符 ```JS let greeting =`Yo` World!`;

使用字符串模版表示多行字符串,所有的空格和缩进都会被保存在输出之中

$('#list').html(<ul> <li>first</li> <li>second</li> </ul>);

 字符模版中可以嵌入变量 ,不过要用 ${var} 包裹,

function authorize(user, action) {
if (!user.hasPrivilege(action)) {
throw new Error(
// 传统写法为
// 'User '
// + user.name
// + ' is not authorized to do '
// + action
// + '.'
User ${user.name} is not authorized to do ${action}.);
}
}

字符模版中可以写表达式
字符串模板中可以调用函数

function fn() {
return "Hello World";
}

foo ${fn()} bar


字符串模板可以嵌套

const tmpl = addrs => <table> ${addrs.map(addr =>

\({addr.first}</td></tr> <tr><td>\){addr.last}
).join('')} </table>;
### 6、标签模板

alert 123
//等同于
alert(123)
```
字符串模板紧跟在一个函数名之后。形成一个函数调用的功能。

字符串扩展

转载于:https://www.cnblogs.com/wjw-blog/p/11022017.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值