ES6新特性四：變量的解構賦值實例

更新時間：2017年04月21日 09:22:50 作者：Dason_yu

這篇文章主要介紹了ES6新特性之變量的解構賦值操作,結合實例形式分析了ES6針對數(shù)組、對象等的解構賦值操作相關實現(xiàn)技巧,需要的朋友可以參考下

本文實例講述了ES6新特性之變量的解構賦值。分享給大家供大家參考，具體如下：

1. 數(shù)組的解構賦值

//① 可以從數(shù)組中提取值，按照對應位置，對變量賦值
var [a, b] = [1, 2]; //a = 1;b = 2
//② 下面是一些使用嵌套數(shù)組進行解構
var [d, [[c], f]] = [1, [[2], 3]];
var [,,third] = ["foo", "bar", "baz"];//third = "baz"
var [head, ...tail] = [1, 2, 3, 4];//head = 1;tail = [2, 3, 4]
//③不完全結構
var [x, y] = [1,2,6]; //x = 1;y = 2
//④ 解構賦值允許指定默認值
var [foo = true] = []; //foo = true
var [x, y='b'] = ['a'] // x='a', y='b'
var [x, y='b'] = ['a', undefined] // x='a', y='b'
//⑤ 解構不成功，變量的值就等于undefined
var [a6, a7] = [1]; //a7 = undefined

2. 對Set 的解構賦值

[a, b, c] = new Set(["a", "b", "c"])
console.log(a) // "a"

3. 對象的解構賦值

//對象的屬性沒有次序，變量必須與屬性同名，才能取到正確的值
var { x, y } = { x: "aaa", y: "bbb" };//x = aaa, y = bbbb
var { c } = { a: "aaa", b: "bbb" }; // c = undefined
//嚴格遵守變量名與屬性同名
var { d: e } = { d: "aaa", f: "bbb" }; //e = aaa
//指定默認值
var {x, y = 5} = {x: 1};// x = 1,y = 5

4. 用于遍歷 Map

var map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
//獲取鍵值對
for (let [key,value] of map) {
  console.log(key + " is " + value);
}
// 獲取鍵名
for (let [key] of map) {
  console.log(key);
}
// 獲取值
for (let [,value] of map) {
  console.log(value);
}

希望本文所述對大家ECMAScript程序設計有所幫助。

您可能感興趣的文章:

javascript保留兩位小數(shù)的實現(xiàn)方法你了解嗎
這篇文章主要為大家介紹了javascript保留兩位小數(shù)的實現(xiàn)方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助
2022-01-01
Javacript中自定義的map.js 的方法
以下map.js和map-util.js都是自定義的map，任選其一就可以。你可以用它來像java里new Map()和put()、remove()、get()等方法
2017-11-11
JS組件封裝之監(jiān)聽localStorage的變化
這篇文章主要介紹了JS組件封裝之監(jiān)聽localStorage的變化,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2022-09-09
js+html+css實現(xiàn)簡單電子時鐘
這篇文章主要為大家詳細介紹了js+html+css實現(xiàn)簡單電子時鐘，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-06-06
bootstrap的3級菜單樣式,支持母版頁保留打開狀態(tài)實現(xiàn)方法
下面小編就為大家?guī)硪黄猙ootstrap的3級菜單樣式,支持母版頁保留打開狀態(tài)實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-11-11
微信小程序中的behaviors
behaviors是用于組件間代碼共享的特性, 類似一些編程語言中的'mixin'或者'traits',這篇文章主要介紹了微信小程序中的behaviors,需要的朋友可以參考下
2024-08-08
JavaScript+canvas實現(xiàn)五子棋游戲
這篇文章主要為大家詳細介紹了JavaScript+canvas實現(xiàn)五子棋游戲，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-05-05
如何解決前端筆記本屏幕顯示縮放比例125%,150%對頁面布局的影響
如果要完整解決該縮放和布局問題,仍需適配,下面這篇文章主要給大家介紹了關于如何解決前端筆記本屏幕顯示縮放比例125%,150%對頁面布局的影響,需要的朋友可以參考下
2022-11-11
javascript動態(tài)加載三
首先是通過同步策略來實現(xiàn)模塊加載與回調函數(shù)之間進行分離，接著是通過異步策略來實現(xiàn)模塊加載與回調函數(shù)之間進行分離
2012-08-08
JS 實現(xiàn)導航菜單中的二級下拉菜單的幾種方式
這篇文章主要介紹了JS 實現(xiàn)導航菜單中的二級下拉菜單的幾種方式的相關資料,這里提供了三種方式，和實例代碼，需要的朋友可以參考下
2016-10-10