模板字符串(template strings)
ES6 中引進(jìn)的一種新型的字符串字面量語法 - 模板字符串。書面上來解釋，模板字符串是一種能在字符串文本中內(nèi)嵌表示式的字符串字面量。簡(jiǎn)單來講，就是增加了變量功能的字符串。
ES6為我們提供了模板字符串，語法使用反引號(hào)`。模板字符串具有以下三個(gè)優(yōu)點(diǎn)：
多行文本 字符串中插入變量 字符串中插入表達(dá)式基本語法
模板字符串和 ES5的字符串的聲明一樣。
// ES5var name = 'xixi';console.log(name);// xixi// ES6let name4ES6 = `一步`;console.log(name4ES6);// 一步
多行文本
在Jquery 盛行的年代，我們經(jīng)常會(huì)拼接 html 片段再進(jìn)行節(jié)點(diǎn)替換。寫一段 ES5的代碼大家體會(huì)一下：
var str = '<html>'+ '<div>啦拉拉</div>'+ '<div>xixixi</div>'+ '</html>';console.log(str);// <html><div>啦拉拉</div><div>xixixi</div></html>
ES6支持多行文本，上面的代碼實(shí)現(xiàn)起來就容易多了。
let str4ES6 = `<html> <div>啦拉拉</div> <div>xixixix</div></html>`;console.log(str4ES6);
可以插入變量或表達(dá)式
// ES5var name = 'xixi';var age = 27;var info = 'my name is ' + name + ' , age is ' + age + '.';console.log(info);// my name is xixi , age is 27.
ES6的模板字符串實(shí)現(xiàn)起來就容易好多。關(guān)鍵語法${}，其中可以插入任何的 js 表達(dá)式。
let name = 'xixi';let age = 27;let info = `my name is ${name}, my age is ${age}. just a test ${1 + 10}!`;console.log(info);// my name is xixi, my age is 27. just a test 11!總結(jié)
ES6模板字符串就是這么的簡(jiǎn)單這么的好用。
好了，以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，如果有疑問大家可以留言交流，謝謝大家對(duì)錯(cuò)新站長(zhǎng)站的支持。
新聞熱點(diǎn)
疑難解答
圖片精選
