Template Literals

ECMAScript：6

ES6 中提供了 Template Literals 讓字串處理上更容易。

在使用上，透過 grave accent 的字元取代單、雙引號，另外也可以使用 ${...} 直接使用變數或函式。

範例

// ES5 時期的 HTML 字串串接方法
// 無法排版
let es5 = '<header>\n'+
'<div class="banner">\n'+
'<img>\n'+
'</div>\n'+
'</header>';

// 透過 Template Literals，indent 也可以保留
let es6 = `
<div>
    <ul>
        <li>1</li>
    </ul>
</div>
`;

// 傳入變數
let name = 'Johnson';
let sayHello = `Hello ${name}, 1 + 1 = ${1 + 1}`;