PR

【JavaScript/JS】Promiseの使い方(then/resolve/reject)

JavaScript
この記事にはアフィリエイト広告および広告が含まれています。

こんにちは。今回は非同期処理で使うPromiseについて、使い方を紹介していきます。

Promiseは同期、非同期処理の考え方が分からないとチンプンカンプンになってしまうので、よく分からない方は先にこちらの記事をご覧ください。

Promiseは非同期処理が完了した後に結果を返しています。
それでは、基本的な記述方法から始めていきましょう。

基本的な「Promise」の書き方

まずは、Promiseオブジェクトを生成することです。
newでPromiseのオブジェクトを、objに設定します。

var obj = new Promise(function(resolve, reject) {
    resolve("成功");
});

また、Promiseの引数の関数では、二つの関数を引数として取ることができ、それぞれ以下の状態での処理を実施することができます。

・resolve:処理成功時の処理
・reject:処理失敗時の処理

「then」を使ってコールバック処理を実行する方法

続いて、Promiseでthenを使用してコールバック処理を実行してみましょう。

var promise_obj = new Promise(function(resolve, reject) {
    resolve();
});

promise_obj.then(function(success, failure) {
    console.log("こっちが後に出力されるよ");
});

console.log("こっちが先に出力されるよ");

then関数はPromiseが返され、処理が成功もしくは失敗した場合にコールバック関数を取ります。

また、Promise.then()は非同期処理のため、6行目の方が先に処理として登録されますが、8行目の方が先に実行されます。
このように、非同期処理では時間がかかる処理が終わる前に後の処理が完了することがあります。

いかがでしたでしょうか。
今回はPromiseを使って基本的な非同期処理の制御方法について、ご紹介していきました。
他にもさまざまな関数が使用できるので、良かったら試してみてください。

タイトルとURLをコピーしました