1. 程式人生 > >ES6字串擴充套件(模板字串)

ES6字串擴充套件(模板字串)

es5中的多行字串和變數拼接:

let num = 10,
    price = 100;
let str = "我們現在有"+num+"個人\
           來買蘋果,一斤蘋果10元錢,\
           他們每人買一斤,那麼總價是"+price+"元。"
//let str = "我們現在有"+num+"個人來買蘋果,一斤蘋果10元錢,他們每人買一斤,那麼總價是"+price+"元。"

這裡我們可以不換行,那麼就不需要在每一個換行處加個反斜槓了。但是在實際開發中我們字串拼接往往很長,需要換行來清晰完整的觀看程式碼,這時我們就需要在每個換行處添加個反斜槓來實現多行字串拼接了。如上程式碼我們可以看出是通過兩個加號來拼接變數進去的,這時需要我們觀察清楚外層的引號是單引號還是雙引號。

為了解決這種麻煩的字串拼接,es6給我們提供了簡易的模板字串。

es5中的多行字串和變數拼接:

let num = 10,
    price = 100;
let str = `我們現在有${num}個人
	   來買蘋果,一斤蘋果10元錢,
           他們每人買一斤,那麼總價是${price}元。`

從上面的程式碼我們可以看出,只需要兩個反引號把多行字串包裹起來,如需傳入變數則在相應的地方使用${變數名}的方式傳入。