ES6資料的解構賦值使用及應用

2021-10-05 06:45:24 字數 3064 閱讀 8936

es6 允許按照一定模式,從陣列和物件中提取值,對變數進行賦值,這被稱為解構(destructuring)

例如:let x=1,y=2;[x,y] = [y,x]

函式只能返回乙個值,如果要返回多個值,只能將它們放在陣列或物件裡返回。有了解構賦值,取出這些值就非常方便

解構賦值可以方便地將一組引數與變數名對應起來

例如aa.axios.get(res=>=res;}),則res.data.result = result了

指定引數的預設值,就避免了在函式體內部再寫var foo = config.foo || 『default foo』;這樣的語句

map 結構原生支援 iterator 介面,配合變數的解構賦值,獲取鍵名和鍵值就非常方便

左右兩側資料解構須得吻合,或者等號左邊的模式,只匹配一部分的等號右邊的陣列(屬於不完全解構)

物件的解構賦值的內部機制,是先找到同名屬性,然後再賦給對應的變數。真正被賦值的是後者,而不是前者

let xx; // = 這樣會報錯,

({} = [true, false]);//可執行

objfuc()

= console.

log(a,b)

//1 undefined

// 已有物件解構賦值

let= math;

//將math物件的對數、正弦、余弦三個方法,賦值到對應的變數上

console.

log(sin)

;//log()

const

= console;

log(

'hello'

)// hello

// let=;

console.

log(baz)

;//aaa

// 巢狀賦值

let obj =]}

;let]}

= obj;

console.

log(x,y,p)

//hello world p: ['hello',]

//繼承賦值

const obj1 =

;const obj2 =

; object.

setprototypeof

(obj1, obj2)

;//obj1繼承obj2

const

= obj1;

console.

log(foo)

// "bar"

// 預設值

// 錯誤的寫法

let xx;

// = ;// syntaxerror: syntax error,uncaught syntaxerror: unexpected token '='(=

);//正確寫法

console.

log(xx)

// 古怪的,等式左邊可為空

// ({} = [true, false]);

// 物件可解構陣列

let arr =[1

,2,3

];let= arr;

console.

log(first,last)

//1 3

},

strfuc()

=this

.str;

console.

log(length)

//7}

,

let

=123

;console.

log(s === number.prototype.tostring,s)

//true ƒ tostring()

let=

true

;console.

log(ss === boolean.prototype.tostring,ss)

// true ƒ tostring()

// 右側必須是陣列或物件,undefined和null無法轉為物件,所以對它們進行解構賦值,都會報錯

// let = undefined; // typeerror

// let = null; // typeerror

// 函式的解構賦值可使用預設值,注意預設值是指實參的預設值而不是形參的預設值

function

move(=

)function

move1(=

)function

move2(=

) console.

log(

move()

);// [3, 8]

console.

log(

move()

);// [3, 1]

console.

log(

move()

);// [1, 1]

console.

log(

move()

);// [1,1]

console.

log(

move1()

);// [3, 8]

console.

log(

move1()

);// [3, 1]

console.

log(

move1()

);// [undefined, 1]

console.

log(

move1()

);// [0,0]

console.

log(

move2()

);// [3, 8]

console.

log(

move2()

);// [3, 1]

console.

log(

move2()

);// [undefined, 1]

console.

log(

move2()

);// [0,0]

不管是哪一類的解構賦值,等式右邊的資料必須是物件形式(陣列也是一種物件形式)

ES6 解構賦值

陣列的解構賦值 let a,b 12,13 let a,b,c d 13,15,16 let a,b c 78,12 23 let x,y 1,3,5 x 1,y 3 let x,y,z a x a,y undefined z let h,b 1,2,3,4 1,2,3,4 預設值 let x tr...

ES6解構賦值

一 基本用法 解構 destructuring 按照一定的模式,從陣列或者物件中提取值,對變數進行賦值。let par1,par2,par3 1,2 console.log par1,par2,par3 1 2 不完全解構時par3對值為undefined 解構賦值允許指定變數對預設值。let pa...

es6解構賦值

coding changes the world accumulating makes yourself 主要從三個方面講述 陣列式的解構賦值 物件式的解構賦值 函式中的解構賦值 preface 現今的變數宣告語法十分的直接 左邊是乙個變數名,右邊可以是乙個陣列 的表示式或乙個物件 的表示式,等等。...