Promises in JavaScript can seem a bit daunting at first, but understanding what's happening under the hood can make them much more approachable. In this blog post, we'll dive deep into some of the inner workings of promises and explore how they enable non-blocking asynchronous tasks in JavaScript. I'm still working on making this blog better on mobile devices, mobile browsers don't always render t
まとめ async/await 構文は、Promise で書ける処理のうち特定のケースしか表現できない 特定のケースとは、ある非同期処理の前処理と後処理がそれぞれ 1 個ずつの場合のみである async/await 構文は初心者に非同期処理を導入する際に適しているが、非同期処理を逐次処理として書けるという幻想を与えるので、どこかで知識をアップデートする機会を設けるべきである この記事はなに？ 少しバズったのでまとめておこうかと。 「async/await があれば Promise なんて難しいものは要らない！」とか言ってるウブな子に、複数の API に並列にリクエストを投げて一つ以上成功した時だけ先に進む、みたいな問題を与えて愛でてみたい。— Yuta Okamoto (@okapies) 2020年12月11日 async/await は Promise のネストを手続き的なコードに見え
JavaScriptの非同期処理をしっかり理解する 〜async/await/Promise〜 - Qiita
JavaScript での非同期処理について、身近な例や具体例を交えながら詳細に解説しています。 最後には練習問題も用意しています！ 頑張って書いているので、良いと思ったらコメント・いいね・ストック・共有などしてもらえると嬉しいです！！ 非同期処理とは 非同期処理とは、プログラムの処理が順番に実行されず、ある処理を実行している間に他の処理を並行して実行することができる仕組みです。非同期処理では、あるタスクが完了するのを待たずに次のタスクが実行されるため、効率的に複数の処理を進めることが可能です。 （by ChatGPT） 非同期処理とは、「同期処理」の対義語で、同期処理は「プログラムの処理が順番に実行され、ある処理が終わるまで次の処理を待つ仕組み」です。 非同期処理の最大のメリットは、 「時間のかかる処理を行っている間に別の処理を行うことができる」 ことです！ 身近な例では、部下への仕事の
ReactのConcurrent Modeが最初に発表されたのはもう1年近くも前のことです（記事執筆時点1）。Concurrent Modeはたいへん奥深い機能で正式版がたいへん待ち遠しいですが、Concurrent Modeの代名詞として多くのReactユーザーに知られているのはPromiseをthrowするというAPIデザインです。Concurrent Modeでは、コンポーネントがレンダリング時にPromiseをthrowすることで、レンダリングをサスペンドした（Promiseが解決されるまでレンダリングできない）ことを表します。 Concurrent Modeに関しては筆者の既存記事Concurrent Mode時代のReact設計論 (1) Concurrent Modeにおける非同期処理などをご参照いただきたいのですが、ここではPromiseをthrowするということ自体に焦点
こんにちは！小田島です。前回の「コールバック編」を納稿したとき、アイキャッチ画像はJavaScriptのロゴにタイトルの文字を入れただけというとんでもないやっつけ仕事だったのですが、さくナレ編集部の方に「シリーズで理解が深まる」というすごい煽り文句がついたとてもカッコいい画像に差し替えていただきました。アイキャッチ詐欺にならないようにがんばります。 非同期処理シリーズの2回目はPromiseについての説明です。前回はコールバックについて説明しましたが、Promiseを使うことでどのように便利になったのでしょうか。それでは見ていきましょう！今回はコードが多いのでかなり分量が多く感じられるかもしれませんが、実際はあまり大したことはありません。 今回の目的 今回説明するのはPromiseです。これはFutureパターン（Promiseパターン）というデザインパターンの一種で、ECMAScript
対象読者と目的 非同期処理の実装方法は知っているが、仕組みを詳しく知らないのでベストプラクティスがわからないときがある 実行順序の保証がよくわからないので自信をもってデプロイできない変更がある より詳しい仕組みを理解することでより計画的な実装をできるようになりたい という動機で書かれた記事です。同様の課題を抱える人を対象読者として想定しています。 目次 実行モデルとタスクキュー Promise async/await AbortSignal, Event, Async Context WHATWG Streams / Node.js Streams (執筆中) 未定 用語に関する注意 前回定義した以下の用語を今回も使います。 1 tick ... タスクキューが1周すること。 1 microtick ... マイクロタスクキューが1周すること。 これらの単位は非同期処理の間の相対的な優先順
100秒で理解するPromise
そもそも非同期処理とは？ Promiseについて知るためには、まず非同期処理について知っておく必要があります。 以下の動画で、非同期処理について100秒で解説しているので、そもそも非同期処理をよく知らないなぁという人はぜひ確認してみてください！ Promiseとは では、本題です。 Promiseとは、ES2015で導入された、非同期処理の状態や結果を表現するオブジェクトのことです。 PromiseはES2015で導入された非同期処理の状態や結果を表現するビルトインオブジェクトです。 非同期処理はPromiseのインスタンスを返し、そのPromiseインスタンスには状態変化をした際に呼び出されるコールバック関数を登録できます。 jsprimer - 非同期処理:Promise/Async Function 例えば、出前アプリでピザを注文することをイメージしてみましょう。 ピザを注文すると、
先日、こちらのツイートを見かけました。 それに対して筆者は以下のツイートをしたところ、いくつかの反応が寄せられました。 コード部分を再掲します。 async function foo1() { return await Promise.resolve(); } async function foo2() { return Promise.resolve(); } async function wait() { await null; } // pika // chu // と表示される foo1().then(() => console.log("pika")); wait().then(() => console.log("chu")); // chu // pika // と表示される foo2().then(() => console.log("pika")); wait().the
『マンガでわかるJavaScriptのPromise』は、JavaScriptで通信などの処理を書く際に必須の仕様であるPromiseを、マンガで基礎から学ぶことができる。 『マンガでわかるJavaScriptのPromise』は、マンガ部分は76ページ、コードのまとめやコラム部分は51ページ、全体で167ページの構成で、コールバックを多用するJavaScriptの特徴や、Promise登場の背景、Promiseの仕組みや書き方、async/await、Promiseの静的メソッドまでを解説する。 目次は以下の通り。 第1話「JavaScriptのPromise」 第2話「同期処理と非同期処理」 第3話「コールバック関数」 第4話「コールバック関数のネスト」 第5話「Promiseの概念」 第6話「Promiseを使ったコード」 第7話「Promiseを使ったコード 2」 第8話「reso
Note use フックは 2024 年 4 月現在、React の Canary および experimental チャンネルでのみ利用可能です。 use は、Promise や Context から値を読み取るための React フックです。以下のコードのように Promise の値を同期的に読み取ることができます。 import { use } from "react"; const fetchUsers = async () => { const response = await fetch("/api/users"); return response.json(); }; const Users = () => { const users = use(fetchUsers()); return ( <ul> {users.map((user) => ( <li key={user
ES2015で登場したPromiseとES2017で追加されたasync/awaitによってJavaScriptのコーディングスタイルは大きく変わりました。Promiseの基本的な使い方を理解していることは「脱初心者」のひとつの指標にもなっているようで、網羅的で優れた解説も数多く存在します。 では、基本をおさえた後の活用方法はどうでしょうか？ 実際のところ実務ではライブラリやフレームワークから返却されたPromiseをそのままawaitするだけ…という使い方がほとんどかもしれません。しかし、これらのライブラリやフレームワークの中で利用されているような高度なPromiseの活用法をマスターすれば、もっと自由なプログラミングができるようになります。 この記事ではPromiseを活用した実践的な例を3つ紹介します。いずれもライブラリやフレームワークに類似の機能を持つものはありますが、仕組みを理解
[ English version ] JavaScript と Node.js についてのこの徹底した投稿では、Promises のキャンセルの歴史、なぜNode.jsに関係があるのか、そして async/await APIで使おうとしたときに注意すべきことについて学ぶことができます。 この投稿は、JavaScript の Promise API をよく理解していて、 Node.js の経験がある方のためのものです。 歴史 2014 年に Promise API がブラウザに導入されて以来、人々は Promise で他に何ができるかを調べていました。ブラウザに最初に登場した関連APIは、HTTP リクエストのための fetch() でした。 HTTP リクエストの問題は、サーバーのリソースを消費することであり、サーバーに送信されるリクエストの数が多い場合はお金がかかります。このため、特に
概要 addEventListenerはブラウザ組み込みのAPIの中でも最もよく使われるメソッドの中の一つだと思います。このメソッドはぱっと見で処理がわかりにくく引数にコールバック関数を取るため、初心者の頃に物凄く読みにくいコードを書いた人も多いのではないでしょうか？ addEventListenerが読みにくくなってしまう簡単な例を挙げます。以下のコードのようにAというイベントが発生しないとBというイベントを購読する処理をかけないといったイベント間に依存関係がある場合は、処理が増えるにつれ直感的なコードを書くことが難しくなっていくと思われます。 // <body>より上の位置で<script>にdefer属性なしで書かれてあると思ってください。 document.addEventListener("DOMContentLoaded", () => { console.log("DOMCo
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
サーバーからクライアントへ Promise をそのまま渡せる時代へ！ こんにちは、React の世界は日々進化していますね。最近のアップデートで、Server Component から Client Component へ Promise を返して、さらにデータストリーミングができるようになったんです！ この新機能のおかげで、サーバーで作成した Promise をそのままクライアントに渡し、Suspense と連携させることで、シームレスに非同期データを扱えるようになりました！ どういうこと？ 簡単に言うと、サーバー側で Promise を生成し、そのままクライアント側で use API を使って解決できます。今までなら、サーバーサイドで await してからデータを props として渡す必要がありましたが、これでレンダリングのブロッキングを回避できる可能性が広がります。 こんなコードで
GitHub - alesgenova/post-me: 📩 Use web Workers and other Windows through a simple Promise API
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
The JavaScript Promise Integration (JSPI) API allows WebAssembly applications that were written assuming synchronous access to external functionality to operate smoothly in an environment where the functionality is actually asynchronous. This note outlines what the core capabilities of the JSPI API are, how to access it, how to develop software for it and offers some examples to try out. What is ‘
nextTick vs queueMicrotask vs Promise.resolve vs setTimeout - Qiita
はじめに 普段の開発でなかなかお目にかかることも使うことも滅多にない queueMicrotask について興味を持ったついでに、 process.nextTick や Promise, setTimeout などとの比較をしてみました。 TL;DR 下記の優先度順でキューからタスクが取り出され処理される。 nextTick queueMicrotask, Promise.resolve → Microtask setTimeout → Task (a.k.a. Macrotask) より具体的には、MicrotaskキューとTaskキューの2つのキューがあり、Microtaskキューが優先的に処理されるようになっている。 Microtaskキューが空でない限りはTaskキューの中身を実行しない構造となっており、queueMicrotask, Promise.resolve では Micr
最近リリースされたNode.js 15ではデフォルトの設定が変更され、Unhandled Rejectionが発生した際にプロセスが強制終了されるようになりました。 では、Unhandled Rejectionがいつ発生するのか正確に説明できますか？ この記事では、Unhandled Rejectionに対する正確な理解を目指します。 ECMAScript仕様書で確かめる こういう場合に頼りになる唯一の情報源はECMAScript仕様書、つまりJavaScriptの言語仕様を定める文書です。この記事ではES2020の仕様書を参照します。 仕様書を"unhandled"で全文検索すれば、目的の記述を見つけるのはそう難しいことではありません。それは25.6.1.9 HostPromiseRejectionTrackerです。 これは抽象操作 (abstract operation) です。抽象
GitHub - sindresorhus/p-state: Inspect the state of a promise
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Intro Promise.withResolvers() は、Stage 4 であり ES2024 の候補となった。 すでにブラウザでの実装も進んでいるため、その活用方法を解説する。 イベントの Promise 化 JS では、非同期処理 API は長らくイベントリスナベースで定義され、それを組み合わせるフロー制御で処理されてきた。 しかし、Promise が定義されて以降は、標準 API も Promise を返すようになり、async/await によって処理されるのが一般的になってきた。 結果、イベントリスナベースの API を Promise 化するような場面も増えた。 例えば以下のようなものだ。 async function request() { return new Promise((resolve, reject) => { document.querySelector(
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
API を 1 回だけ呼んであとは同じ結果を得たい場合、値ではなく Promise をキャッシュする - Qiita
REST API の呼び出し結果を、集中的に何度も使いたいような場合、API のレスポンスをキャッシュするのではなく、Promise をキャッシュすることで、API が 1 回だけ呼ばれることを保証できます。 何もキャッシュしない場合 まず最初に、何もキャッシュしない場合を見てみます。 import axios from 'axios' class App { /** * API に GET リクエストを送信するメソッド。何もキャッシュしないバージョンです。 */ async request(url) { return await axios.get(url) } /** * API を使ってなにかするメソッドです。 */ async doSomethingWithAPI(url, index) { const result = await this.request(url) consol
Opinion | Noam Chomsky: The False Promise of ChatGPT (Published 2023)
Jorge Luis Borges once wrote that to live in a time of great peril and promise is to experience both tragedy and comedy, with “the imminence of a revelation” in understanding ourselves and the world. Today our supposedly revolutionary advancements in artificial intelligence are indeed cause for both concern and optimism. Optimism because intelligence is the means by which we solve problems. Concer
誤用しがちな Promise.all
非同期処理を並列実行するときに便利な Promise.all() ですが、雑に使ってしまうと意図した挙動にならないことがあります。 まとめ Promise.all 内で関数を定義する際は即時実行関数式にしなければ実行されない Promise.all に渡す際に await してしまうと意図せず直列処理になってしまう サンプルコード 以下のコードで例示した①・②・③・④のうち、期待した挙動にならないものがあります。 （いずれの実行もエラーにならないものとします） let response; const syncFn = () => {}; const asyncFn = async () => {}; const results = await Promise.all([ // ① syncFn(), // ② asyncFn(), // ③ async () => { const data
let i = 0; console.log(i): //0が出力される i += 1; console.log(i); //1が出力される コメントにて記載の通り、当然ながら0が出力された後に1が出力されるはずです。 つまり、前の処理が終わることを待ってから（処理同士が同期しながら）進んでいく処理のことを同期処理と呼びます。 非同期はこの逆です。つまり、前の処理が終わらなくても先へ進む（処理同士が同期しない）ことを非同期処理と呼んでいると考えることができます。上記のコードはこのままでは非同期的に動くことはありません。非同期処理を行うには"何か特殊なことをしないといけない"のです。 ここまでをまとめると以下のようになります。 プログラムの基本は同期処理 非同期処理をするにはなにか特殊なことをしないといけない （少しだけ寄り道）非同期処理が適しているケースとは？ 以前のコードのような、ちょっ
とほほのPromise入門 - とほほのWWW入門
Promiseとは コールバック地獄 タイミング問題 Promiseによる解決 エラー処理 throwを伴うエラー処理 Finally すべてのタスクが完了したら(Promise.all()) いずれかのタスクが完了したら(Promise.race()) いずれかのタスクが完了したら(Promise.any()) すべてのタスクが成功・失敗に関わらず完了したら(Promise.allSettled()) 非同期関数を同期関数っぽく呼び出す(async/await) for await ... of ... Promiseとは Promise は、JavaScript や Node.js において、非同期処理のコールバック関数をエレガントに記述するための仕組みです。英語の promise は、「制約」、「保障」などの意味を持ちます。Promise は、Chrome 63, Firefox 5
【2025/4】消費者金融・プロミスでポイ活！お得なポイントサイトを比較 | 借入金・借金、PROMISE、ローン
タグ キャンペーン美容金額不明ワインWAON POINT家電2011産ワイン2020年産ワインヴィンテージ不明ドコモ70点台ワインフランス産ワインブログセールアメリカ産ワインリクルート90点台ワインイタリア産ワインマンガ各種攻略産地不明ワインnanaco2023年産ワインチリ産ワインマイル失敗したものネット回線Softbank2014産ワインショッピング買ったものアンケートクーポン2013産ワインオーストラリア産ワイン新規入会旅行お花2016年産ワイン2018年産ワイン動画サービス80点台ワインプレゼントスペイン産ワイン2010年産ワイン食事60点台ワイン楽天ポイント日本産ワインクレジットカード比較してみた59点以下ワインPontaポイント2017年産ワインファッション1000円以下ワイン59点未満dポイントNV（ノンヴィンテージワイン）2019年産ワイン5000～9999円金融Vポイント
こんにちは、CX事業本部の夏目です。 先日、Javascriptの非同期処理に登場するPromiseとasync/awaitをJS初心者に説明する機会がありました。 なので、今回は説明したことを再度噛み砕いてから共有しようと思います。 Promiseの使い方 基本的な使い方 function sleep(sec) { return new Promise((resolve, reject) => { setTimeout(() => { console.log(`wait: ${sec} sec`); resolve(sec); }, sec * 1000); }); } function main() { sleep(2).then((data) => { return sleep(data * 2); }).then((data) => { console.log(`sleep res
JavaScript Promiseについての初学者向け解説 - 概念と操作の基礎 - deve.K's Programming Primer - プログラミング初心者のための入門ブログ
本日はJavaScriptのPromiseの操作とその概念について初学者様に解説致します。 非同期関数 Promise Promiseの状態 Promiseの作成 Promiseをチェーンする方法 Promiseを返す promiseのthenとfinallyの違い より高度な複数のPromise処理 最後に 前提の知識とスキルとして、少なくともES6の関数・高階関数・コールバック関数およびJavaScriptオブジェクトに精通している必要があります。 上記を学び終えてない方は、以下で学習できますので参照ください。 dev-k.hatenablog.com dev-k.hatenablog.com dev-k.hatenablog.com 非同期関数 JavaScriptにおいて非同期処理を行う際には、従来はコールバック関数を利用していました。 しかし、JavaScriptにおいて関数が第
JavaScriptのPromiseを聞いたことはあるでしょうか？ 非同期処理を行うときに使う・・・くらいのことは聞いた人がいるかもしれません。 この記事ではJavaScriptのPromiseを使った何ができるかを、サンプルコードを使いながら解説します。 JavaScriptのPromiseとは何なのかを、非同期処理とコールバックを交えて解説します。 またサンプルコードを使って、Promiseを単独およびチェインで実行する方法から、同時に複数の非同期処理を実行する方法まで解説を行います。 最後にエラーハンドリングについても、簡単に説明します。 Promiseとは PromiseとはJavaScriptにおいて、非同期処理の操作が完了したときに結果を返すものです。 非同期処理とは、ある処理が実行されてから終わるまで待たずに、次に控えている別の処理を行うことです。 なぜこのような仕組みがある
伊藤舞雪写真集 Promise 大型本 前作の「Private」から2年。「彼氏と彼女」の関係を超えためくるめく恋の行方。異国の地で結んだ二人だけの約束からその先へ――。 | 熟女アイドル「未来美麗」のお気に
フェミニンな雰囲気を醸し出す、セクシー系熟女アイドル「未来美麗」がお気に入りの本や映画・ドラマ・グッズなどをご紹介。
はじめに やめ太郎さんによる記事 の末尾で紹介されている、「render hook と Promise を組み合わせた方法」について、簡潔に解説し、そのメリットも併せて述べます。 2番煎じですが、そのネタの提供者は僕なので #@!*... (循環参照エラー) Promise を使うことのメリット Promise を使うことによって、確認ダイアログの「確認ボタン」「キャンセルボタン」を押下したときの操作が、ダイアログ側ではなく、ページ側(ダイアログ呼び出し側) に 記述できるようになります。そのおかげで、深くなりがちな関数呼び出しの階層を浅くして、コードを追いやすくなります。 ▼ こんな風に、簡潔でありながら、 階層が浅く、「モーダル操作と種々の処理」の記述が一つの階層にまとめて記述できています。 const { renderDeleteDialog, confirmDelete } = u
2020/12/16 追記 冒頭の元記事のプログラムを読み間違えていて、真面目に読むといきなり仕様とは異なるプログラムを書いてしまっていますorz その旨を指摘していただいたコメントがコメント欄にあるのですが、そちらの方がコードとしては面白いことになってるのでコメントまで合わせて読むのがおすすめです。 本文 この記事は、以下の記事を読んだ自分の感想です。割と反対意見が多めです。 async/await は Promise を置き換えない あと、元々 C# 畑の人間なので、この記事で TypeScript を使ってますが、もしかしたら冗長な書き方や、そもそも勘違いをしてしまっている可能性があります。その場合はコメントなどで教えてください。 そもそも、async/await は Promise を置き換えるものではなくて、どちらかというと then/catch/finally のメソッドチェー
API 通信などのエラーハンドリングはどうしていますか？ await したものを try/catch で囲む、もしくは Promise の catch を使うなどがありますが、きちんと都度エラーハンドリングしていくとコードが複雑になりがちです。 await-to-js はそういったエラーハンドリングの辛さを解消する手段の1つとして効果的です。 それでは簡単なエラーハンドリングの例を元に説明していきます。 非同期処理のエラーハンドリング 例えば「ユーザーを取得してタスクを保存する」というものを考えてみます。 async function saveUserTask(userId) { // ユーザー取得 const user = await fetchUser(userId); if (!user) { throw new Error("存在しないユーザー"); } // タスク保存 cons
この記事は Zenn の Book の方で公開している『イベントループとプロミスチェーンで学ぶ JavaScript の非同期処理』で収録済みのチャプターから記事として切り出したものになります (チャプター単体でも記事になるものとして判断して公開しています)。 この記事は JavaScript の非同期処理を学習した人間が Promise や非同期処理を介して逆に TypeScript の型注釈を理解しようという試みの記事になります。 実は Promise の型注釈や TypeScript の非同期処理の解説については以下のように既にいくつも有用なリソースがあります。 Promise / async / await | TypeScript入門『サバイバルTypeScript』 イベントループと TypeScript の型から理解する非同期処理 今回は初学者の目線からアウトプットを兼ねて自
【非同期処理】JavaScriptのPromise, async, awaitなどについての整理と使い方 - Qiita
【非同期処理】JavaScriptのPromise, async, awaitなどについての整理と使い方JavaScriptpromise非同期処理asyncawait 非同期処理/同期処理について C言語やPythonから入った私はコードは上から順に実行されるものだと思っていました。しかし、JavaScriptはクライアントサイドの言語であり、 「ページ更新などレスポンスの即時性が求められているため非同期処理である」 とのことです。 ~同期処理とは~ コードを上から順に処理していき、「サーバとのデータのやりとりなど時間がかかる作業を待って次の処理を行う」といったイメージです。 ~非同期処理とは~ 原則的にコードは上から順に処理していきますが、「サーバとのデータのやりとりなど時間がかかる作業と並行して次の処理を行う」 ※詳細なイメージは@don-bu-rakkoさんの以下をご参考にして頂け
'return await promise' vs 'return promise' in JavaScript
You'll see shortly that both expressions do work. However, are there cases when these expressions behave differently? Let's find out! Before I go on, let me recommend something to you because I know that the path to becoming a professional JavaScript developer isn't easy... I recommend certificates.dev’s Official JavaScript Certification — a practical, expert-led program (created in collaboration
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript Visualized - Promise Execution
async/await は Promise を置き換えない - Okapies' Archive
Promiseをthrowするのはなぜ天才的デザインなのか - Qiita
JavaScriptの非同期処理を理解する その2 〜Promise編〜 | さくらのナレッジ
JavaScriptの非同期処理をじっくり理解する (2) Promise
徹底解説！ return promiseとreturn await promiseの違い
『マンガでわかるJavaScriptのPromise』がKindleで無料公開
Promise や Context から値を読み取る use React フック
プログラミングの幅を広げよう！一段上のPromise活用テクニック - ICS MEDIA
Promise のキャンセルについて - Qiita
addEventListenerでリッスンしているイベントをPromise化する
Array.fromAsync()とPromise.all()の違い【JavaScript】 - Qiita
【ES6】 JavaScript初心者でもわかるPromise講座 - Qiita
サーバーからクライアントへ Promise をそのまま渡せる時代へ！ - Qiita
Introducing the WebAssembly JavaScript Promise Integration API · V8
PromiseのUnhandled Rejectionを完全に理解する
Promise.allの親戚たち｜非同期処理を極めよう！Promiseの基礎
Promise.withResolvers によるイベントの Promise 化 | blog.jxck.io
TypeScript: Promise風に振る舞うクラスの作り方 - Qiita
今日こそJavaScriptの非同期処理とPromiseを理解しよう！ - Qiita
JSの初心者にPromiseとasync/awaitの使い方を雑に説明してみる | DevelopersIO
【JavaScript】初心者にもわかるPromiseの使い方 - TECH PLAY Magazine
render hook と Promise を使ってダイアログを含むフローの記述を疎結合に実現する
async/await は Promise を置き換えることは出来ると思う - Qiita
await-to-js で非同期処理(Promise)の try/catch をなくそう - Qiita
TypeScript の基礎から Promise の型注釈まで駆け登る