在傳統的字串處理方案中，例如原生輸出、變數值傳遞等，ES5 的語法會顯得很冗雜，並且容易出錯。
在 ES6 中，對於字串的擴充套件增加了模板字串的語法，可以輕鬆解決上面兩個問題。
模板字串使用反引號（``）括起來，它可以當作普通的字串使用，也可以用來定義多行字串，同時支援在字串中使用 ${} 嵌入變數。
接下來我們通過字串原生輸出和字串變數值傳遞這兩種場景，看看模板字串的實現方式。
字串原生輸出
在傳統的字串輸出場景中，我們可能會使用加號（+）做拼接，但是拼接出來的字串會丟失掉程式碼縮排和換行符。
// 傳統字串方案
var str = 'Hello, my name is kingx, ' +
'I am working in Beijng.';
console.log(str); // Hello, my name is kingx, I am working in Beijng.
在上面的範例中，str 變數的第一行字串和第二行字串之間使用加號進行拼接，並且字串中有縮排和換行符，但是輸出的結果中它們都被忽略了。
而使用模板字串語法，會保留字串內部的空白、縮排和換行符。
let str2 = `Hello, my name is kingx,
I am working in Beijng.`;
console.log(str2);
// 以下是輸出結果
Hello, my name is kingx,
I am working in Beijng.
在上面的範例中，通過模板字串的語法輸出的字串包含了縮排和換行符。
字串變數值傳遞
字串變數值傳遞指的是在想要獲取的目的字串中，會包含一些變數，根據變數的不同可以再細分以下幾種場景：
模板字串中傳遞基本資料型別的變數
如果字串中包含了變數，在傳統的 ES5 解決方案中，我們會使用加號拼接變數值。
// 傳統解決方案
var name = 'kingx';
var address = 'Beijing';
var str = 'Hello, my name is ' + name + ', ' +
'I am working in ' + address + '.';
console.log(str); // Hello, my name is kingx, I am working in Beijng.
如果在一個複雜的語句中，通過變數拼接，會很容易出錯，尤其是遇到單引號和雙引號同時出現的場景。
而使用模板字串語法則不會存在上述問題，模板字串中不再使用加號進行拼接，可以直接嵌入變數，只需要將變數寫在 ${} 之中。如果變數未定義，則會丟擲異常。
// 模板字串方案
let name = 'kingx';
let address = 'Beijing';
let str = `Hello, my name is ${name},
I am working in ${address}.`;
console.log(str);
// 以下是輸出結果
Hello, my name is kingx,
I am working Beijng.
模板字串中傳遞表示式
事實上，在 ${} 之中不僅可以傳遞變數，還可以傳遞任意的 JavaScript 表示式，包括數學運算、屬性參照、函數呼叫。
// 數學運算
let x = 1,
y = 2;
console.log(`${x} + ${y * 2} = ${x + y * 2}`); // 1 + 4 = 5
// 屬性參照和數學運算
let obj = {x: 1, y: 2};
console.log(`${obj.x + obj.y}`); // 3
// 函數呼叫
function fn() {
return "Hello World";
}
console.log(`foo ${fn()} bar`); // foo Hello World bar
模板字串中傳遞複雜參照資料型別的變數
當傳遞的變數是一個多層巢狀的複雜參照資料型別值時，模板字串同樣可以支援巢狀解析，遇到表示式會解析成對應的值。
假如我們需要將一個陣列物件解析成一個table格式的html字串，用於以表格形式輸出陣列的內容，其程式碼如下所示：
const tmpl = function (addrs) {
return `
<table>
${addrs.map(addr => `
<tr><td>${addr.provice}</td></tr>
<tr><td>${addr.city}</td></tr>
`).join('')}
</table>
`;
};
const addrs = [{
provice: '湖北省',
city: '武漢市'
}, {
provice: '廣東省',
city: '廣州市'
}];
console.log(tmpl(addrs));
輸出的字串結果如下所示：
</table>
<tr><td>湖北省</td></tr>
<tr><td>武漢市</td></tr>
<tr><td>廣東省</td></tr>
<tr><td>廣州市</td></tr>
</table>