1. 程式人生 > 程式設計 >Javascript 解構賦值詳情

Javascript 解構賦值詳情

目錄
  • 1、陣列解構
  • 2、物件解構
  • 3、不完全解構
  • 4、用解構賦值實現變數交換

Javascript 解構賦值詳情

1、陣列解構

let [a,b,c] = [1,2,3]
console.log(a,c) // 1 2 3


除了陣列,任何可迭代的物件都支援被解構, 例如字串

let [first,second] = "he"

console.log(first,second) // h e

2、物件解構

賦值右側是物件,左側是包含在花括號內逗號隔開的變數名

let {a,c} = {a:1,b:2,c:3}
console.log(a,c) // 1 2 3


左側的變數名需要和物件中的屬性名相同,如果對應不上的話,左側的變數名將被賦值為undefined

。例如:

let {a,d} = {a:1,d) // 1 2 undefined


如果變數名與屬性名不一樣,可以用冒號分隔符將屬性名賦值給變數名

例如:

let mAbdMIr{a,c:d} = {a:1,d) // 1 2 3


3、不完全解構

解構賦值左側變數個數可以不等於右側陣列中元素的個數

(1)左側多餘的變數會被設定為undefined,

let [a,2]

console.log(a,c) // 1 2 undefined

(2)右側多餘的值將被直接忽略

let [a,3,4]

console.log(a,c)  // 1 2 3


(3)左側可以用逗號跳過某些值

let [a,4]http://www.cppcns.com

console.log(a,c)  // 1 3


(4)右側多餘的值可以通過...收集到一個變數中

let [a,...c] = [1,c)  // 1 2 [3,4]


4、用解構賦值實現變數交換

let a = 1,b=2;
[a,b] = [b,a]
console.log(a) //2
console.log(b) //1

到此這篇關於 解構賦值詳情的文章就介紹到這了,更多相關script 解構賦值內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!