ES6模板字面Vs的串联字符串

我有ECMAScript的6 qazxsw POI下面的代码

template literals

输出如下：

let person = {name: 'John Smith'};   
let tpl = `My name is ${person.name}.`;    
let MyVar="My name is "+ person.name+".";

console.log("template literal= "+tpl);  
console.log("my variable = "+MyVar);

template literal= My name is John Smith. my variable = My name is John Smith. 是小提琴。我试图寻找准确的区别，但无法找到它，我的问题是什么是这两个语句之间的区别，

this

和

  let tpl = `My name is ${person.name}.`;    

我已经能够得到与 let MyVar = "My name is "+ person.name+"."; 这里串联串MyVar，所以这将是使用模板文字的情景？

如果您使用的模板文字只有占位符（例如person.name）喜欢在问题的例子，那么结果是一样的只是连接字符串。主观上，它看起来更好，更容易阅读，尤其是对多行字符串或包含`Hello ${person.name}`和'串，因为你没有任何更多的逃生者角色。

可读性是一大特色，但有关模板的最有趣的事情是"：

Tagged template literals

在这个例子中的第三行，函数名为let person = {name: 'John Smith'}; let tag = (strArr, name) => strArr[0] + name.toUpperCase() + strArr[1]; tag `My name is ${person.name}!` // Output: My name is JOHN SMITH! 被调用。模板字符串的内容被分成多个变量，你可以在tag函数的参数访问：文字部分（在这个例子中tag的价值是strArr[0]和My name is的值是strArr[1]）和替换（!）。文字模板将进行评估，以无论John Smith函数返回。

所述tag列出了一些可能的使用情况下，如自动转义或编码输入，或定位。你可以创建一个标签功能名为ECMAScript wiki中查找文字部分像msg并代他们翻译成当前语言环境的语言，例如成德语：

My name is

通过标签函数的返回值甚至不必须是一个字符串。你可以创建一个标签功能名为console.log(msg`My name is ${person.name}.`) // Output: Mein Name ist John Smith. 它评估字符串，并使用它作为查询选择返回DOM节点的集合，就像这个$：

example