等待異步回調完成，然後再完成Javascript中的單獨功能

Question

如果這是重複的道歉，但我能找到的所有內容都是幫助讓功能完成或不相關的語言，而不是後面要做的事。無論如何...

所以，我有兩個其他方面無關的功能。我們調用Namey API，它在回調函數中返回一個隨機名稱，我用它來更新一個元素。這是我的randomizePANameListeners函數。

我的第二個函數從這兩個元素中獲取名字和姓氏，並使用它們來創建一個隨機的用戶名。這是我的randomizeAppNameListeners。

randomizePANameButton.addEventListener("click", function(e) { 

       // Check the gender of the PA 
      var isChecked = document.getElementById("gender56").checked; 

       // Use a self-invoking function to make sure the names are 
       // updated correctly 
      (function() { 
       if (isChecked === true) { 
       namey.get({ type: 'male', with_surname: 'false', frequency: 'all', callback: function(n) { document.getElementById("fName").value = n }}); 
       } else { 
       namey.get({ type: 'female', with_surname: 'false', frequency: 'all', callback: function(n) { document.getElementById("fName").value = n }}); 
       } 

       // Set the surname as well 
       namey.get({ type: 'surname', with_surname: 'false', frequency: 'all', callback: function(n) { document.getElementById("lName").value = n }}); 
      })() 

而且，連接到第二個按鈕的事件偵聽器：

var fName = document.getElementById("fName").value.substring(0, 3); 
    var lName = document.getElementById("lName").value; 
    var randomDigits = (Math.random() * (100 - 10) + 10).toFixed(0); 

    return fName + lName + ".UAT" + randomDigits; 

現在，我有一個按鈕，使一切通過把所有這些事件監聽器的在一起更容易。我的簡單按鈕爲我做了所有事情，但是當它調用這兩個時，它會使用元素中的當前值創建隨機名稱，然後創建一個新的應用程序名稱，但不會使用新的PA名稱。

所以，使用vanilla JavaScript，我該如何等待完成第二個功能之前完成第一個功能？我不想創建一個不需要的全局變量。

Answer 1

在本地JavaScript可以使用回調在自己的職能

var myFunction = function(complete) { 
    /* Do things here first */ 
    complete(); 
} 
myFunction(function(){ 
    /* Do Something else here after the first has completed */ 
}); 

Answer 2

你可以嘗試用承諾做 - http://www.html5rocks.com/en/tutorials/es6/promises/

這應該工作:)

Answer 3

是用承諾這對於準確地在您的方案可行，如果你使用jQuery，您可以使用延遲。

https://api.jquery.com/jquery.deferred/