ES6深刻淺出-2 新版函數:3 三個點運算 & 新版字符串-2. 新版字符串

這是之前的字符串。。雙引號,單引號。毫無區別

有時候在字符串裏面寫一些標籤。

排版很差看 我就想回車一下。這樣寫雖然是好看。可是語法就報錯了。es5的字符串不支持換行。我只想是想讓它排版的好看一點。


js想的一個法子是在每一行加一些斜線用來轉義


那麼這樣的代碼有沒有問題呢?再寫一個同樣的字符串。而後在後面加上多個空格,這就不是在結尾的地方加了斜線
這裏最大的問題是,若是你後面有空格,你的人眼是看不出來的


這樣就會報語法錯誤。

想要找到後面有沒有空格要找好久,除非你在每個地方雙擊一下

這裏雙擊有空格

用加號的形式,可是每一行代碼都要用雙引號,
css

es6的語法糖,反引號。

每一行後面都是回車,沒有空格的
git

附贈功能,

把我是一個好人放在兩個p之間

用replace的方式

另一種方式。經過控制加號的排版,來達到總體排版
es6

把變量插到字符串裏面-字符串插值

2



加一個函數來處理。函數後面立刻接着這個新的字符串



能夠看到這個函數是三個參數。

這是第一個參數,

第一個參數就是三個字符串的數組,
第二個參數是第一個變量,
第二個參數是第二個變量。



把name改爲圓圓


也就是說在模板字符串前面加函數,可讓你又一次機會根據插入的變量的值來修改這個模板字符串。最終是否要展現啥。
本來你是要展現圓圓是一我的,如今輸出的就是圓圓是一個壞人,由於這個函數裏去作了一個判斷。github

這有什麼用?

若是你用React那麼就會用到一個很是註明的庫叫作 styled-component

https://github.com/styled-components/styled-components
咱們來看他的語法。styled.h1 這個h1就是一個函數。你一旦調用styled.h1那麼你後面就要給我一個多行字符串。
它會把裏面的css做爲內聯樣式寫到一個h1的標籤裏面。而後把h1標籤的字符串返回回來。
數組

結束

相關文章
相關標籤/搜索