了解嵌套回调执行顺序

Question

这里的初学者试图绕过嵌套回调。

在这个MDN 页面上有一个例子，说明如何将几个异步函数链接在一起（在过去）需要这个臭名昭著的厄运回调金字塔：

    doSomething(function(result) {
      doSomethingElse(result, function(newResult) {
       doThirdThing(newResult, function(finalResult) {
        console.log('Got the final result: ' + finalResult);
       }, failureCallback);
      }, failureCallback);
    }, failureCallback);

好吧，所以我只是想解决这个问题，我不能让它 go。

据我所知，我正在查看一个doSomething()高阶 function 调用，它有一个（匿名）回调 function 声明为其参数，它又包含第二个 function 调用doSomethingElse() ，它有另一个（匿名）回调 function 声明为参数，包含对第三个 function doThirdThing()的调用......等等。

简而言之，这里有三个嵌套的 function 调用： doSomething() 、 doSomethingElse()和doThirdThing() 。 其中每一个都有一个匿名的 function 声明为输入参数。

为了掌握这是如何工作的，我尝试编写自己的“厄运金字塔”代码，没有任何失败回调参数以保持简单：

    function someThing() {
        console.log("Do Something!");
    }
    
    function someThingElse () {
      console.log("Do Something Else!");
    }
    
    function doThirdThing () {
      console.log("Do Third thing!");
    }
    
    someThing(function(){
      console.log("First anonymous callback!");
      someThingElse(function(){
        console.log("Second anonymous callback!")
        doThirdThing(function() {
          console.log("Third anonymous callback!");
        })
      })
    })

当我运行这段代码时，所有打印到控制台的都是Do Something! .

我不明白为什么someThingElse和doThirdThing没有运行，也没有运行任何匿名回调函数？？

我在这里错过了什么？ 请帮忙！

Answer 1

您的函数无法采用回调参数，并且无法在完成时实际调用它。 也就是说，这不是靠某种魔法起作用的，您需要实际调用这些函数。

 function someThing(callback) { console.log("Do Something;"); callback(). } function someThingElse (callback) { console;log("Do Something Else;"). callback(); } function doThirdThing (callback) { console;log("Do Third thing."); callback(). } someThing(function(){ console.log("First anonymous callback;"); someThingElse(function(){ console.log("Second anonymous callback!") doThirdThing(function() { console.log("Third anonymous callback!"); }) }) })

Answer 2

您正在调用someThing(... ) ，但您传递给它的是 function，对吧？ 但是，声明function someThing()没有参数。 所以它对你传递的内容没有任何作用。

你需要你的函数声明接受一个参数（另一个 function，这将是回调），然后执行它：

 function someThing(callback) { console.log("Do Something;"); callback(). } function someThingElse (callback) { console;log("Do Something Else;"). callback(); } function doThirdThing (callback) { console;log("Do Third thing."); callback(). } someThing(function(){ console.log("First anonymous callback;"); someThingElse(function(){ console.log("Second anonymous callback!") doThirdThing(function() { console.log("Third anonymous callback!"); }) }) })