JavaScript で then を使うのは避けよう（await / async の初級者まとめ）

2024/05/17 279 users await async then 文法 非同期処理

JavaScript において、特に苦手とする人が多い印象のある Promise ですが、await と async の文法が導入されたことで、Promise の仕様を深く理解しなくても非同期処理を自然に書けるようになってきたのではないかと思います。 極論ですが、JavaScript の非同期処理は async await new Promise のみで、（ほぼ）全て表現... 続きを読む

100秒で理解するPromise

2024/04/01 118 users 本題 非同期処理 ES2015 以下 動画

そもそも非同期処理とは？ Promiseについて知るためには、まず非同期処理について知っておく必要があります。 以下の動画で、非同期処理について100秒で解説しているので、そもそも非同期処理をよく知らないなぁという人はぜひ確認してみてください！ Promiseとは では、本題です。 Promiseとは、ES2015で導入された、非... 続きを読む

async/awaitにおけるエラー処理を実行の順番から整理する - Qiita

2023/08/08 174 users await エラーハンドリング async Qiita 殆ど

はじめに promiseを使うとき、いつもpromiseメソッドチェーンで記載していますか？　async/awaitを利用していますか？ もちろん状況によって両方書くのが殆どだとは思うのですが、私はasync/awaitの方が同期的な書き方ゆえに読みやすいため、なるべくそちらで記載しています。しかしながら、エラーハンドリングが理解で... 続きを読む

イベントループと TypeScript の型から理解する非同期処理

2022/04/21 173 users イベントループ TypeScript アプローチ 非同期処理

この本は、ブルーベリー本の 8 章からインスパイアされて、 TS の型が示す情報から Promise というものを理解してみる、というアプローチで書いたJSの非同期処理の解説です。 これらの資料と合わせて読むことを推奨します。 JSのイベントループのイメージを掴む JSでは中々意識することが少ないですが、正しく理解するに... 続きを読む

JavaScriptの非同期処理をじっくり理解する (2) Promise

2021/10/03 186 users ベストプラクティス 動機 実装 実行順序 詳しい仕組み

対象読者と目的 非同期処理の実装方法は知っているが、仕組みを詳しく知らないのでベストプラクティスがわからないときがある 実行順序の保証がよくわからないので自信をもってデプロイできない変更がある より詳しい仕組みを理解することでより計画的な実装をできるようになりたい という動機で書かれた記事です。同様... 続きを読む

async/await は Promise を置き換えない - Okapies' Archive

2020/12/13 248 users await async Okapies 幻想 archive

まとめ async/await 構文は、Promise で書ける処理のうち特定のケースしか表現できない 特定のケースとは、ある非同期処理の前処理と後処理がそれぞれ 1 個ずつの場合のみである async/await 構文は初心者に非同期処理を導入する際に適しているが、非同期処理を逐次処理として書けるという幻想を与えるので、どこかで知... 続きを読む

Promiseをthrowするのはなぜ天才的デザインなのか - Qiita

2020/09/01 222 users Qiita コンポーネ React 代名詞 デザイン

ReactのConcurrent Modeが最初に発表されたのはもう1年近くも前のことです（2020年9月現在）。Concurrent Modeはたいへん奥深い機能で正式版がたいへん待ち遠しいですが、Concurrent Modeの代名詞として多くのReactユーザーに知られているのはPromiseをthrowするというAPIデザインです。Concurrent Modeでは、コンポーネ... 続きを読む

4歳娘「パパ、Promiseやasync/awaitって何？」〜Promise編〜 - Qiita

2020/05/17 389 users ヤツ 非同期 休日 ワイ 非同期処理

とある休日 娘（4歳）「ねえパパ」 ワイ「なんや、娘ちゃん？」 娘「非同期って何？」 ワイ「ひ、非道鬼！？」 娘「そうそう、非同期処理とかいうやつ」 ワイ「非道鬼を処理やて・・・！？」 非道鬼「ヴォ〜〜〜！！！」 娘「！？」 娘「・・・現れたわね、非道鬼」 娘「処理してあげる」 ワイ「娘ちゃん、まだ4歳なのに... 続きを読む

JavaScript Promiseの本 v2リリース、ES2015+に対応、Async Functionの章を追加 | Web Scratch

2019/10/23 183 users async function Web scratch 追加

JavaScriptのPromiseについて学ぶ書籍であるJavaScript Promiseの本 v2をリリースしました。 Promise本 1.0.0をリリースしたのは2014年6月ですが、そこから少しづつアップデートしていました。 JavaScript Promiseの本を書きました | Web Scratch ES6がリリースされたのでPromiseについて学びましょう | Web Scratch 今... 続きを読む

私が async/await、promise をちゃんと理解するまでのステップ１，２，３ - Qiita

2019/04/28 409 users await resolve reject async 事柄

これは何？ javascript の async/await を使いこなすために必要な事柄について、私なりに説明したものです。 書いてあること ステップ１）await 使えば待ってくれる 必要最小限の async/await、及び、エラーの catch の話 ステップ２）promise というもの promise の中には「正常データ = resolve」と「エラー = reject... 続きを読む

JavaScript Promiseの本を書きました | Web Scratch

2018/11/11 271 users JavaScript Promise パターン テスト 書籍

JavaScript Promiseの本という無料で読める電子書籍を書きました。 タイトルそのままで、JavaScriptのPromiseについて書いた書籍です。 書籍の目的 この書籍を読むことで学べる事として、次の3つを目標にして書きました。 Promiseについて学び、パターンやテストを扱えるようになる事 Promiseの向き不向きについて学び、... 続きを読む

Promise と async/await の理解度をもう1段階上げる - Qiita

2018/05/01 121 users await async PROM Qiita 悲運

はじめに 表題のモチベーションで書き上げた備忘録に加筆・修正したものを記事にしました。 記事を読んで下さった方の Promise, async/await の理解度が 1LV でもアップしてくれたら嬉しいなと思います。 Promise とは Promise は非同期関数を扱うためのインターフェース Promise は 悲運のピラミッド型コールバック （ネスト地獄）を根本的に解決してくれる Prom... 続きを読む

2018年に見直した現代的なJavaScriptの記法を紹介するぜ - ICS MEDIA

2018/02/21 485 users ICS MEDIA JavaScript const 記法

2015年6月にECMAScript 2015がリリースされて以降、JavaScriptの機能は大きく強化されました。 const / let 、アロー関数、クラス構文、 Promise などが有名なところですが、ES2016、ES2017、ES2018、そして更にその先へJavaScriptの仕様は日々進化しています。筆者は ここ数年JavaScript（主にTypeScript）の開発を進めて... 続きを読む

Vim script で ES6 Promise 実装した - はやくプログラムになりたい

2017/12/18 65 users Vim script プログラム 実装 ES6 最後

2017 - 12 - 19 Vim script で ES6 Promise 実装した Vim Vim Advent Calendar 2017 の19日目の記事です． Vim script で ES6 の Promise を実装した話を書きます． もし Vim script が分からなくても，最後の章「Promise の実装の詳細」は Vim script とは独立した内容になっているので，P... 続きを読む

Promise で排他制御を行う - Qiita

2017/09/28 51 users npm Qiita mutex synchronized 構文

Promise での非同期処理時、排他制御を怠ったばっかりにバグを出してしまった、そんな経験ありませんか。私はあります。 スレッドを使う場合、Mutex や synchronized 等々、大抵排他制御を行うライブラリや構文などがセットでついてくるのですが、Promise/A+ には無いので自前で制御する必要がある。 なので、Promise で排他制御が出来るライブラリを npm から調べ、めぼし... 続きを読む

おーい磯野〜 callback使ってる関数をPromiseでラップしてasync/awaitで書こうぜ〜 - taiki-t's diary

2017/09/05 57 users await resolve async setTimeout

2017 - 03 - 31 おーい磯野〜 callback使ってる関数をPromiseでラップしてasync/awaitで書こうぜ〜 JS 例1 const sleep = (ms) => { return new Promise(resolve => setTimeout(resolve, ms)); } const something = async () => { await sleep(... 続きを読む

util.promisify が追加された - from scratch

2017/05/10 101 users from Scratch github.com 関数 コア

2017 - 05 - 10 util.promisify が追加された Node.js のコアに util.promisify が追加された。 github.com 今回は util.promisify が持つ役割を中心に Node.js における Promise の立場についても話していけるといいと思う。 util.promisify とは 読んで字のごとく関数を Promise に変換してく... 続きを読む

async await に書き換えて、Promiseと 同期による例外の区別でハマった - Qiita

2017/04/25 57 users Qiita then catch load TRY

// async function の中 try { load (). then ( data => { console . log ( data ) }). catch ( e => { // ... }) } catch ( e ) { // ... 例外処理 } わかりやすく簡単にしている。実際にはもっと複雑なコードだった。Promise にすれば try と catch を一本化して綺麗に... 続きを読む

AsyncとAwait : コールバック地獄を避けるための最新のやり方、そしてその未来 | プログラミング | POSTD

2016/07/04 271 users await POSTD async プログラミング 未来

JavaScript、特にNode.jsといえば、コールバック地獄がよく連想されます。以下では、これを避けるためにPromiseにasync / awaitを組み合わせて書く方法をご紹介しますが、これらの新しい機能を本番環境で使った経験から得た教訓についてもお話ししたいと思います。JavaScript、特にNode.jsといえば、 コールバック地獄 がよく連想されます 1 。たくさんの非同期I/O... 続きを読む

ECMAScript6のアロー関数とPromiseまとめ - JavaScript - Qiita

2016/01/22 82 users Qiita アロー関数 まえ ECMAScript6 鉄板

はじめに この記事ではアロー関数とpromiseについての、使い方のまとめです。とくにpromiseに関しては、非同期処理の鉄板、async.jsとの比較をしながらその実装方法を見ていきます。 そのまえに、ECMAScript6の基本構文はこちら。 ECMAScript6の基本構文まとめ - JavaScript 技術情報のみつぶやくアカウント作成しました。ECMAScript6などの最新情報も追... 続きを読む

はてなで新しくWebサービスを作るときのインフラの作り方 - Hatena Developer Blog

2015/12/17 715 users インフラ はてな yashigani WEBサービス 作り方

2015 - 12 - 17 はてなで新しくWebサービスを作るときのインフラの作り方 この記事は はてなデベロッパーアドベントカレンダーを始めます - Hatena Developer Blog の17日目の記事です．昨日は id:yashigani_w の Promiseを学ぶためにSwiftでPromiseを実装してみた話 - yashigani?.days でした． こんにちは、はてなの ... 続きを読む

もうはじめよう、ES6~ECMAScript6の基本構文まとめ(JavaScript)~ - Qiita

2015/12/04 115 users Twitter Qiita Let オブジェクト 後編

JavaScriptにおける、ECMAScript6についてのまとめの前編です。promiseなどの組み込みオブジェクトは後編までお待ちを。またこの記事では、実践で使える情報のみまとめています。網羅的にすべてをまとめている情報ではありません。 技術系Twitter 技術情報のみつぶやくアカウント作成しました。ECMAScript6の最新情報などを追っていきます。 Twitterはこちら letによ... 続きを読む

Promiseで簡単！JavaScript非同期処理入門【後編】 | HTML5Experts.jp

2015/10/05 70 users Ajax おさらい API 後編 連載

連載： ECMAScript 2015（ECMAScript 6）特集 (5)前回に引き続き、ECMAScript 2015（ECMAScript 6）で新たに追加されたPromiseについて、その概要を全2回に渡って紹介します。今回は後編です。 前回のおさらい 前回は、こんなふうにPromiseを使うという例を紹介しました。それは、以下のようにAjaxでAPIにアクセスする例でした。 var f... 続きを読む

Promiseのアレ

2015/09/16 50 users アレ

A framework for easily creating beautiful presentations using HTML 続きを読む

JavaScript - ES async/awaitを全力で使ってみて発見したイディオム - Qiita

2015/09/14 63 users await GENERATOR Qiita イディオム 手元

手元の趣味コード(諸事情により未公開)に向けて全力で適用してみた結果学びがあった。以下babel。 事前に確認 async/await は Promise と Generator の糖衣構文である await は Promiseのインスタンスの式を与えると(見た目上)停止する await するには async functionで囲う必要がある async function は必ず非同期で実行され ... 続きを読む