这与功能的强制性绑定
我只是浏览了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
来说,您仍然可以强制this
是jeremy
再次使用.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