ES6中Proxy的用法（理论+实践）

Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。Proxy 这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代理器”。下面是官方文档对proxy的一个定义。

let p = new Proxy(target, handler);

target ：需要使用Proxy包装的目标对象（可以是任何类型的对象，包括原生数组，函数，甚至另一个代理）。
handler: 一个对象，其属性是当执行一个操作时定义代理的行为的函数(可以理解为某种触发器)。具体的handler相关函数请查阅官网

下面展示一个实例

let obj = {
name: 111,
};
var objtest = new Proxy(obj, {
get(target, property) {
return target[property];

    }
});
console.log(objtest.name);

通过这个列子，简单介绍下Proxy，首先定义一个obj，然后通过Prxoy对其进行代理，之后新定义的Proxy就具有obj的属性信息。之后Proxy里面有get、set、delete等方法。可以在里面对属性信息进行一个过滤、筛选。
注意：（1）.(2) 点后面的东西就是property。

//dom
        let DOM = new Proxy({}, {
            get(target, prperty) {
                return function(arr = {}, ...childrens) {
                    let el = document.createElement(prperty);
                    for (let key of Object.keys(arr)) {
                        el.setAttribute(key, arr[key]);


                    }
                    for (let child of childrens) {

                        if (typeof child == "string") {
                            child = document.createTextNode(child);
                        }
                        el.appendChild(child);
                    }
                    return el;
                }
            }
        });
        var dom1 = DOM.div({
            id: "div",
            class: "divclass"
        }, "你好1", "你好2")
        window.onload = function() {
            document.body.appendChild(dom1);
        }

这个例子稍微复杂些，他的复杂不是在于Proxy，而是你对js基础知识的理解和应用，自己可以尝试分析下。

最近突然补充一下，在实际项目中要做一个日志管理，就是用户对哪个函数进行具体的操作，其实可以用到Proxy，下面是一个简单的例子：

   let api = {
            _apiKey: '123abc456def',
            getUsers: function() { /* ... */ },
            getUser: function(userId) { /* ... */ },
            setUser: function(userId, config) { /* ... */ }
        };

        function logMethodAsync(timestamp, method) {
            setTimeout(function() {
                console.log(`${timestamp} - Logging ${method} request asynchronously.`);
            }, 0)
        }
        api = new Proxy(api, {
            get: function(target, key, proxy) {
                var value = target[key];
                return function(...arguments) {
                    logMethodAsync(new Date(), key);
                    return Reflect.apply(value, target, arguments);
                };
            }
        });
        console.log(api.getUsers());