異步等待異常行為

Question

我試圖了解JavaScript異步/等待功能。

所以我寫了一個簡短的代碼來理解它，但這給了我異常的行為/結果。

 var a = 10; function load_data(data) { setTimeout(() => { a = data }, 2000); } function print() { console.log(a); } async function init() { await load_data(40); print(); } init(); 

我希望記錄的值是40，但是用async和await記錄的值是10。

Answer 1

異步等待取決於Promises ，但是您並未在代碼中的任何地方做出承諾。 結果，等待load_data不會等待。

嘗試使用Promise並在超時觸發后解決：

function load_data(data){
    return new Promise(resolve => setTimeout(() => {
        a=data
        resolve()
    }, 2000))
}

另外，我們假設這只是為了學習異步/等待...否則，您應該以這種方式使用全局變量考慮所有常見建議。 一旦您的代碼變大，這就是一團糟

 var a = 10 function load_data(data){ return new Promise(resolve => setTimeout(() => { a=data resolve() }, 2000)) } function print(){ console.log(a) } async function init(){ await load_data(40); print(); } init(); 

Answer 2

異步/等待是用於處理承諾的語法，而不僅僅是任何異步行為。 為了使其與load_data一起load_data ，該函數將需要返回解析為40的promise對象。

這應該可以滿足您的期望：

var a = 10

function load_data(data){
  return new Promise((resolve) => {
    setTimeout(() => {
        a=data;
        resolve(a);
    }, 2000)
  });
}

function print(){
    console.log(a)
}

async function init(){

    await load_data(40);

    print();
}

init();

在學習異步等待之前，了解諾言是必不可少的，因為這只是諾言的一種語法。

Answer 3

您應該在load_data()返回一個Promise 。 實際上，您什么也不返回，因此代碼不等待任何值被解析。 您應該執行以下操作：

function load_data(data){
    return new Promise( resolve => {
       setTimeout(() => {
           a=data;
           resolve(true);
       }, 2000)
    }
}

Answer 4

您應該創造承諾。 此外，最好不要使用全局變量，而應讓promise解析為所需的值：

 function load_data(data){ return new Promise(resolve => { setTimeout(() => { resolve(data); //<-- pass data to resolve }, 2000) }); } async function init(){ let data = await load_data(40); // <--- get the promised value console.log(data); } init(); 

Answer 5

請在執行打印功能之前為所設置的值設置承諾

var a = 10;
function load_data(data) {
  return new Promise(resolve => {
      a=data;
      resolve('resolved');
  });
}

async function init() {

  var result = await load_data(40);
  print();
}

function print(){
    console.log(a)
}

init();

Answer 6

請參閱： manual1 manual2

這對我有用：

var a = 10

function load_data(data){
    return new Promise(resolve=>{
        setTimeout(() => {
            a=data;
            resolve('ok');
           }, 2000)    
});

}

function print(){
    console.log(a)
}

async function init(){

await load_data(40);

print();
}

init();