模板字符串

傳統(tǒng)的JavaScript語(yǔ)言，輸出模板通常是這樣的寫的。

1 $('#result').append( 2 'There are <b>' + basket.count + '</b> ' + 3 'items in your basket, ' + 4 '<em>' + basket.onSale + 5 '</em> are on sale!' 6 );

上面這種寫法相當(dāng)繁瑣不方便，ES6 引入了模板字符串解決這個(gè)問(wèn)題?！　?/p> 1 $('#result').append(` 2 There are <b>${basket.count}</b> items 3 in your basket, <em>${basket.onSale}</em> 4 are on sale! 5 `);

模板字符串（template string）是增強(qiáng)版的字符串，用反引號(hào)（`）標(biāo)識(shí)。它可以當(dāng)作普通字符串使用，也可以用來(lái)定義多行字符串，或者在字符串中嵌入變量

// 普通字符串 `In JavaScript '\n' is a line-feed.`// 多行字符串 `In JavaScript this isnot legal.`console.log(`string text line 1 string text line 2`);// 字符串中嵌入變量 let name = "Bob", time = "today"; `Hello ${name}, how are you ${time}?`

上面代碼中的模板字符串，都是用反引號(hào)表示。如果在模板字符串中需要使用反引號(hào)，則前面要用反斜杠轉(zhuǎn)義。　　

let greeting = `\`Yo\` World!`;

輸入結(jié)果：`Yo` World!

如果使用模板字符串表示多行字符串，所有的空格和縮進(jìn)都會(huì)被保留在輸出之中。

$('#list').html(` <ul><li>first</li><li>second</li> </ul> `);

　　

?

轉(zhuǎn)載于:https://www.cnblogs.com/crazymagic/p/9714177.html

總結(jié)

以上是生活随笔為你收集整理的02-模板字符串的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。