字符串的扩展

1.字符的 Unicode 表示法

• 采用\uxxxx形式表示一个字符

  "\u0061" // "a"

  • 只限于码点在\u0000~\uFFFF之间

  • 超出这个范围的字符，必须用两个双字节的形式表示

    "\uD842\uDFB7" // "?"

  • 如果直接在\u后面跟上超过0xFFFF的数值

    如\u20BB7，JavaScript会理解成\u20BB+7 // " 7"

  • 只要将码点放入大括号，就能正确解读该字符

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

  • 大括号表示法与四字节的 UTF-16 编码是等价的

    '\u{1F680}' === '\uD83D\uDE80' // true

2.字符串的遍历器接口

添加了字符串的遍历器接口

• 可以被for...of循环遍历
• 可以识别大于0xFFFF的码点，而传统的for循环无法识别

3.直接输入 U+2028 和 U+2029

允许直接输入字符，以及输入字符的转义形式

• 直接在字符串里面输入这个汉字，或者它的转义形式\u4e2d，两者是等价的

  '中' === '\u4e2d' // true

• 不能在字符串里面直接使用，只能使用转义形式的5个字符

  • U+005C：反斜杠
  • U+000D：回车
  • U+2028：行分隔符
  • U+2029：段分隔符
  • U+000A：换行符

• JSON 格式问题

  • 服务器输出的 JSON 被JSON.parse解析，就有可能直接报错

    const json = '"\u2028"';
    JSON.parse(json); // 可能报错
    

  • ES2019 允许 JavaScript 字符串直接输入 U+2028（行分隔符）和 U+2029（段分隔符）

    const PS = eval("'\u2029'"); //不报错

4.JSON.stringify() 的改造

标准JSON 数据必须是 UTF-8 编码

• JSON.stringify()方法有可能返回不符合 UTF-8 标准的字符串

• UTF-8 标准规定，0xD800到0xDFFF之间的码点，不能单独使用，必须配对使用

• JSON.stringify()可能返回0xD800到0xDFFF之间的单个码点

  JSON.stringify('\u{D834}') // "\u{D834}"

• ES2019 改变了JSON.stringify()的行为

  • 如果遇到0xD800到0xDFFF之间的单个码点，或者不存在的配对形式，它会返回转义字符串

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

5.模板字符串

模板字符串是增强版的字符串

• 用反引号（`）标识

• 可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量

• 在模板字符串中需要使用反引号，则要用反斜杠进行转义

• 使用模板字符串表示多行字符串，所有的空格和缩进都会被保留在输出之中

• 嵌入变量，需要将变量名写在${}之中

  • 大括号内部可以放入任意的 JavaScript 表达式，可以进行运算，以及引用对象属性
  • 模板字符串之中还能调用函数
  • 大括号中的值不是字符串，将按照一般的规则转为字符串（如对象默认调用toString方法）
  • 大括号内部是一个字符串，将会原样输出

• 模板字符串中的变量没有声明会报错

• 模板字符串甚至能进行嵌套

• 需要引用模板字符串本身，可以写成函数

  let func = (name) => `Hello ${name}!`;
  func('Jack') // "Hello Jack!"
  

6.标签模板

“标签模板”功能

• 紧跟在一个函数名后面，该函数将被调用来处理这个模板字符串

  alert`hello`
  // 等同于
  alert(['hello'])
  

• 标签模板其实不是模板，而是函数调用的一种特殊形式

  • “标签”指的就是函数，紧跟在后面的模板字符串就是它的参数。

• 如果模板字符里面有变量，会将模板字符串先处理成多个参数，再调用函数

  let a = 5;
  let b = 10;
  tag`Hello ${ a + b } world ${ a * b }`;
  // 等同于
  tag(['Hello ', ' world ', ''], 15, 50);
  

• 重要应用

  • 过滤 HTML 字符串，防止用户输入恶意内容
  • 多语言转换（国际化处理）
  • 通过标签函数，你可以自己添加处理功能
  • 在 JavaScript 语言之中嵌入其他语言

7.模板字符串的限制

• 模板字符串默认会将字符串转义，导致无法嵌入其他语言

• 有时在嵌入其他语言时JavaScript 引擎会报错，原因就在于字符串的转义

• ES2018 放松了对标签模板里面的字符串转义的限制。如果遇到不合法的字符串转义，就返回undefined

  • 只在标签模板解析字符串时生效

思维导图