JS-解构赋值如何使用

解构赋值 是一种特殊的语法，它使我们可以将数组或对象“拆包”为到一系列变量中，因为有时候使用变量更加方便。

解构操作对那些具有很多参数和默认值等的函数也很奏效。

 let arr = [ "john", "lily" ]
 let [ first, second ] = arr
 console.log(first, second) // john   lily

let [ firstName, secondName ] = "Neal Caffiry".split(" ")
 console.log(firstName, secondName) // Neal   Caffiry

数组中不想要的元素也可以通过添加额外的逗号来把它丢弃

 let [, firstName, , secondName] = ["jack", "Neal", "lily", "Caffiry"]
 console.log(firstName, secondName) // Neal Caffiry

等号右侧可以是任何可迭代对象

 let [a, b, c] = "abc"; // ["a", "b", "c"]
 let [one, two, three] = new Set([1, 2, 3])

赋值给等号左侧的任何内容

 let user = {}; // 这里必须打分号
 [user.name, user.age] = "jack 20".split(" ")
 console.log(user) // {name: "jack", age: "20"}

如果不只是要获得第一个值，还要将后续的所有元素都收集起来，可以使用…解构运算符 来再加一个参数来接收“剩余的”元素：

 let [name1, name2, name3, ...rest] = ["jack", "lily", "lucy", "alice", "john", "neal"]
 console.log(name1, name2, name3) // jack lily lucy
 console.log(rest) // ["alice", "john", "neal"] //剩下的元素会组成一个新数组赋值给rest

如果赋值语句中，变量的数量多于数组中实际元素的数量，赋值不会报错。未赋值的变量被认为是 undefined：

 let [q, w, e] = ["jack"]
 console.log(w, e) // undefined undefined

可以设置默认值

 let [m = "lily", n = "john"] = ["jack"]
 console.log(m, n) // jack john

解构赋值同样适用于对象

let options = {
  title: "Menu",
  width: 100,
  height: 200
}

let { width, title, height } = options // 改变左边顺序也不会影响

console.log(title);  // Menu
console.log(width);  // 100
console.log(height); // 200

练习：

新建一个函数 topSalary(salaries)，返回收入最高的人的姓名。
如果 salaries 是空的，函数应该返回 null。
如果有多个收入最高的人，返回其中任意一个即可。

let salaries = {
  "John": 100,
  "Pete": 300,
  "Mary": 250,
  "jack": 300,
}
console.log(topSalary(salaries)) // jack

function topSalary(salaries) {
  return person = (JSON.stringify(salaries) === '{}') ? null : Object.entries(salaries).sort().pop()[0]
}