对象的简写

在定义对象的时候,如果属性名和变量名一致,那么可以实现简写

const name = "张三";
const age = 18;
const say = function () {}
 // es6新语法规定，如果对象的键和值是同一个名称，可以只指定一个
const obj = {
    name, 
    age, 
    say
}
console.log(obj);// { name:"张三",age:18,say:function(){} }

解构赋值

解构赋值语法是一种 Javascript 表达式。可以将数组中的值或对象的属性取出，赋值给其他变量。

默认值

每个解构属性都可以有一个默认值。当属性不存在或值为 undefined 时，将使用默认值。如果属性的值为 null，则不使用它。

const [a = 1] = [];
console.log(a); // 1
const { b = 2 } = { b: undefined }; 
console.log(b); // 2
const { c = 2 } = { c: null }; 
console.log(c); // null

数组的解构

获取数组中的元素

// 没用解构赋值
let arr = [1, 2, 3]
// const a = arr[0]
// const b = arr[1]
// const c = arr[2]
// 用解构赋值
// 语法： const [a,b,c] = 数组，可以提取前面三个值分别赋值给三个变量
// 数组结构的细节：数组解构需要使用[]
const [a, b, c] = arr
console.log(a, b, c);// 1,2,3

解构比原来更多的元素

在从赋值语句右侧指定的长度为 N 的数组解构的数组中，如果赋值语句左侧指定的变量数量大于 N，则只有前 N 个变量被赋值。其余变量的值将是undefined(未定义)。

const arr = ['one', 'two'];

const [a,b,c,d] = arr;
console.log(a); // "one"
console.log(b); // "two"
console.log(c); // undefined
console.log(d); //undefined

交换变量

可以在一个解构表达式中交换两个变量的值。

没有解构赋值的情况下，交换两个变量需要一个临时变量

//没用解构赋值
let num1 = 10,
    num2 = 20
console.log('之前：', num1, num2) //10, 20

// 定义一个中间变量
let temp
// 1.将其中一个变量的值存储到temp中，如num的值
temp = num1
// 2.将num2的值覆盖给num1
num1 = num2
// 3.将temp中存储的值覆盖给num2
num2 = temp
console.log('之后：', num1, num2) //20, 10

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

const arr = [1, 2, 3];
[arr[2], arr[1]] = [arr[1], arr[2]];
console.log(arr); // [1, 3, 2]

对象的解构

let obj = { name: 'jack', age: 20 }
// let name = obj.name,
//     age = obj.age

// 语法： let ｛属性名称｝ = 对象
// 对象解构的细节：需要使用{}
let { name, age } = obj
console.log(name, age) //jack 20

//深度解构
 let stu = {
  name: 'jack',
  age: 20,
  features: { height: '1.8m', weight: '60kg' }
}
// 深度解构 解构出一个成员之后，可以对这个成员再次进行解构
let { features:{ height } } = stu
let { height } = features
console.log(height) // 1.8m

如果解构时的属性名称和对象中的属性名称不一致，则会返回undefined

let { nmae, age } = obj
 console.log(nmae, age) //undefined 20