字符串扩展
字符串的 Unicode 表示法
略...
字符串的遍历器接口
ES6 为字符串添加了遍历器接口，使得它可以被 for...of 循环遍历。
const str = 'Hello';
for (let i of str) {
console.log(i);
}
// H
// e
// l
// l
// o
优点：可识别大于 0xFFFF 的码点。传统的 for 循环无法识别。
const text = String.fromCodePoint(0x20BB7);
for (var i = 0; i < text.length; i++) {
console.log(text[i]);
}
// �
// �
for (let i of text) {
console.log(i);
}
// 𠮷
直接输入 U+2028 和 U+2029
console.log('中' === '\u4e2d'); // true
JavaScript 规定有 5 个字符不能直接在字符串里使用，只能使用转义。
- U+005C：反斜杠（reverse solidus)
- U+000D：回车（carriage return）
- U+2028：行分隔符（line separator）
- U+2029：段分隔符（paragraph separator）
- U+000A：换行符（line feed）
const json = '"\u2028"';
console.log(JSON.parse(json)); // 可能报错
JSON.stringify() 改造
略...
模板字符串
略...
实例：模板编译
略...
标签模板
const a = 1;
const b = 2;
console.log`test ${a} + ${b}`; // ["test ", " + ", ""] 1 2 将模板字符串处理成多个参数，再调用
const a = 1;
const b = 2;
function tag(strArr, ...values) { // <-- 第一个参数是一个数组( ["test ", " + ", ""] )，包含那些没有变量替换的部分，其余的参数是包含变量替换的部分
strArr.forEach(str => {
console.log(str);
});
console.log(...values);
}
tag`test ${a} + ${b}`;
// 'test'
// '+'
// ''
// 1 2
// 将变量按原来的位置拼回去
const a = 1;
const b = 2;
function tag(strArr, ...values) {
let result = '';
strArr.forEach((str, index) => {
if (str) result += str;
if (values[index]) result += values[index];
});
return result;
}
const tagResult = tag`test ${a} + ${b}`;
console.log(tagResult); // test 1 + 2
标签模板可以防止用户恶意输入。
略...