es6的解構賦值

2021-09-28 19:49:13 字數 2066 閱讀 5037

es6允許從陣列和物件中提取值,再對變數進行賦值,這被稱為解構。

let [a, b, c] = [1, 2, 3];

let [ , , third] = ["foo", "bar", "baz"];

third // "baz"

let [head, ...tail] = [1, 2, 3, 4];

head // 1

tail // [2, 3, 4]

let [x, y, ...z] = ['a'];

x // "a"

y // undefined

z //

let  = ;

foo // "aaa"

bar // "bbb"

let = ;

baz // undefined

let = math;

// 例二

const = console;

log('hello') // hello

let=;//等價於下面:

let = ;

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

let = ;

baz // "aaa"

foo // error: foo is not defined

foo是模式,baz是變數,真正被賦值的是變數baz,而不是模式foo。

物件的解構賦值的預設值:

var = {};

x // 3

var = ;

x // 1

y // 5

var = {};

y // 3

var = ;

y // 5

var = {};

msg // "something went wrong"

預設值生效的條件是,物件的屬性值嚴格等於undefined。

陣列的解構賦值的預設值:

let [foo = true] = ;

foo // true

let [x, y = 'b'] = ['a']; // x='a', y='b'

let [x, y = 'b'] = ['a', undefined]; // x='a', y='b'

函式的解構賦值的預設值:

function move( = {})

move(); // [3, 8]

move(); // [3, 0]

move({}); // [0, 0]

move(); // [0, 0]

function move( = )

move(); // [3, 8]

move(); // [3, undefined]

move({}); // [undefined, undefined]

move(); // [0, 0]

這倆的區別是:第乙個函式: = {}是為變數x和y指定預設值;

第二個: = 為函式move的引數指定預設值

function move( )

move(); // [0, 0]

vm5715:1 uncaught typeerror: cannot destructure property `x` of 'undefined' or 'null'.

at move (:1:15)

at :1:1

move({});

(2) [0, 0]

move();

(2) [3, 0]

move();

(2) [3, 8]

1)交換變數的值

let x = 1;

let y = 2;

[x, y] = [y, x];

2)從函式返回多個值,從中取值;

3)提取 json 資料

4)引數是一組無次序的值,函式引數的定義

5)函式引數的預設值

6)遍歷 map 結構

7)輸入模組的指定方法

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 現今的變數宣告語法十分的直接 左邊是乙個變數名,右邊可以是乙個陣列 的表示式或乙個物件 的表示式,等等。...