基本用法
在ES6之前,將字符串連接到一起的方法是+或者concat()方法,如
const student = {
name: 'Richard Kalehoff',
guardian: 'Mr. Kalehoff'
};
const teacher = {
name: 'Mrs. Wilson',
room: 'N231'
}
let message = student.name + ' please see ' + teacher.name + ' in ' + teacher.room + ' to pick up your report card.';
模板字面量用倒引號(hào) (``)(而不是單引號(hào) ( '' ) 或雙引號(hào)( "" ))表示官撼,可以包含用 ${expression} 表示的占位符
let message = `${student.name} please see ${teacher.name} in ${teacher.room} to pick up your report card.`;
多行字符串
在ES6之前旷痕,通常都依靠數(shù)組或字符串的拼接來創(chuàng)建多行字符串
var message = ["Multiline ","string"].join("\n");
let message = "Multiline \n" +"string";
ES6 的模板字面量使多行字符串更易創(chuàng)建,因?yàn)樗恍枰厥獾恼Z法辣苏,只需在想要的位置直接換行即可难咕,此處的換行會(huì)同步出現(xiàn)在結(jié)果中
let message = `Multiline
string`;
// "Multiline
// string"
console.log(message);
console.log(message.length); // 16
變量占位符
變量占位符由起始的 ${ 與結(jié)束的 } 來界定苇经,之間允許放入任意的 JS 表達(dá)式。最簡單的變量占位符允許將本地變量直接嵌入到結(jié)果字符串中座韵。
let name = "Nicholas",
message = `Hello, ${name}.`;
console.log(message); // "Hello, Nicholas."
占位符 ${name} 會(huì)訪問本地變量 name ,并將其值插入到 message 字符串中。 message變量會(huì)立即保留該占位符的結(jié)果
既然占位符是JS表達(dá)式誉碴,那么可替換的就不僅僅是簡單的變量名宦棺。可以輕易嵌入運(yùn)算符黔帕、函數(shù)調(diào)用等
let count = 10,
price = 0.25,
message = `${count} items cost ${(count * price).toFixed(2)}.`;
console.log(message); // "10 items cost $2.50."