在 javascript 中使用回调后解释输出

Interpreting output after using callback in javascript

我是 javascript 的新手,我正在尝试了解回调。我无法理解为什么 20 在 10 之前打印。我的理解是回调函数,如 - func1(parameter,func2())func2() 是回调函数,它在 func1 执行之后执行"parameter" 传递给 func1。我的理解正确吗?

function timePass(length){

    console.log("finished after doing timePass for "+length +" seconds")
}

timePass(10,timePass(20));

输出如下:

finished after doing timePass for 20 seconds

finished after doing timePass for 10 seconds

基本上,当解释器查看这个时,它会调用 timepass(20) 来评估结果(这没什么,因为你没有 return returning 东西),然后它试图传递给外部函数。

doFunction( doSomethingElse() );

if doSomethingElse returns 1,它必须在将那个 1 传递给 doFunction.

之前对其求值

从根本上说,您实际上并没有传递回调,您已经调用了 函数。也许你的意思是:

callback = function() { somecode; }
target = function(data, callback) { console.log('hi'); callback(); }

target(10, callback);

注意缺少 ()callback 而不是 callback()

您实际上并没有创建回调函数,而是在最后一行代码中调用 timePass(20) 之前的所有其他内容。

要传递回调函数,您应该这样做:

function timePass(length,callback){
    console.log("finished after doing timePass for "+length +" seconds")
    if(typeof(callback) == "function")
        callback(20);
}

timePass(10,timePass);

这是因为您执行函数timePass,然后将结果添加为参数编号 2。

解释发生了什么:

首先定义新函数"timePass",在控制台打印函数。
其次执行 timePass(10, /*But here you execute it again*/ timePass(20)).

函数 timePass(20) 将首先执行,因为您添加了 ().
() == execute。如果你只是传递函数的名称,它将作为函数传递。当您使用 () 时,它将被执行,然后结果将作为参数传递。

使用回调的示例

function timePass(length, callbackFunction){

    console.log("finished after doing timePass for "+length +" seconds");

    // check if the function caller is included callback parameter
    // and check if it is function - to prevent errors.
    if (callbackFunction && typeof callbackFunction == "function") {
        // Execute the callback (timePass)
        callbackFunction(20);
    }
}

// Here you say, Execute timePass with arg 10, and then call timePass
timePass(10, timePass);
// and now callbackFunction defined above will be == timePass

// You can do also
timePass(10, anotherFunction)
// So another function will be executed after console.log()

用例

我们在处理异步代码时最常使用回调。

例如:Jsfiddle

// Imagine we have function which will request the server for some data.
function getData(index) {
  // The request - response will took some time
  // 0.1s ? 15s ? We don't know how big is the data we downloading.
  var data;
  // Imagine this is an AJAX call, not timeout.
  setTimeout(function() {
    // after 30ms we recieved 'server data'
    data = 'server data';
  },30)

  return data;
}

var users = getData('users');

console.log(users); // undefined - because we returned "data" before the AJAX is completed.

/*
So we can change the function and adding an callback.
*/

function getAsyncData(index, callback) {
  var data;
  // Imagine this is an AJAX call, not timeout.
  setTimeout(function() {
    // after 30ms we recieved 'server data'
    data = 'server data';
    callback(data);
  },30)

}

getAsyncData('users', function(data) {
  console.log(data); // 'server data'
});

// OR

function processData(data) {
  console.log(data);
}

getAsyncData('users', processData); // processData also logs 'server data'