🦒 Promiseオブジェクトを使った非同期処理（基本的な書き方②）分かりやすい記事メモ
JavaScript promise async await
作成日： 2021/12/26
3

前回はresolveのみだったが、rejectありの記事もあったのでメモ。
（結論として、resolveかrejectどちらかしか書けない。）

・【前回のもの→】Promiseオブジェクトを使った非同期処理（基本的な書き方①）
https://ticketnote.dev/ticket/oSOqwpzoINHP3g57Vv11

Promiseオブジェクトについて、噛み砕かれていて非常に分かりやすい↓↓↓
・【ES6】 JavaScript初心者でもわかるPromise講座
https://qiita.com/cheez921/items/41b744e4e002b966391a

Promise.allやPromise.race、async awaitについての説明もあり。

メモ

rejectは、.catchを使うStatusがfullfilledになってしまう。
→「.catchでエラー出したから、いいや」となるらしい。

.catchを消すと、rejectになった。

テスト用コード

ちょっと長いけど、テストコード。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script>

        // const asyncFunc = async function() {
        //     return 'asynn';
        // }

        // console.log(asyncFunc())




        // const asyncFunc = async function() {
        //     let x, y;
        //     x = await new Promise(function(resolve) {
        //         setTimeout(function() {
        //             resolve(1)
        //         }, 1000)
        //     })

        //     y = await new Promise(function(resolve) {
        //         setTimeout(function() {
        //             resolve(1)
        //         }, 1000)
        //     })

        //     console.log(x + y)
        // }
        // asyncFunc()





        // const asyncFunc = async function() {
        //     return 1
        // }
        // console.log(asyncFunc())
        // const alwaysLateBoy = async function(ms) {
        //     await new Promise(function(resolve) {
        //         setTimeout(function() {
        //             resolve()
        //         }, ms)
        //     })
        // }
        // alwaysLateBoy(1000)




        // const promise1 = new Promise(function(resolve) {
        //     setTimeout(function() {
        //         resolve();
        //     }, 1000);
        // }).then(function() {
        //     console.log('promise1終わったよ！')
        // })

        // const promise2 = new Promise(function(resolve) {
        //     setTimeout(function() {
        //         resolve();
        //     }, 3000)
        // }).then(function() {
        //     console.log('promis2終わったよ！')
        // })

        // Promise.all([
        //     promise1, promise2
        // ]).then(function() {
        //     console.log('全部終わったよ！') //all
        //     // console.log('どれかひとつ終わったよ！') //race
        // })



        // const promise = new Promise(function(resolve, reject) {
        //     reject('test1')
        // })
        // .then(function(val) {
        //     console.log(`resolve: ${val}`)
        //     return val;
        // })
        // .catch(function(val) {
        //     console.log(`catch: ${val}`)
        //     return val;
        // })
        // .then(function(val) {
        //     console.log(`then: ${val}`)
        // })
        // .catch(function() {
        //     console.log('rejectしたよ')
        // })
        // console.log(promise)
    </script>
</body>
</html>
Yu
事業会社にてコーダーをしています。制作は6年目。 インプットしたことをアウトプットしています。