javascript - 如何控制函数按顺序执行？

Question

我是 Javascript 的新手。我正在尝试按顺序管理几个功能。但是当它到达 API 调用时，它不会等待响应并返回继续执行并使我的代码变得困惑。这是一个示例:

function readFacebook()
{
    var myID = getMyID();
    console.log("myID=  " + myID);
}

function getMyID(){
        FB.api('/me', function(response) {
        console.log("response.id= "+response.id);
        return(response.id);
    }); 

}

输出是完全奇怪的。首先

console.log("myID=  " + myID);

显示输出然后

console.log("response.id= "+response.id);

将被调用。任何人都可以解释我如何强制它按顺序实现。我的意思是程序应该等到 facebook 的响应而不是异步工作!

编辑

我实际上从主函数调用了 3 次 API 到三个子函数。我该如何组织:

function getMyID(){
            FB.api('/me', function(response) {
            console.log("response.id= "+response.id);
            return(response.id);
        }); 

    }

function readFacebookEvent(id)
{
    var myID = getMyID();
    console.log("myID=  " + myID);
    FB.api('/me/events', function(response) {

        for(i=0; i<response.data.length;i++) {
            var str;
            var eventID = response.data[i].id;
            getEvent(eventID,myID);
        }
    });
}

function getEvent(eventID,myID){

        FB.api("/"+ eventID , function (response3) {

            if (response3 && !response3.error) {
                //console.log(response3);
                var date = new Date((response3.start_time || "").replace(/-/g,"/").replace(/[TZ]/g," "));
                var diff = (((new Date()).getTime() - date.getTime()) / 1000);
                //console.log(diff);
                if(myID == response3.owner.id && diff < 0 )
                {
                        //console.log("found=  " + myID);
                        var t = getImage(eventID);
                        if(t)
                        {
                            console.log("TRUE");
                        }
                        else
                        {
                            console.log("false");
                        }
                }

            }
        });
  }

function getImage(eventID){
    //console.log("******eventID== "+eventID);
    FB.api("/"+eventID+"/picture",
            {
                "redirect": false,
                "type": "normal"
            },function (response2) {
              if (response2 && !response2.error) {
                  str="<br/><b>Pic</b> : <img src='"+response2.data.url+"'/>";
                  //console.log("response2.data.url=  "+response2.data.url);

                  //str +="<b>name: </b>"+response3.name+"<br>";
                  document.getElementById("status2").innerHTML+=str;
                  return true;
                }
                else
                {
                    return false;   
                }
            }); 
}

Answer 1

正如您提到的，对 facebook 的 api 的调用是异步，这意味着您无法确定何时会从您的请求返回结果数据。您可以通过使用回调来变通并保证您正在寻找的顺序:

function readFacebook(id) {
  console.log("myID=  " + id);
}

function getMyID(cb) {
  FB.api('/me', function(response) {
    console.log("response.id= "+response.id);
    cb(response.id);
  }); 
}

getMyID(readFacebook);

这里发生的是对 FB.api 的调用接受一个回调，该回调在服务器返回响应时触发。由于我们正在为 getMyID 提供我们自己的回调，一旦服务器响应，我们就可以使用它来访问 response.id。