1. 程式人生 > >解構賦值的用途

解構賦值的用途

數組賦值 總結 strong new for 解構賦值 first 取值 status

所謂解構賦值,就是允許按照一定模式,從對象和數組從提取值,對變量進行賦值,這就是解構賦值。
註意:這裏只能對數組和對象進行解構賦值。

//數組的解構賦值
let a,b,rest;
[a,b] = [1,2];
[a,b,...rest] = [1,2,3,4,5];
//對象的解構賦值

({a,b} = {a:1,b:2});
({a,b,...rest} = {a:1,b:2,c:3,d:4})

//註意:rest必須是解構賦值參數列表的最後一個參數
let [foo,[[bar],baz]] = [1,[[2],3]];
let [x,y=‘b‘] = [‘dd‘,undefined];
let [a,b,c] = new Set(["f","ff","fff"]);

對於數組進行解構賦值,只要某種數據解構具有Iterator接口,都可以采用數組形式進行解構賦值。
對於對象進行解構賦值,要註意書寫的形式。

//錯誤的寫法
var x;
{x} = {x:1};//error

這裏因為聲明了x變量,{x}放在開頭,會被JavaScript引擎解釋成代碼塊。
可以對解構賦值的語句加上圓括號。

({x} = {x:1});

不僅可以對數組和對象進行解構賦值,還可以對字符串、數值和布爾值、函數參數進行解構賦值。
對字符串進行解構賦值、

const [a,b,c] = ‘hel‘;

之所以能夠進行解構賦值,因為此時字符串被轉換成了一個類似數組的對象。

解構賦值的規則:
只要等號右邊的值不是對象,先將其轉化成對象,由於undefined和null無法轉化成對象,所以對它們進行解構賦值都會報錯。

解構賦值的用途:

  • 變換變量:交換兩個變量的值
  • 解析一個從函數返回的數組:有了解構賦值,函數可以返回多個值,但是現在有更多的靈活性。
  • 忽略某些返回值
  • 將剩余數組賦值給一個變量
  • 用正則表達式匹配提取值
  • 函數參數的定義
  • 提取JSON數據
    解構賦值對提取JSON對象中的數據尤其有用
var jsonData = {
    id:42,
    status: "ok",
    data:[74,444]
}
let {id,status,data:number} = jsonData;
console.log(id,status,number);
//42,ok,[74,444]
  • 遍歷Map結構
    任何部署了Iterator接口的對象,都可以用for...of循環遍歷,Map解構原生支持Iterator接口,配合變量的解構賦值,獲取鍵名和健值就非常方便。
var map = new Map();
map.set(‘first‘,‘hello‘);
map.set(‘second‘,‘world‘);
for (let [key,value] of map){
    console.log(key+"is"+value);
}
//first is hello
//second is world

//只想獲取鍵名
for(let [key] of map){
    //...
}

//獲取鍵值
for(let [,value] of map){
    //...
}
  • 輸入模塊的指定方法
    加載模塊時,往往需要指定輸入哪些方法,解構賦值使得輸入語句很清晰
const {SourceMapConsumer,SourceNode} = require("source-map")

總結:
從解構賦值的定義說到解析的規則,還有一些很好用的用途。以後有新的發現再來補充。

解構賦值的用途