ES6学习笔记4： 字符串的扩展

 

目录

字符的 Unicode 表示法

codePointAt()

String.fromCodePoint()

字符串的遍历器接口

normalize()

includes(), startsWith(), endsWith()

repeat()

padStart()，padEnd()

matchAll()

模板字符串

实例：模板编译

标签模板

String.raw()

模板字符串的限制

---

字符的 Unicode 表示法

一般是\u再加4位16进制数，如\0061,对应字母a

 范围在0000~ffff,如果超出了这个范围，则需要用2个字节来表示。如?

也可以用大括号{}把十六进制数包裹起来。如上面的a同时也可以这样表示：

 ?可以表示为

 经测试，大括号里最多可以有5位16进制数

 

多个字母如abc可以表示为

 如果\u加上超过4位16进制数且在不加{}的情况下会怎么样呢？

答：会将前面的4位计算出对应的字符，后面的当字符串相连接起来，如：

有了这种表示法之后，JavaScript 共有 6 种方法可以表示一个字符。

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

 

另外补充下表情的unicode

 

 

codePointAt()

可以用charCodeAt和cadePointAt获得字符的Unicode码，前者只能识别双字节（0000~ffff即4位16进制数），后者可以识别4字节，当然，如果字符是双字节的，2者的结果是一样的

String.fromCodePoint()

ES5 提供String.fromCharCode方法，用于从码点返回对应字符，但是这个方法不能识别 32 位的 UTF-16 字符（Unicode 编号大于0xFFFF）。

 

 对于4字节的需要String.fromCodePoint来获取字符，如

字符串的遍历器接口

for  ...of 比较一下

 

normalize()自行了解

 

includes(), startsWith(), endsWith()

includes是否包含某字符串

startsWith是否以某字符串开始

endsWith是否以某字符串介绍

repeat() 

返回一个新的字符串（原始字符串重复n次），参数是大于等于0的整数或对应的字符串，如果是小数，则向下取整。

 

padStart()，padEnd()

长度不够时字符填充（在开头或结尾），第一个参数是长度，第二个参数是填充的字符串。

matchAll()

matchAll方法返回一个正则表达式在当前字符串的所有匹配

模板字符串

`${}`

{}内部可以进行运算和执行函数

 

实例：模板编译

模板编译函数compile。

function compile(template){
  const evalExpr = /<%=(.+?)%>/g;
  const expr = /<%([\s\S]+?)%>/g;

  template = template
    .replace(evalExpr, '`); \n  echo( $1 ); \n  echo(`')
    .replace(expr, '`); \n $1 \n  echo(`');

  template = 'echo(`' + template + '`);';

  let script =
  `(function parse(data){
    let output = "";

    function echo(html){
      output += html;
    }

    ${ template }

    return output;
  })`;

  return script;
}

compile函数的用法如下。

let parse = eval(compile(template));
div.innerHTML = parse({ supplies: [ "broom", "mop", "cleaner" ] });
//   <ul>
//     <li>broom</li>
//     <li>mop</li>
//     <li>cleaner</li>
//   </ul>

标签模板

(后面学习)

String.raw()

String.raw方法可以作为处理模板字符串的基本方法，它会将所有变量替换，而且对斜杠进行转义，方便下一步作为字符串来使用。

String.raw方法也可以作为正常的函数使用。这时，它的第一个参数，应该是一个具有raw属性的对象，且raw属性的值应该是一个数组.

作为函数，String.raw的代码实现基本如下。

String.raw = function (strings, ...values) {
  let output = '';
  let index;
  for (index = 0; index < values.length; index++) {
    output += strings.raw[index] + values[index];
  }

  output += strings.raw[index]
  return output;
}

模板字符串的限制