iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 16
0
自我挑戰組

從0開始vue.js的30天學習日誌系列 第 16

16 JavaScript ES6 - 字串模板

ES6字串模板可以幫助組合字串以及寫多行字串,使用反撇符號來代替'"

基本字串用法語ES5一樣:

//ES5
var name = "Henry";
//ES6
let name = `Henry`;

實務上用jQuery在組前端字串很常寫得落落長,不是要換行,不然就是用運算符+來讓他換行變比較好閱讀,而字串模板方便的地方就在他支援多行文字:

let str = `123
456789
876543
21
`

在字串加入變數的方式也與以往使用+來連接不同,ES6使用${}插入變數:


//ES5
var name = "ES5";
var greet = "Hi, my name is"+ name+", nice to meet you!"

//ES6
let name = "ES6"';
let greet = `Hi, my name is ${name}, nice to meet you!`

除了變數之外也可以使用表達式:

let myAge = 5;
let broAge = 8;
let str = `My brother is ${myAge > broAge? "younger" : "older"} than me`
//My brother is older than me

今天學習字串模板到這裡,明天開始箭頭函式/images/emoticon/emoticon28.gif


上一篇
15 JavaScript ES6 - 解構賦值
下一篇
17 JavaScript ES6 - 箭頭函式
系列文
從0開始vue.js的30天學習日誌30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言