[译]JavaScript:ES6中的模板字符串简介

原文:http://tc39wiki.calculist.org/es6/template-strings/

---

ES6中的模板字符串(template string)是一种能在字符串文本中内嵌表达式的字符串字面量(string literal).这种操作在其他语言(比如shell->perl->php等)中通常称之为字符串内插(string interpolation)或者叫变量内插(Variable interpolation).模板字符串在早期的Harmony提案中称之为半字面量(Quasi Litaral),现已更名为模板字符串.

模板字符串使用反引号(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');

所有的字符包括空白符都会被包含在最后的字符串内.

译者注:相当于python中的三引号:

>>> """a
... b
... c"""
'a\nb\nc'

带标签的模板字符串

如果一个模板字符是由一个表达式开头的,则该模板字符串被称为带标签的模板字符串(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"

译者注:相当于python中的r:

>>> r'\n'
'\\n'

译者注:目前SpiderMonkey正在实现该特性:https://bugzilla.mozilla.org/show_bug.cgi?id=688857

你可以在这个js shell上体验一下简单的功能:http://js-quasis-libraries-and-repl.googlecode.com/svn/trunk/index.html

ESwiki上和ES6草案上有更详细的参考.