首頁 > web前端 > js教程 > 主體

ES6的解構賦值實例詳解

php中世界最好的语言
發布: 2017-12-30 17:20:26
原創
1249 人瀏覽過

這次帶給大家的是ES6的解構賦值實例詳解,我們知道ES6是非常強大的,這篇文章就給大家好好分析一下。

基本用法

let [x, y, ...z] = ['a']
//"a", undefined, []
登入後複製

1.等號右邊如果不是陣列,將會報錯(不是可遍歷結構)
2.解構賦值var, let, const指令宣告皆適用
3.set結構也可解構賦值(具有Iterator介面,可採用陣列形式結構賦值)

set解構:任何型別的單一值的集合

let [x, y, z] = new Set(["a", "b", "c"])
x //"a"
登入後複製

預設值

1.陣列成員的值不嚴格等於undefined,預設值不生效(null的話對應值依然為null)

[x=1, y=2, z=3, o=4] = ['a', , undefined, null]
//"a", 2, 3, null、
登入後複製

#2.如果預設值是表達式,表達式惰性求值,只有在用到的時候才會去執行

3.預設值可以引用結構賦值的其他變量,但該變數必須已宣告

物件結構賦值

1.陣列依序排列,物件變數必須與屬性同名

var {bar, foo, baz: loc} = {foo: 'aaa', baz: 'bbb'}
bar //undefined
foo //"aaa"
loc //"bbb"
baz //ReferenceError: baz is not defined
登入後複製

2.變數以前宣告過,使用let賦值會報錯

3.可用於巢狀結構的物件

var node = {
  loc: {
    start: {
      line: 1,
      column: 5
    }
  }
}
var {loc:{start:{line}}} = node
line //1
loc //ReferenceError: loc is not defined
start //ReferenceError: start is not defined
登入後複製

line是變數,loc,start都是模式

相信看了以上介紹你已經掌握了方法,更多精彩請關注php中文網其它相關文章!

相關閱讀:

橫向不間斷滾動效果代碼

JS引擎運行時是什麼樣的

JS的使用過程中如何自訂console物件

#

以上是ES6的解構賦值實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!