在Promise鏈中共享變量的方法

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

濟(jì)寧網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián),濟(jì)寧網(wǎng)站設(shè)計(jì)制作，有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為濟(jì)寧上千余家提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站建設(shè)公司要多少錢(qián)，請(qǐng)找那個(gè)售后服務(wù)好的濟(jì)寧做網(wǎng)站的公司定做！

問(wèn)題

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

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

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

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

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
    });

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

方法2：嵌套作用域

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

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

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

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

intermediate變量在A處定義并賦值，而在B處需要使用；但是，由于A與B處于不同的作用域，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
    });

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

方法4: 使用Async/Await

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

方法1中的示例可以改寫(xiě)為：

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

方法3中的示例可以改寫(xiě)為：

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

毋庸贅言，Async/Await直接將問(wèn)題消滅了。

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

當(dāng)前標(biāo)題：在Promise鏈中共享變量的方法
文章地址：http://muchs.cn/article36/pdghpg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)網(wǎng)站制作、品牌網(wǎng)站設(shè)計(jì)、定制網(wǎng)站、商城網(wǎng)站、App開(kāi)發(fā)、響應(yīng)式網(wǎng)站

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容