ES6新增字串模板和解構賦值

2021-10-23 01:43:19 字數 2389 閱讀 5404

當我們需要拼接字串時,往往會遇到一些不便,比如變數太多,+用的太多導致自己都看不清哪些內容,**長還不清晰,換行需要加轉義字元等等。

舊語法:

var name =

"張三"

;var year =

"1995"

;var month =

"6";

console.

log(name+

'是'+year+

"年"+month+

'月份\n出生的'

)

es6的字串模板:

var name =

"張三"

;var year =

"1995"

;var month =

"6";

console.

log(`$

是$年$

月份 出生的`

)

字串模板語法

`

$字串`

console.

log(`$

\n出去`);

\\變數名也是一種表示式

在字串模板中,字串可以直接換行,可以使用轉義字元,字串模板可以巢狀使用。

解構賦值是一種結構化賦值,主要用途是為了簡化書寫的長度,提公升效率。

解構賦值表示式的值與表示式右側(也就是=右側)的值相等,如此一來,在任何可以使用值的地方都可以使用解構賦值表示式

物件的解構賦值:

//例:

let obj =

//方法一:

let name,age;

(= obj)

; console.

log(name,age)

//jack 18

//方法二:

let= obj;

console.

log(name,age)

;//jack 18

//方法三:

let= obj;

console.

log(oname,oage,o***)

//jack 18 nan

陣列的解構賦值:

例:

let arr =[1

,2,3

,4,10

];//方法一:

let[a,b,c,d]

= arr;

console.

log(a,b,c,d)

//1 2 3 4

//方法二:

let= arr;

//獲取arr陣列的長度

console.

log(length)

//5

當陣列中包含物件時:

let arr =[1

,2,3

,];let

}= arr;

console.

log(a,b,c,oname)

//1 2 3 "jack"

使用解構賦值表示式時,如果指定的區域性變數名稱在物件中不存在,那麼這個區域性變數會被賦值為undefined

let node =

;let

= node;

console.

log(type)

;// "identifier"

console.

log(name)

;// "foo"

console.

log(value)

;// undefined

這段**額外定義了乙個區域性變數value,然後嘗試為它賦值,然而在node物件上,沒有對應名稱的屬性值,所以像預期中的那樣將它賦值為undefined

當指定的屬性不存在時,可以隨意定義乙個預設值,在屬性名稱後新增乙個等號(=)和相應的預設值即可

let node =

;let

= node;

console.

log(type)

;// "identifier"

console.

log(name)

;// "foo"

console.

log(value)

;// true

在此示例中,為變數value設定了預設值true,只有當node上沒有該屬性或者該屬性值為undefined時該值才生效。此處沒有node.value屬性,因為value使用了預設的預設值

ES6新增 解構賦值

解構 分解資料結構 賦值 為變數賦值 es6中允許從陣列中提取值,按照對應位置,對變數賦值。物件也可以實現解構。陣列解構允許我們按照一一對應的關係從陣列中提取值然後將值賦值給變數 let arr 1 2,3 let a,b,c arr console.log a 輸出1 console.log b ...

ES6新增特性 解構賦值

es6按照一定模式,從陣列和物件中提取值,對變數進行賦值,稱作解構賦值。按照下面的形式進行解構賦值。let a,b,c 1,2,3 console.log a 1 console.log b 2 console.log c 3若解構不成功,變數的值為undefined。let foo console...

ES6學習總結之解構賦值及字串模板

1.將右邊資料匯入左邊,相當於給左邊資料起的別名 例1 let a,b,c 12,5,6 console.log a,b,c 12,5,6 注意 左右兩邊,解構格式保持一致 let a,b,c 12,5,6 2.解構json 例2 let json let json console.log name...