JavaScriptのresolve()とは?Promiseの基礎から使い方まで徹底解説

JavaScriptの非同期処理において、resolve()は非常に重要な役割を持つ関数です。
Promiseを正しく理解するためには、このresolve()の動きを押さえることが欠かせません。
本記事では、resolve()の基本から実践的な使い方まで、初心者でも理解できるように丁寧に解説します。
Contents
resolve()とは何か
Promiseにおける役割
resolve()は、Promiseを「成功状態(fulfilled)」にするための関数です。
Promiseは以下の3つの状態を持ちます。
- pending(保留中)
- fulfilled(成功)
- rejected(失敗)
resolve()が呼ばれると、Promiseは「成功」として処理され、.then()へ値が渡されます。
resolve()の基本構文
Promiseの中での使い方
// index.js
const promise = new Promise((resolve, reject) => {
resolve("成功しました");
});
promise.then((value) => {
console.log(value);
});実行結果
成功しましたこのように、resolve()に渡した値は.then()で受け取ることができます。
resolve()の流れを理解する
処理の順序
// index.js
const promise = new Promise((resolve, reject) => {
console.log("処理開始");
resolve("完了");
console.log("resolveの後");
});
promise.then((value) => {
console.log("then:", value);
});実行結果
処理開始
resolveの後
then: 完了ポイント
resolve()は即時に状態を変更する.then()は後から実行される(非同期的にキューに入る)
この挙動は非同期処理の理解において重要です。
resolve()に値を渡す意味
データの受け渡し
// index.js
const promise = new Promise((resolve, reject) => {
const data = { name: "JavaScript", level: "basic" };
resolve(data);
});
promise.then((value) => {
console.log(value.name);
});実行結果
JavaScriptresolve()は、非同期処理の結果を次の処理へ渡すための仕組みです。
resolve()とreject()の違い
成功と失敗の分岐
// index.js
const promise = new Promise((resolve, reject) => {
const isSuccess = true;
if (isSuccess) {
resolve("成功");
} else {
reject("失敗");
}
});
promise
.then((value) => {
console.log(value);
})
.catch((error) => {
console.log(error);
});ポイント
resolve()→ 成功時の処理へreject()→ エラー処理へ
詳細は以下の記事で整理すると理解が深まります。
👉 JavaScriptのtry/catchとは?エラー処理の基本を解説
Promise.resolve()との違い
静的メソッドとの比較
resolve()には2種類あります。
- コンストラクタ内の
resolve Promise.resolve()
// index.js
const promise = Promise.resolve("即時成功");
promise.then((value) => {
console.log(value);
});実行結果
即時成功違いのまとめ
| 種類 | 役割 |
|---|---|
| resolve(関数) | Promiseの中で成功を通知 |
| Promise.resolve | 即座に成功状態のPromiseを作成 |
resolve()のよくある注意点
resolveの後の処理
// index.js
new Promise((resolve, reject) => {
resolve("完了");
console.log("この処理も実行される");
});resolve()を書いた後でも、その下のコードは実行されます。
複数回呼んでも意味はない
// index.js
new Promise((resolve, reject) => {
resolve("1回目");
resolve("2回目");
}).then((value) => {
console.log(value);
});実行結果
1回目最初の1回だけが有効になります。
非同期処理と組み合わせる
// index.js
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("3秒後に成功");
}, 3000);
});
promise.then((value) => {
console.log(value);
});resolve()は非同期処理の完了タイミングで使うことが多いです。
resolve()とthen()の関係
値がチェーンされる仕組み
// index.js
Promise.resolve(1)
.then((value) => {
return value + 1;
})
.then((value) => {
return value + 1;
})
.then((value) => {
console.log(value);
});実行結果
3resolve()で渡された値は、.then()を通して次々と処理されます。
詳細は以下の記事で解説しています。
👉 JavaScriptのthenとは?Promiseチェーンの基本
resolve()はいつ使うのか
主な用途
- 非同期処理の完了通知
- API通信の成功結果を返す
- 処理結果を次に渡す
例:擬似API処理
// index.js
function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("データ取得成功");
}, 1000);
});
}
fetchData().then((result) => {
console.log(result);
});async/awaitとの関係
resolveはreturnと同じ役割
// index.js
async function sample() {
return "成功";
}
sample().then((value) => {
console.log(value);
});実行結果
成功async関数のreturnは、内部的にresolve()と同じ働きをします。
まとめ
resolve()はPromiseを成功状態にする関数- 値は
.then()に渡される - 非同期処理の完了を通知するために使う
Promise.resolve()は即時に成功するPromiseを作る

