Javascript 保留此内容并保留jQuery上下文

我正在使用

bind（）

在jQuery函数中保留

这个
（它是我类的一个实例）：

if (!Function.prototype.bind) { 
    Function.prototype.bind = function(){ 
    var fn = this, args = Array.prototype.slice.call(arguments),
        object = args.shift(); 
    return function(){ 
        return fn.apply(object, 
             args.concat(Array.prototype.slice.call(arguments))); 
        }; 
    };
}

例如，问题是如果我有一个单击事件，并且我不能再使用
$（this）
访问元素，我应该不能

e、 g:

正如您将在JSFIDLE中看到的，我知道使用
e.data
，事实上，这就是我想要使用
bind（）
的原因，这样我就可以摆脱这种语法

我的问题是，有没有一种方法可以使用
bind（）
来保存
this
并访问当前jQuery对象的一个属性

在本例中，您可以使用来引用当前元素

View.prototype.sayHelloBind = function(){
    this.$el.find('#bind').on('click', (function(event){

        // This no longer works
        $(event.currentTarget).css('color', 'red');

        alert(this.message);
    }).bind(this));
}

演示：

jQuery提供了一个称为

演示：
1）使用（您的）原始
bind（）
缺点：上下文中没有
事件


2） 您可以创建自己的
bind（）
变体：
完整的JSFIDLE：

我在上下文中添加了
事件
，因为它通常很有用

缺点是我们必须参考
el
两次：

el.on('click', (func...).bind_elem(this, el));

我看不出有什么办法可以解决这个问题


3） 接吻原则？
如果用例不是特别复杂，可以使用更简单的东西：

View.prototype.sayHelloBind = function(){
    var el = this.$el.find('#bind');
    var that = this;
    el.on('click', function(event){
        event.preventDefault();
        $(this).css('border', '1px solid red')
        alert(that.message);
    });
}

事件处理程序中的
this
必须是默认值（即单击的元素），也可以是容器对象，不能两者都是

既然默认语义是人们最习惯的语义，为什么不：

View.prototype.sayHelloBind = function() {
    var self = this;          // copy of "this" to use inside the closure
    this.$el.find('#bind').on('click', function() {

        $(this).css('color', 'red');

        alert(self.message);  // use the closed variable
    });
}

这实际上比使用
.bind
更有效，而且还避免了填隙
.bind
必须创建并返回一个完整的新函数来关闭
this
及其参数，那么为什么不使用该语言自己的功能并自己关闭
this
呢

//if (!Function.prototype.bind_elem) {
  Function.prototype.bind_elem = function(){ 
    var fn = this, args = Array.prototype.slice.call(arguments);
    var that = args.shift(); // view
    var obj = args.shift(); // DOM object
    return function(event){ 
        var argggs = [event, obj].concat(args);
        return fn.apply(that, argggs); 
    }; 
  };
//}


var View = function(element, msg){
    this.$el = $(element);    
    this.message = msg;
}

View.prototype.sayHelloBind = function(){
    var el = this.$el.find('#bind');
    el.on('click', (function(event, elem){
        event.preventDefault();
        $(elem).css('border', '1px solid red')
        alert(this.message);
    }).bind_elem(this, el));
}

$(function(){
    var view = new View('#test', 'Hello World!');
    view.sayHelloBind();
});

el.on('click', (func...).bind_elem(this, el));

View.prototype.sayHelloBind = function(){
    var el = this.$el.find('#bind');
    var that = this;
    el.on('click', function(event){
        event.preventDefault();
        $(this).css('border', '1px solid red')
        alert(that.message);
    });
}

View.prototype.sayHelloBind = function() {
    var self = this;          // copy of "this" to use inside the closure
    this.$el.find('#bind').on('click', function() {

        $(this).css('color', 'red');

        alert(self.message);  // use the closed variable
    });
}