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
100秒で理解するPromise
そもそも非同期処理とは？ Promiseについて知るためには、まず非同期処理について知っておく必要があります。 以下の動画で、非同期処理について100秒で解説しているので、そもそも非同期処理をよく知らないなぁという人はぜひ確認してみてください！ Promiseとは では、本題です。 Promiseとは、ES2015で導入された、非同期処理の状態や結果を表現するオブジェクトのことです。 PromiseはES2015で導入された非同期処理の状態や結果を表現するビルトインオブジェクトです。 非同期処理はPromiseのインスタンスを返し、そのPromiseインスタンスには状態変化をした際に呼び出されるコールバック関数を登録できます。 jsprimer - 非同期処理:Promise/Async Function 例えば、出前アプリでピザを注文することをイメージしてみましょう。 ピザを注文すると、
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.id}>
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.querySelect
テキストでの攻防が功を奏したのか、今朝、リフォーム業者のおじさんとその長男くんが、なんと、きっかり午前８時に現れたｗ 今日は、玄関ドアーの取り付け日である。 これはもともと、想像以上に延びに延びた地下室のリフォームのお詫びとして、おじさん自らが申し出たことであって、私たち夫婦からお願いした訳ではない。だから、テキストでおじさんが「ドアーの取り付けだって、エクストラでやってあげることだから」と言ってきた時には、それはもう気の強い私はブチッとキレたのであった。 でもまあ、お互い大人なので、笑顔で挨拶するし、small talkくらいならするのだ。 ということで、午前中に古いドアーの取り外しから新しいドアーの取り付けまで、あっという間に済んでしまった。 おじさん達の話では、家を建てた建築業者のドアーの取り付け方は、今までに見たことが無いほど杜撰なものだったらしい💦 ドアーが間柱にきちんと打ち付
初めまして、現在プログラミングスクールで学習中のやまちゃんと申します。 Reactを勉強してみたいなと思っていましたが、そもそもJavaScriptの基礎を さらっとしか触れていなかったので勉強することにしました。 その中で非同期処理において大事だと言われるPromiseについて少し調べてみました。 今回はcatAPIを用いて猫画像を取得する非常にシンプルなコードで見ていこうと思います。 catAPIについては下記を参照ください！ catAPI ※ この記事は「RUNTEQ Advent Calendar 2023」の21日目を担当した記事です。 そもそも非同期処理とは？ JavaScriptでは基本一つの処理が完了するまで他の作業はできませんが、 非同期処理は一つの作業をしている間に他の作業ができるようにした仕組みの事です。 参考記事 非同期処理とは何か、何が嬉しいの？ Promiseと
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript Visualized - Promise Execution
Promise や Context から値を読み取る use React フック
Promise.withResolvers によるイベントの Promise 化 | blog.jxck.io
promise made, promise kept. - My Rustic Style
【JavaScript】Promise 〜 初めてのAPI操作 〜 - Qiita