标准内置对象 Proxy 学习笔记

参考资料：MDN Proxy

概念 

创建一个对象的代理，从而实现基本操作的拦截和自定义（如属性查找、赋值、枚举、函数调用等）

参数

• target： 要使用 Proxy 包装的目标对象（可以是任何类型的对象，包括原生数组，函数，甚至另一个代理）。
• handler： 一个通常以函数作为属性的对象，各属性中的函数分别定义了在执行各种操作时代理 p 的行为

用法

const webDeveloper = { salary: 20, age: 18 }
const p = new Proxy(webDeveloper,{
    get: function(tar, prop){
        if( prop === 'salary' ){
            return '保密'
        }
    }
})
console.log(webDeveloper.salary) // 20
console.log(p.salary ) // 保密

方法 Proxy.revocable( target, handler)

1. 参数 ：与 new Proxy( ) 参数一致
2. 返回值： { Proxy, revoke }

// 创建一个可撤销的对象
const revocableObj = Proxy.revocable({ name:'一个对象' },{
    get: function(tar, prop){
        if( prop === 'name' ){
            return '一对象'
        }
    }  
}) 

console.log(revocableObj) // {proxy: Proxy, revoke: ƒ}

const p = revocableObj.proxy
console.log(p.name) // 一对象

// 撤销代理
revocableObj.revoke();

p.name // TypeError
p.name = '象？' // TypeError
delete p.name  // TypeError

handler 对象的方法

en ..... 13 个 为了方便记忆 ，那就先分一下类吧

alter（修改器） 和 visit（访问器） 是我个人总结的一种归类方式，alter表示会对源数据造成影响，visit则不会。 函数的分类也可以用这种方式，例如 vue 内部对数组方法的修改 ，那7个方法就是 属于 alter 方法，因为这些方法会改变原数组。

不熟悉 这些方法的 可以 复习一下了 developer.mozilla.org/zh-CN/docs/…