这与功能的强制性绑定

我只是浏览了jBox.js的代码,并且遇到了以下几行代码:

jQuery(document).on('keyup.jBox-' + this.id, function(ev) {
    (ev.keyCode == 37) && this.showImage('prev');
    (ev.keyCode == 39) && this.showImage('next');
}.bind(this));

看看这里的代码,这个家伙似乎强制性地绑定了this功能的价值,我对这个模式有几个问题。

  • 这是一种设计模式吗?

  • 作者试图通过将大多数方法与this绑定来实现什么?

  • 例如采用上面的代码片断,什么是笔者试图通过结合与功能来实现this 。 (我的猜测是绑定的功能类似于jQuerys $ .proxy,这里保持这个值在一个新的函数定义中)。


  • 在你展示的代码中,如果你删除了.bind(this)调用,那么keyup.jBox-处理程序中的this将被设置为任何一个DOM节点触发事件。 笔者虽然,显然希望this等于不管this是(可能是jBox实例吗?)在其中创建处理程序本身的地步。

    我不知道我是否会认为这是一种“设计模式”,它只是一种语言功能,它允许作者强制执行,而this正是他们想要的,无论函数本身是如何调用的。

    我的猜测是绑定功能类似于jQuerys $ .proxy在这里?

    是的,它非常相似。

    快速示例:

    function Person(name) {
        this.name = name;
        this.greet = function() {
            console.log('Hello, my name is ' + this.name);
        };
    };
    
    var tenali = new Person('Tenali');
    tenali.greet();
    // > Hello, my name is Tenali
    

    太棒了,这是有效的,因为作为作者,我希望你总是以<person-instance>.greet()访问它。 但是,如果有人违反了这个假设会发生什么:

    var jeremy = new Person('Jeremy');
    var greet = jeremy.greet;
    greet();
    // > Hello, my name is undefined
    

    显然不按预期运行,因为现在greet()被调用作为一个纯醇”功能,从完全分离jeremy作为上下文对象(其通常在JavaScript由推断.用于调用方法表示法)。

    现在,作为一个消费Person来说,您仍然可以强制thisjeremy再次使用.call().apply()

    var jeremy = new Person('Jeremy');
    var greet = jeremy.greet;
    greet.apply(jeremy);
    // > Hello, my name is Jeremy
    

    ...这是很好,但不完全优雅。 所以,为了让你更容易,我可以强迫this成为我想要的,如下所示:

    function Person(name) {
        this.name = name;
        this.greet = function() {
            console.log('Hello, my name is ' + this.name);
        }.bind(this);
    };
    

    现在,如果我们回到前面的例子,我们会看到它按预期工作,因为我已经将“ greet()函数“绑定”到Person实例了:

    var jeremy = new Person('Jeremy');
    var greet = jeremy.greet;
    greet();
    // > Hello, my name is Jeremy
    
    链接地址: http://www.djcxy.com/p/2879.html

    上一篇: compulsive binding of this with functions

    下一篇: Modify a function or evaluate a function from string