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

属性的简写

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

方法的简写

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()

属性名表达式

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

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 }

对象的扩展运算符 …

打包

// 打包 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}

拆包

// 复制 浅拷贝 深拷贝 // 数组的浅拷贝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);