成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

理解async

Jackwoo / 2808人閱讀

摘要:寫在前面本文將要實現(xiàn)一個順序讀取文件的最優(yōu)方法,實現(xiàn)方式從最古老的回調方式到目前的,也會與大家分享下本人對于庫與庫的理解。其實的任何異步編程的解決方案的目標都是要達到同步的語義,異步的執(zhí)行。

寫在前面

本文將要實現(xiàn)一個順序讀取文件的最優(yōu)方法,實現(xiàn)方式從最古老的回調方式到目前的async,也會與大家分享下本人對于thunk庫與co庫的理解。實現(xiàn)的效果:順序讀取出a.txtb.txt,將讀出的內容拼接成為一個字符串。

同步讀取
const readTwoFile = () => {
    const f1 = fs.readFileSync("./a.txt"),
        f2 = fs.readFileSync("./b.txt");
    return Buffer.concat([f1, f2]).toString();
};

這種方式最利于我們理解,代碼也很清楚,沒有過多的嵌套,很好的維護,但是這種有著最大的問題,那就是性能,node所倡導的就是異步i/o來處理密集i/o,而同步的讀取,很大的程度上浪費著服務器的cpu,這種方式的弊端明顯的大于好處,所以直接pass掉。(其實node的任何異步編程的解決方案的目標都是要達到同步的語義,異步的執(zhí)行。

利用回調讀取
const readTwoFile = () => {
    let str = null;
    fs.readFile("./a.txt", (err, data) => {
        if (err) throw new Error(err);
        str = data;
        fs.readFile("./b.txt", (err, data) => {
            if (err) throw new Error(err);
            str = Buffer.concat([str, data]).toString();
        });
    });
};

利用回調的方式,實現(xiàn)起來很簡單,直接的嵌套下去就好,但是這種情況下很容易造成的就是不易維護,難以讀懂的情況,最為極致的情況的就是回調地獄。

Promise實現(xiàn)
const readFile = file => 
    new Promise((reslove, reject) => {
        fs.readFile(file, (err, data) => {
            if (err) reject(err);
            reslove(data);
        });
    });
const readTwoFile = () => {
    let bf = null;
    readFile("./a.txt")
        .then(
            data => {
                bf = data;
                return readFile("./b.txt");
            }, 
            err => { throw new Error(err) }
        )
        .then(
            data => {
                console.log(Buffer.concat([bf, data]).toString())
            }, 
            err => { throw new Error(err) }
        );
};

Promise可以將橫向增長的回調轉化為縱向增長,能解決一些問題,但是Promise造成的問題就是代碼冗余,一眼看過去,全部是then,也不是很爽,但是相比于回調函數(shù)嵌套來說,已經(jīng)有了很大的提升。

yield

Generator很多語言中都有,本質上是協(xié)程,下面就來看一下協(xié)程,線程,進程的區(qū)別與聯(lián)系:

進程:操作系統(tǒng)中分配資源的基本單位

線程:操作系統(tǒng)中調度資源的基本單位

協(xié)程:比線程更小的的執(zhí)行單元,自帶cpu上下文,一個協(xié)程一個棧

一個進程中可能存在多個線程,一個線程中可能存在多個協(xié)程,進程、線程的切換由操作系統(tǒng)控制,而協(xié)程的切換由程序員自身控制。異步i/o利用回調的方式來應對i/o密集,同樣的使用協(xié)程也可以來應對,協(xié)程的切換并沒有很大的資源浪費,將一個i/o操作寫成一個協(xié)程,這樣進行i/o時可以吧cpu讓給其他協(xié)程。
js同樣支持協(xié)程,那就是yield。使用yield給我們直觀的感受就是,執(zhí)行到了這個地方停了下來,其他的代碼繼續(xù)跑,到你想讓他繼續(xù)執(zhí)行了,他就是會繼續(xù)執(zhí)行。

function *readTwoFile() {
    const f1 = yield readFile("./a.txt");
    const f2 = yield readFile("./b.txt");  
    return Buffer.concat([f1, f2]).toString();
}

yield下的順序讀取呈現(xiàn)的也是一種順序讀取的方式,對于readFile來看有兩種不同的實現(xiàn)方式,

利用thunkify

const thunkify = (fn, ctx) => (...items) => (done) => {
    ctx = ctx || null;
    let called = false;
    items.push((...args) => {
        if (called) return void 0;
        called = true;
        done.apply(ctx, args);
    });
    try {
        fn.apply(ctx, items);    
    } catch(err) {
        done(err);
    }
};

thunkify函數(shù)就是一種柯里化得思想,最后的傳入?yún)?shù)done就為回調函數(shù),利用thunkify可以很輕松的實現(xiàn)yield函數(shù)的自動化流程:

const run = fn => {
    const gen = fn();
    let res;
    (function next(err, data) {
        let g = gen.next(data);
        if (g.done) return void 0;
        g.value(next);
    })();
};

利用Promise

const readFile = file => 
    new Promise((reslove, reject) => {
        fs.readFile(file, (err, data) => {
            if (err) reject(err);
            reslove(data);
        });
    });
const run = fn => {
    const gen = fn();
    let str = null;
    (function next(err, data) {
        let res = gen.next(data);
        if (res.done) return void 0;
        res.value.then(
            data => {
                next(null, data);
            }, 
            err => { throw new Error(err); }
        );
    })();
};
run(readTwoFile);

上面兩種方式都可以達到自動執(zhí)行yield的過程,那么有沒有一種方式,可以兼容這兩種實現(xiàn)方式呢,tj大神又給出了一個庫,那就是co庫,先來看下用法:

// readTwoFile的實現(xiàn)與上面類似,readFile既可以利用Promise也可以利用thunkify
// co庫返回一個Promise對象
co(readTwoFile).then(data => console.log(data));

來看下co庫的實現(xiàn),co庫默認會返回一個Promise對象,對于yield之后的值(如上面的res.value),co庫會將其轉換為一個Promise。實現(xiàn)思想很簡單,基本還是利用遞歸的方式,大體的思路如下:

const baseHandle = handle => res => {
    let ret;
    try {
        ret = gen[handle](res);
    } catch(e) {
        reject(e);
    }
    next(ret);
};
function co(gen) {
    const ctx = this,
        args = Array.prototype.slice.call(arguments, 1);
    return new Promise((reslove, reject) => {
        if (typeof gen === "function") gen = gen.apply(ctx, args);
        if (!gen || typeof gen.next !== "function") return resolve(gen);

        const onFulfilled = baseHandle("next"),
            onRejected = baseHandle("throw");

        onFulfilled();

        function next(ret) {
            if (ret.done) reslove(ret.value);
            // 將yield的返回值轉換為Proimse
            const value = toPromise.call(ctx, ret.value);
            if (value && isPromise(value)) return value.then(onFulfilled, onRejected);
            return onRejected(new TypeError("yield type error"));
        }
    });
}

toPromise就是將一些類型轉換為Promise,從這里我們可以看出的是可以將哪些類型放在yield后面,這里就來看一個常用的:

// 把thunkify之后的函數(shù)轉化為Promise的形式
function thunkToPromise(fn) {
    const ctx = this;
    return new Promise(function (resolve, reject) {
        fn.call(ctx, function (err, res) {
            if (err) return reject(err);
            if (arguments.length > 2) res = slice.call(arguments, 1);
            resolve(res);
        });
    });
}

最近Node已經(jīng)支持了async/await,可以利用其來做異步操作:

終極解決
const readFile = file => 
    new Promise((reslove, reject) => {
        fs.readFile(file, (err, data) => {
            if (err) reject(err);
            reslove(data);
        });
    });
const readTwoFile = async function() {
    const f1 = await readFile("./a.txt");
    const f2 = await readFile("./b.txt");    
    return Buffer.concat([f1, f2]).toString();
};
readTwoFile().then(data => {
    console.log(data);
});

async/await做的就是將Promise對象給串聯(lián)起來,避免了then的調用方式,代碼非常的易讀,就是一種同步的方式。不再需要借助其他外界類庫(比如co庫)就可以優(yōu)雅的解決回調的問題。

文章版權歸作者所有,未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉載請注明本文地址:http://systransis.cn/yun/81985.html

相關文章

  • 令人費解的 async/await 執(zhí)行順序

    摘要:問題的關鍵在于其執(zhí)行過程中的微任務數(shù)量,下文中我們需要用上述代碼中的方式對微任務的執(zhí)行順序進行標記,以輔助我們理解這其中的執(zhí)行過程。 原文發(fā)布在掘金社區(qū):https://juejin.im/post/5c3cc981f265da616a47e028 起源 2019年了,相信大家對 Promise 和 async/await 都不再陌生了。 前幾日,我在社區(qū)讀到了一篇關于 async/...

    WilsonLiu95 評論0 收藏0
  • 「今日頭條」前端面試題和思路解析

    摘要:一篇文章和一道面試題最近,有篇名為張圖幫你一步步看清和的執(zhí)行順序的文章引起了我的關注。作者用一道年今日頭條的前端面試題為引子,分步講解了最終結果的執(zhí)行原因。從字面意思理解,讓我們等等。當前的最新版本,在這里的執(zhí)行順序上,的確存在有問題。 一篇文章和一道面試題 最近,有篇名為 《8張圖幫你一步步看清 async/await 和 promise 的執(zhí)行順序》 的文章引起了我的關注。 作者用...

    寵來也 評論0 收藏0
  • 8張圖幫你一步步看清 async/await 和 promise 的執(zhí)行順序

    摘要:第部分畫圖一步步看清宏任務微任務的執(zhí)行過程我們以開篇的經(jīng)典面試題為例,分析這個例子中的宏任務和微任務。注意這里只是把推入微任務隊列,并沒有執(zhí)行。執(zhí)行結束,才能繼續(xù)執(zhí)行后面的代碼如圖此時當前宏任務都執(zhí)行完了,要處理微任務隊列里的代碼。 8張圖讓你一步步看清 async/await 和 promise 的執(zhí)行順序 為什么寫這篇文章? 測試一下自己有沒有必要看 需要具備的前置基礎知識 主...

    weizx 評論0 收藏0
  • promise async await 理解筆記

    摘要:在異步編程中,提供了對象的方式。例如等同于所以可以理解為生成一個實例。那么自然也可以去調用則是配合使用的。等于是等待一個返回值,等待的執(zhí)行結果。但是函數(shù)不會造成阻塞,所以配合使用,則沒有影響到外部。 在異步編程中,es6提供了promise對象的方式。簡單的用法 var promise = new Promise((resolve,reject)=>{ if(){ ...

    NoraXie 評論0 收藏0
  • 理解 JavaScript 的 async/await

    摘要:因為函數(shù)返回一個對象,所以可以用于等待一個函數(shù)的返回值這也可以說是在等函數(shù),但要清楚,它等的實際是一個返回值。幫我們干了啥作個簡單的比較上面已經(jīng)說明了會將其后的函數(shù)函數(shù)表達式或的返回值封裝成一個對象,而會等待這個完成,并將其的結果返回出來。 隨著 Node 7 的發(fā)布,越來越多的人開始研究據(jù)說是異步編程終級解決方案的 async/await。我第一次看到這組關鍵字并不是在 JavaSc...

    tracymac7 評論0 收藏0
  • 理解ES7中的async函數(shù)

    摘要:什么是標準引入了函數(shù),使得異步操作變得更加方便。顧名思義是異步的意思,用于聲明一個函數(shù)是異步的。的作用正常情況下,命令后面是一個對象。表示函數(shù)等待返回結果了,再繼續(xù)執(zhí)行。上面便是一種錯誤用法,并沒有在函數(shù)執(zhí)行上下文中,而是在的回調函數(shù)中。 什么是Async、await ES2017 標準引入了 async 函數(shù),使得異步操作變得更加方便。async顧名思義是異步的意思,用于聲明一個函數(shù)...

    curried 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<