ES6 變數的結構賦值用途(實用技巧)

2022-07-21 04:36:11 字數 1423 閱讀 2719

1.交換變數的值

let x=1;

let y=2;

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

x=2,y=1

2.從函式返回多個值

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

//

返回陣列

function

example()

let [a,b,c]=example();//

a=1,b=2,c=3;

//返回物件

function

ex()

}let =ex();//

a=1,b=2

3.函式引數的定義

解構賦值對提取json物件中的資料,尤其有用。

//

引數是有序的

function

f()f()

//無序引數

f()

4.提取json資料

解構賦值對提取json物件中的資料,及其有用

let obj=

let = obj;//

id=111,name="aaa"

5.函式引數的預設值

function fn(=);

fn();

//[1,2]

指定引數的預設值,當不傳入引數時,實參有值

6.遍歷map結構

任何部署了 iterator 介面的物件,都可以用for...of迴圈遍歷。map 結構原生支援 iterator 介面,配合變數的解構賦值,獲取鍵名和鍵值就非常方便

const map = new

map();

map.set('first', 'hello');

map.set('second', 'world');

for(let [key, value] of map)

//first is hello

//second is world

如果只想獲取鍵名,或者只想獲取鍵值,可以寫成下面這樣。

//

獲取鍵名

for(let [key] of map)

//獲取鍵值

for(let [,value] of map)

7.輸入模組的指定方法

載入模組時,往往需要指定輸入哪些方法。解構賦值使得輸入語句非常清晰。

//

commonjs模組化

const = require("source-map");

//nodejs

import from "antd";//

react 引入ant design

ES6 變數的解構賦值的用途

變數的解構賦值用途很多。1 交換變數的值 let x 1 let y 2 x,y y,x 上面 交換變數x和y的值,這樣的寫法不僅簡潔,而且易讀,語義非常清晰。2 從函式返回多個值 函式只能返回乙個值,如果要返回多個值,只能將它們放在陣列或物件裡返回。有了解構賦值,取出這些值就非常方便。返回乙個陣列...

ES6 變數的結構賦值

基本概念 陣列的結構賦值 物件的結構賦值 基本型別的結構賦值 示例一 陣列的結構賦值let a,b,c 1,2,3 console.log a,b,c 輸出 1 2 3let a b c 1 2 3 console.log 1 2,3 let a console.log a 輸出undefined示...

ES6解構賦值的用途

參考文件 1.交換變數的值 let x 1 let y 2 x,y y,x 2.從函式返回多個值 函式只能返回乙個值,如果要返回多個值,只能將它們放在陣列或物件裡返回。有了解構賦值,取出這些值就非常方便。返回乙個陣列 function example let arr a,b,c example ar...