javascript的字符串模板

在其他语言存在字符串内插(string interpolation)或者叫变量内插(Variable interpolation).ES6中的称为template string。

模板字符串使用反引号(backtick或者叫backquote)来代替普通字符串中的双引号(double quote)或单引号(single quote).模板字符串可以包含有占位符(placeholder),占位符使用${ }这样的语法.占位符中表达式的值以及占位符两边的文本会一起传递给一个标签函数(Tag function).这个函数是由模板字符串开头(左边的反引号之前)的一个可选的表达式决定的.如果模板字符串开头没有任何表达式,则会使用默认的标签函数.

默认模板字符串

如果不指定标签函数,则会使用默认的标签函数,该函数的行为是将模板字符串的每个部分按顺序连接成一个字符串并返回.

var x = 1;
var y = 2;
`${ x } + ${ y } = ${ x + y}`  // "1 + 2 = 3"

多行字符串

可以使用模板字符串产生多行字符串:

var s = `a
    b
    c`;
assert(s === 'a\n    b\n    c');
所有的字符包括空白符都会被包含在最后的字符串内.

带标签的模板字符串

如果一个模板字符是由一个表达式开头的,则该模板字符串被称为带标签的模板字符串(tagged template string).开头的这个表达式就是标签函数,解析后的模板字符串会作为参数传入标签函数.

function tag(strings, ...values) {

assert(strings[0] === 'a');

assert(strings[1] === 'b');

assert(values[0] === 0);

return 'whatever';

}

tag a${ 42 }b // "whatever"

原始字符串

解析后的模板字符串中还包含了对应字符串的原始形式(未转义之前的字符串).例如,字符串\n的原始形式包含了两个字符\和n,而不是单个的换行符.

标签字符串可以通过读取第一个参数的raw属性来获取到一个模板字符串的原始字符串形式.

function r(strings, ...values) {
  assert(strings.raw[0] === '\\n');
}

r `\n`
ES6提供了一个新的函数String.raw,该函数返回的就是原生字符串.

String.raw `a\n${ 42 }b`  // "a\\n42b"