(精华)2020年7月3日 JavaScript高级篇 ES6(对象的扩展方法)

属性的简写

const a = 'a';
const obj = {a}
// const obj = {a:a}
console.log(obj);

  
 

  
1
  
2
  
3
  
4
 

方法的简写

const o = {
    say(){
        return '我是chris'
    }
}
console.log(o.say());
// 谁用我我就指向谁
var name = '全局'
const person = {
    name:'张三',
    say(){
        console.log(`我的名字是${this.name}`);
    }
}
person.say()
let res = person.say; // 全局
res()

  
 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
 

属性名表达式

let obj1 = {
    // 让属性和变量挂钩
    [key]:true,
    ['o'+'b']:123,
    [`ok`]:456
}

console.log(obj1);

  
 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
 

super 关键字

const proto = {
    foo:'土豆'
}

const oProto = {
    foo:'西红柿',
    find(){
        return super.foo
    }
}

// proto 是 oProto的原型
Object.setPrototypeOf(oProto,proto) // __proto__
console.log(oProto.find()); // 

const oProto = {
    foo:super.foo
}

  
 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
 

对象的扩展运算符 …

打包

// 打包
let {x,y:y,...z} = {x:1,y:2,a:3,b:4}
console.log(z);
//等号的右边必须是一个对象 
let {...h} = undefined
let {...v} = null
//数组的解构赋值 ... 有一个注意点 是...的位置
let {...z,x,y} = {x:1,y:2,a:3,b:4}

  
 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
 

拆包

// 复制 浅拷贝 深拷贝
// 数组的浅拷贝es5 用到的是什么  concat
// 对象的扩展运算符 ...也是浅拷贝 
// 复制 
let obj = {a:1}
let obj1 = obj;
obj1.a = 2;
console.log(obj);
// 浅拷贝
let obj2 = {...obj}
obj2.a = 2;
console.log(obj);
// es5 实现浅拷贝 类比concat 
let person = {name:'张三',age:12}
let person2 = Object.assign({},person)
person2.name = '王五'
console.log(person);

let {a,b,...z} = {c:1,b:2,a:3,d:4}
console.log(z);
// 不是深拷贝
let obj = {a:{b:1}}
let obj1 = {...obj}
obj1.a.b =2;
console.log(obj);

  
 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
 

文章来源: codeboy.blog.csdn.net，作者：愚公搬代码，版权归原作者所有，如需转载，请联系作者。

原文链接：codeboy.blog.csdn.net/article/details/107115704