es6 string template 字符串模板

字符串模板(template string)解決了拼html的痛苦,沒有字符串模板前,需要這麼寫

var myName = "itsme";
var html = "<input type=\"text\" name=\"myName\" value=\""+myName+"\"/>";
console.log(html);

大量的轉義字符、+號,很容易拼錯而且不容易排查。爲了解決這個問題,ES6推出字符串模板,字符串模板以 `` 引用,變量使用 ${variableName}表示,這下簡潔多了吧。

var myName = "itsme";
var html = `<input type="text" name="myName" value="${myName}"/>`;
console.log(html);

來點更復雜的,嵌套字符串模板,這種情況在三目運算符中經常出現,比如


var myName = "itsme";
var anotherName="yes,its me";
var html = `${myName==='itsme'?`hello,${anotherName}`:'notme'}`;
console.log(html); //hello,yes,its me

簡單來說,要想在${vari}中使用${vari},就要使用嵌入字符串模板。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章