在jQuery中调用对象作为回调，无法正常工作

我想了解一些关于调用对象，但我错过了一些东西。下面我写了虚拟代码（这有效），所以我可以说明我的问题。这是一些代码。在jQuery中调用对象作为回调，无法正常工作

HTML：

<button id="test">tst</button>

JS：

var testObj = { 
    text: function(){ 
     console.log("is it working???"); 
    } 
} 

//on button click 
$('#test').click(function(){ 
    console.log(testObj.text()); 
});

现在，有了这个，当我点击该按钮，它工作正常，并在控制台上显示 “是它的工作” 因为它应该至。

，当我做同样的事情，但请从对象调用括号的测试，只是把它当作

$('#test').click(function(){ 
    console.log(testObj.text); 
});

控制台期待它显示我作为一个对象。 Google Chrome中的控制台特别说明了"function testObj.text()"。从本质上讲，它不会运行内部的代码，再次良好。

这是问题所在。

当我尝试调用testObj对象作为回调方法时，它不起作用。

这里是我有：

$('#test').click(function(){ 
    $(this).animate({"font-size": "20"}, 3000, "swing", testObj.text()); 
});

直接与上面这段代码，结束意外事件发生的是，虽然“是它的工作”拿出在控制台中使用时，它不等待然后启动回叫3秒钟，一旦按钮被点击，回调就会熄灭。本质上它错过了回调。

现在，当我使用相同的代码，但从对象调用删除括号，然后它的工作原理如下。动画播放完成后3秒钟后，回调会触发并在控制台上显示“正在工作”。

$('#test').click(function(){ 
    $(this).animate({"font-size": "20"}, 3000, "swing", testObj.text); 
});

上面看一路的第一例子，当我删除了括号，控制台显示它给我作为一个对象，并没有运行里面的代码，我不明白为什么现在的作品里面括号中的回调被删除。

我的问题是，为什么会发生这种情况？我已经在谷歌上下了，但不知道我在寻找什么。

来源

2015-08-26 somdow

jquery animate函数方法为整个参数使用Function（）类型。在使用animate的第一个示例中，您正在评估testObj.text（）并将该值传递给动画（具有输出到控制台的副作用）。在第二个例子中，你实际上正在传递函数。 – russianmario

括号会导致函数执行。当你传递回调时，你传递函数的名字作为参考。（要知道，在JavaScript函数是“一等公民”，并可以作为像任何其他对象。）

所以当你做这样的事情：

var x = someObject.someFunction;

要设置x该函数引用。它允许你执行它作为一个功能：

x();

但是，当你这样做：

var x = someObject.someFunction();

您是执行功能并设置其结果到x。因此，这：

$(this).animate({"font-size": "20"}, 3000, "swing", testObj.text());

执行给testObj.text()函数（其写入控制台），并将其结果（这是undefined）作为回调，从而导致错误的jQuery时尝试调用该回调。但是这个：

$(this).animate({"font-size": "20"}, 3000, "swing", testObj.text);

不执行该功能。它传递函数作为jQuery稍后将执行的引用。

来源

2015-08-26 12:42:29 David

本质上它错过了回调。

$(this).animate({"font-size": "20"}, 3000, "swing", testObj.text());

即设置回调为运行（立即）的testObj.text函数

$(this).animate({"font-size": "20"}, 3000, "swing", testObj.text);

即设置回调是testObj的结果。文本功能

所有你之前写的代码是混淆了你，因为你的控制台登录功能的结果，不返回一个值，但在运行时，日志控制台本身...

从这段代码中，我看不出你是如何确定通过函数的结果是正确的事情，当你想使用函数作为回调被回叫时

来源

2015-08-26 12:39:08

答案非常简单。

下面是一个基本asynchronous function添加a + b并在完成时调用回调函数的示例。

var addition = function(a, b, callback){ 
    setTimeout(function(){ 
    callback(a+b); 
    }, 0); 
}

现在让我们回到你遇到的问题。我想一起添加1 + 1并在添加结束时调用回调函数。

如果我这样做：

var func = function(result){ 
    console.log(result); 
} 

addition(1, 1, func());

回调没有被正确使用作为一个回调函数。当然，你有它在正确的地方，但()意味着你想运行的功能。因此，这里是一步一步的，当你喜欢的运行会发生什么：

addition(1, 1, func());

FUNC（）被称为第一，并试图CONSOLE.LOG（结果），其结果是不确定，因为我们从来没有把它作为一个我们调用函数时的参数
func()没有任何返回结果，因此addition中的第三个参数不是function。
Addition终于被调用但失败，因为callback不是一个函数。

现在正确的方法是不添加()。这确保func在调用addition之前不会被调用。您实际上将未调用的函数发送到addition。当addition完成时，它是1 + 1它将调用func（恰好命名为callback），结果为parameter。

来源

2015-08-26 12:50:36 rottenoats

在jQuery中调用对象作为回调，无法正常工作

回答

相关问题