溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

在Promise鏈中共享變量的方法

發(fā)布時(shí)間:2020-06-05 17:38:43 來源:億速云 閱讀:217 作者:Leah 欄目:web開發(fā)

怎么在Promise鏈中共享變量?其實(shí)要解決這個(gè)問題也不難,為此小編總結(jié)了這篇文章,下面我們一起來看看在Promise鏈中共享變量的方法。

問題

connection變量在A處定義,在BC處都需要使用。但是,由于A、B、C處于各自獨(dú)立的作用域,connection變量將不能在BC處直接使用。

db.open()
    .then(connection => // A
    { 
        return connection.select(
        {
            name: 'Fundebug'
        });
    })
    .then(result =>
    {
        connection.query(); // B
    })
    .catch(error =>
    {
        // ...
    })
    .finally(() =>
    {
        connection.close(); // C
    });

方法1:使用高階作用域變量

在更高階的作用域定義connection變量,在D處賦值,這樣在BC處直接使用了。

let connection; // A
db.open()
    .then(conn =>
    {
        connection = conn; // D
        return connection.select(
        {
            name: 'Fundebug'
        });
    })
    .then(result =>
    {
        connection.query(); // B
    })
    .catch(error =>
    {
        // ...
    })
    .finally(() =>
    {
        connection.close(); // C
    });

問題:如果需要共享的變量過多(這是很常見的情況),則需要在高階作用域中定義很多變量,這樣非常麻煩,代碼也比較冗余。

方法2:嵌套作用域

將需要使用connection變量的Promise鏈內(nèi)嵌到對(duì)應(yīng)then回調(diào)函數(shù)中,這樣在BC處直接使用了。

db.open()
    .then(connection => // A
        {
            return connection.select(
                {
                    name: 'Fundebug'
                })
                .then(result =>
                {
                    connection.query(); // B
                })
                .catch(error =>
                {
                    // ...
                })
                .finally(() =>
                {
                    connection.close(); // C
                });
        });

問題:之所以使用Promise,就是為了避免回調(diào)地域,將多層嵌套的回調(diào)函數(shù)轉(zhuǎn)化為鏈?zhǔn)降膖hen調(diào)用;如果為了共享變量采用嵌套寫法,則要Promise有何用?

方法3:return多個(gè)值

intermediate變量在A處定義并賦值,而在B處需要使用;但是,由于AB處于不同的作用域,B出并不能直接使用intermediate變量:

return asyncFunc1()
    .then(result1 =>
    { 
        const intermediate = ··· ; // A
        return asyncFunc2();
    })
    .then(result2 =>
    { 
        console.log(intermediate); // B
    });

A處使用Promise.all返回多個(gè)值,就可以將intermediate變量的值傳遞到B處:

return asyncFunc1()
    .then(result1 =>
    {
        const intermediate = ···; 
        return Promise.all([asyncFunc2(), intermediate]); // A
    })
    .then(([result2, intermediate]) =>
    {
        console.log(intermediate); // B
    });

問題:  使用Promise.all用于傳遞共享變量,看似巧妙,但是有點(diǎn)大材小用,并不合理;不能將變量傳遞到.catch()finally()中;當(dāng)共享變量過多,或者需要跨過數(shù)個(gè).then(),需要return的值會(huì)很多。

方法4: 使用Async/Await

Async/Await是寫異步代碼的新方式,可以替代Promise,它使得異步代碼看起來像同步代碼,可以將多個(gè)異步操作寫在同一個(gè)作用域中,這樣就不存在傳遞共享變量的問題了!??!

方法1中的示例可以改寫為:

try
{
    var connection = await db.open(); // A 
    const result = await connection.select(
    {
        name: 'Fundebug'
    });
    connection.query(); // B
}
catch (error)
{
    // ...
}
finally
{
    connection.close(); // C
}

方法3中的示例可以改寫為:

try
{
    result1 = await asyncFunc1();
    const intermediate = ··· ;
    result2 = await asyncFunc2();
    console.log(intermediate);
}
catch (error)
{
    // ...
}

毋庸贅言,Async/Await直接將問題消滅了。

看完這篇文章,你們學(xué)會(huì)在Promise鏈中共享變量的方法了嗎?如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容,歡迎關(guān)注億速云行業(yè)資訊頻道,感謝各位的閱讀。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI