ES2018 新特徵之:非轉義序列的模板字符串

ES2018 新特性


這個 ECMAScript 提案 「Template Literal Revision」 由 Tim Disney 負責,目前已經進入 stage 4,本提案是 ECMAScript 2018(ES9) 的一部分。該提案讓咱們使用模板字符串的標籤函數語法更加的自由。html

1. 標籤函數 Tagged templates

標籤使您能夠用函數解析模板字符串。標籤函數的第一個參數包含一個字符串值的數組。其他的參數與表達式相關。最後,你的函數能夠返回處理好的的字符串(或者它能夠返回徹底不一樣的東西)。java

function foo(str) {
    return str[0].toUpperCase();
}

foo`justjavac`; // 輸出 JUSTJAVAC
foo`Xyz`; // 輸出 XYZ

2. String.raw()

String.raw() 是一個模板字符串的標籤函數,它的做用相似於 Python 中的字符串前綴 r 和 C# 中的字符串前綴 @,是用來獲取一個模板字符串的原始字面量值的。git

語法:github

String.raw(callSite, ...substitutions)
String.raw`templateString`

String.raw() 是惟一一個內置的模板字符串標籤函數。web

var str = String.raw`Hi\n${2+3}!`;
// "Hi\n5!"

str.length;
// 字符串長度爲 6

str.split('').join(',');
// 分隔字符串
// 結果是:"H,i,\,n,5,!"

3. 原始字符串

在標籤函數的第一個參數中,存在一個特殊的屬性 raw,咱們能夠經過它來訪問模板字符串的原始字符串,而不通過特殊字符的替換。正則表達式

function foo(str) {
    console.log(str);
    return str[0].toUpperCase();
}

foo`justjavac`;

// 控制檯輸出
["justjavac", raw: ["justjavac"]]

foo`just\\java\\c`;
// 控制檯輸出
["just\java\c", raw: ["just\\java\\c"]]

4. 帶標籤函數的轉義序列

自 ES2016 起,帶標籤的模版字面量遵照如下轉義序列的規則:api

  • Unicode字符以"u"開頭,例如 \u00A9
  • Unicode碼位用"u{}"表示,例如 \u{2F804}
  • 十六進制以"x"開頭,例如 \xA9
  • 八進制以""和數字開頭,例如 \251

對於每個 ECMAScript 語法,解析器都會去查找有效的轉義序列,對於無效的轉義序列,直接拋出 SyntaxError數組

String.raw`\`;
Uncaught SyntaxError: Unterminated template literal

5. ES2018 關於非法轉義序列的修訂

帶標籤函數的模版字符串應該容許嵌套支持常見轉義序列的語言(例如 DSLsLaTeX)。babel

所以 ECMAScript 2018 標準移除了對 ECMAScript 在帶標籤的模版字符串中轉義序列的語法限制。異步

function tag(strs) {
  strs[0] === undefined
  strs.raw[0] === "\\unicode and \\u{55}";
}

// 在標籤函數中使用
tag`\unicode and \u{55}`; // 結果是 undefined

// 不在標籤函數中使用
let bad = `bad escape sequence: \unicode`;
// throws early error:SyntaxError: Invalid Unicode escape sequence

6. 實現

7. 相關連接:

相關文章
相關標籤/搜索