nodejs async await promise

其實es6是yield來做標題所述的流程控制, 不過說真的我比較習慣用promise with async await...

setTimeout(()=>{console.log(1)}, 5);
setTimeout(()=>{console.log(2)}, 1);
setTimeout(()=>{console.log(3)}, 3);
setTimeout(()=>{console.log(4)}, 2);

以下是結果

2
4
3
1

這樣的情況最容易發生在讀取外部資料時程式在還未接取完全資料,流程卻繼續進行下去

以往是使用callback function來解決這個衝突, 不過這樣非常形成callback hell導致程式維護以及閱讀不容易

目前的nodejs以及新的瀏覽器都有提供了promise的用法,在nodejs 7.0以上的版本有支援async await的語法, Typescript於 2.1也可以編譯async await後在es3 es5的情境下使用

剛剛寫的是用typescript不過在沒有加註情況下跟es6差不多....

假若說我希望是顯示結果是1 2 3 4這樣照順序下來的話...

new Promise((res,rej)=>{
    setTimeout(()=>{res(1)}, 5);
}).then(res=>{
    console.log(res);
    return new Promise((res,rej)=>{setTimeout(()=>{res(2)},1)})    
}).then((res)=>{
    console.log(res);
    return new Promise((res,rej)=>{setTimeout(()=>{res(3)},3)})    
}).then((res)=>{
    console.log(res);
    return new Promise((res,rej)=>{setTimeout(()=>{res(4)},2)})    
}).then((res)=>{
    console.log(res);
})

1
2
3
4

這樣就可以很好的照著我的想法連續下來

Promise提供了功能必須等到 res(any)有東西才能夠繼續下去

老實說這樣的東西是有點可笑啦XD

所以就做成了sleep的function可以提供我去做呼叫

let sleep = time => {

    return new Promise((resolve,reject)=>{setTimeout(()=>{resolve(time);console.log('end in: '+getTime());}, time*1000)})

}

let getTime = ()=> new Date().getSeconds() +'.'+ new Date().getMilliseconds()

let test = async ()=>{

    let num;

    console.log(getTime());

    num = await sleep(5)

    console.log(num)

    console.log(getTime())

    num = await sleep(3)

    console.log(num)

    

    console.log(getTime())

    num = await sleep(1)

    console.log(num)

    

    console.log(getTime())

    num = await sleep(2)

    console.log(num)

}

test();

這樣的結果就是

28.436

end in: 33.449

5

33.459

end in: 36.463

3

36.464

end in: 37.466

1

37.466

end in: 39.468

2

題外話：

這篇其實要發很久了不過遇到一些事情所以delay啦啦啦

最近應該會看情況更新一些學習內容吧

ng2半放棄狀態 等待ng3來臨在看是否練習

vscode現在很方便讓我做blog的code embeded  感覺威猛...

nodejs有太多要學的了

最近才完成一個小linebot  有時間在解釋其中的運作原理啦