Question

我有一个有方法的对象。此方法可以作为对象上的方法或作为回调函数触发。确定如何调用它的最佳方法是什么？我想出了一个我不确定可靠的解决方案。

function Object() {
    this.method = function(elem) {
        if (elem.type !== undefined) {
            alert("we've got an event");
        } else {
            alert("it doens's seem to be an event");
        }
    }
}
var obj = new Object();
$('span').click(obj.method);
obj.method($('div'));

我决定稍微编辑一下我的问题，指出问题不是关于'this'参数以及如何绑定函数的上下文。

Answer 1

我不确定为什么调用代码的重要性。我敢打赌，如果你能清楚地说明它为什么重要，你会看到有一个参数应该传递给函数，让函数知道这一点。然后你可以制作一个简单的包装器来做到这一点：

function MyObject() {
    this.method = function(randomParam1, randomParam2, calledThroughAlert) {
        // calledThroughAlert knows what you need to know.
    }
}

function callbackToMyObject() {
    obj.method('foo', 'bar', true);
}
var obj = new MyObject();
$('span').click(callbackToMyObject);
obj.method('bar', 'foo'); // defaults the calledThroughAlert param to false

Answer 2

如果它只是关于jQuery的东西（例如$ .click），你可以检查事件本身是否传递给函数：

var handleClick = function () {
    var $this = $(this); // obj

    if (arguments.length > 0 && arguments[0] instanceof jQuery.Event) {
        alert('called as callback');
    } else {
        alert('called directly');
    }
};

$('button').click(handleClick);
handleClick();

Answer 3

this内method的值将是Object实例（请参阅Rocket关于命名的注释），用于所有意图和目的（除非通过{{1}有意设置值}，bind()或call()）。

作为方法执行时，apply()的值将是this个实例（同样，除非通过Object，bind()或call()进行更改

apply()

您可以看到此工作here http://jsfiddle.net/5WzEA/。

Answer 4

如果他们做不同的事情你应该有两种不同的方法。

如果你真的有这个方法做同样的事情，不管它是否被调用作为方法或回调，您可以使用$.proxy，以便this始终是对象：

function Object() {
    this.method = $.proxy( function(){

    }, this );
}
var obj = new Object();

Answer 5

这很有效。非常接近你所拥有的。

function Object() {
    this.method = function(elem) {
        console.log(elem)
        if (elem.length != 0 && elem instanceof jQuery.Event) {
            alert("Accessed on Click");
        } else {
            alert("Not accessed on click.");
        }
    }
}
var obj = new Object();


$('span').click(obj.method);  // Accessed on click.


obj.method($('div')); // Not accesed on click.

http://jsfiddle.net/dietrichg/3mELA/

Answer 6

确定这是否是回调的最佳方法是将不同的函数注册为回调并明确传递一个值以表明它确实是一个回调

function Object() {
    this.method = function(elem, isCallback) {
        if (isCallback) { 

        }
    } 
}

var obj = new Object();
$('span').click(function (elem) { obj.method(elem, isCallback); });
obj.method($('div'));

Answer 7

如果要将函数绑定到上下文（对象），请使用以下内容：

function createOnClick(obj, fn) {
    return function() {
        return fn.apply(obj, arguments);
    }
}

myObject = new Object();

$('button').click(createOnClick(myObject, myObject.method));

现在，当你的方法被调用时，'this'将是对'myObject'实例的引用。这是众所周知的和功能绑定，并且有许多API已经这样做了。但是，我不熟悉JQuery，因此您需要参考文档。

Answer 8

我认为这个选项更好：我从方法中删除了检查，并始终期望传递元素。作为回调，我传递了带有'this'的函数，它将是对元素的引用并传递给我的方法：

$('span').click(function(){obj.method(this)};

如何识别函数是作为方法还是回调来调用

8 个答案: