ES6 解构赋值

es6对象解构

1.普通使用解构赋值

let obj = {
    name: "fct",
    age: 21
}
// 普通使用解构赋值
var { name, age, hobby } = obj;
console.log(name, age, hobby); //fct 21 undefined

2.对解构赋值重命名

let obj = {
    name: "fct",
    age: 21,
    school: null
}
// 2. 当需要对解构赋值重命名时,新的名字是是后面的
var { name: name1, age, hobby } = obj;
console.log(name1, age, hobby); //fct 21 undefined

3.解构差异

let obj = {
    name: "fct",
    age: 21,
    school: null
}
// 2. 对象更改解构赋值顺序,不会影响值
var { name, hobby, age } = obj;
console.log(name, age, hobby); //fct 21 undefined

// 3.数组解构赋值更改顺序,会影响值
let obj = {
    name: "fct",
    age: 21,
    school: null
}
let arr = [1, 2, 3];
var [a, b, c] = arr;
console.log(a, b, c);   //1 2 3
var [a, c, b] = arr;
console.log(a, b, c);   //1 3 2 

4.解构差异

let obj = {
    name: "fct",
    age: 21,
    school: null
}
// 4.对象解构的默认值
// 默认值想生效,与之对应的属性值一定得是 undefined
var { name: name1, age, hobby = "打游戏", school = "xx大学" } = obj;
console.log(name1, age, hobby, school); //fct 21 打游戏 null

5.检验

// 例题 1:
var { x: y = 5 } = {};
// 要输出 5 ,那么该输出 x,还是 y?
console.log(y); //5

// 例题 2:
var { x: y = 5 } = { x: 3 };
// 输出 y 的值是?
console.log(y); // 3
posted @ 2021-09-05 18:53  青柠i  阅读(66)  评论(0编辑  收藏  举报