es6学习笔记2箭头函数、对象字面量、Proxy

1.箭头函数注意点：

  this指向问题，常规函数this指向其调用者，而箭头函数不指向其调用者，而是定义该函数当前作用域里面的this，，例如解决闭包时普通函数拿不到外层对象，可利用箭头函数的this指向拿到，解决了匿名函数的回调问题，利于封装。

2.对象字面量的增强

  1.以前对象里的属性是键值对的形式去定义，es6中关于对象里的键值对和方法可以简写

 method1实际上还是普通的function，this指向的是当前对象。

2.可以使用计算属性名进行属性定义

obj = {
a: '123',
b,
// method1: function(){...}
method1(){...}
[Math.random()]: 123
}

可在[]中使用任意表达式，表达式的执行结果将拿来做属性名。

3.proxy

以前通过Object.defineProperty来为对象添加属性，捕获到对象的读写过程，vue中的双向数据绑定也是基于此方法，es6中使用proxy来为对象设置访问代理器，可以理解为对象的“门卫”，你要进去拿东西放东西都要经过它，通过proxy则可轻松监控到对象的读写过程

const person = {
    name: 'cloudgaps',
    age: 18
}

// 定义presonProxy作为person的代理 get有两个参数
// target是代理的目标对象 property是外部访问目标对象的属性名 
// 外部如果访问代理身上的name属性，return则是外部访问得到的值
const presonProxy = new Proxy(person,{
    get(traget, property){
        console.log(traget, property);
        return '还是18'
    },
// target是被代理的目标对象，property和value是要写入的属性名称及值
    set(target, property, value){
        console.log(target, property, value);
    }
})
presonProxy.gender = '猛男'
console.log(presonProxy.name);

//打印结果

{ name: 'cloudgaps', age: 18 } gender 猛男
{ name: 'cloudgaps', age: 18 } name
还是18