Blog

Blog

PHODAL

JavaScript 元编程之ES6 Proxy

在计划着写一个NLP程序的时候,发现Firefox上有一个方法叫__noSuchMethod__,看上去就是元编程的味道,接着继续往下搜索的时候发现,利用ES6的Proxy可以实现元编程。

而这个方法已经在Firefox内置了,Firefox上也可以使用Proxy,但是在现在的这个版本的Chrome中,因为安全原因将Proxy去掉了,这似乎意味着,我暂时用不了元编程这一特性。blabla,先做个简单的笔记吧,留着以后用。

注: 这个在《You Don't Know JS: ES6 & Beyond》中的第七章也提到过。现在的中文版,只出到第6章,还没有这一章。先让我们简单地来过一下吧。。

JavaScript Proxy

Proxy对象被用于定义自定义基本操作的行为(如属性查找、分配、枚举、函数调用等),在Firefox的定义中有一共有14个属性。

让我们来看一个基本的示例,当属性的名字不在列表的时候,返回37.

var handler = {
    get: function(target, name){
        return name in target?
            target[name] :
            37;
    }
};

直接用官方给的示例

var p = new Proxy({}, handler);
p.a = 1;
p.b = undefined;

console.log(p.a, p.b); // 1, undefined
console.log('c' in p, p.c); // false, 37

所以相对于nosuchmethod,这个就是我需要的nosuchvariable,而这种代理模式,和IOC有点像,让我们稍后试试IOC是否能解决我当前的问题吧。。。

JavaScript元编程之Proxy实现

接着看到了一个Pipe的示例: Meta-programming JavaScript Using Proxies

var pipe = (function () {

    var pipe;

    return function (value) {
        pipe = [];
        return Object.create(Proxy.create({
            get: function (pipeObject, fnName) {
                if (fnName == "get")
                    return pipe.reduce(function (val, fn) { return fn(val); }, value);

                pipe.push(window[fnName]);
                return pipeObject;
            }
        }));
    }
}());

var double        = function (n) { return n*2 },  
    pow           = function (n) { return n*n },
    reverseInt    = function (n) { return n.toString().split('').reverse().join('')|0 };


var pipedExample = pipe(3) . double . pow . reverseInt . get  
console.log(pipedExample); //63

看上去,这个比上面那个更加完美了。

关于我

Github: @phodal     微博:@phodal     知乎:@phodal    

微信公众号(Phodal)

围观我的Github Idea墙, 也许,你会遇到心仪的项目

QQ技术交流群: 321689806
comment

Feeds

RSS / Atom

最近文章

关于作者

Phodal Huang

Engineer, Consultant, Writer, Designer

ThoughtWorks 技术专家

工程师 / 咨询师 / 作家 / 设计学徒

开源深度爱好者

出版有《前端架构:从入门到微前端》、《自己动手设计物联网》、《全栈应用开发:精益实践》

联系我: h@phodal.com

微信公众号: 最新技术分享

标签