From 60ed7e4d5f47e75a4134321330bc11cea55ddb5f Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Sun, 23 Jan 2022 20:33:07 +0900 Subject: 2022/01/02 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../global_objects/promise/promise/index.md | 146 +++++++++++---------- 1 file changed, 77 insertions(+), 69 deletions(-) (limited to 'files/ja/web') diff --git a/files/ja/web/javascript/reference/global_objects/promise/promise/index.md b/files/ja/web/javascript/reference/global_objects/promise/promise/index.md index 1b7dccdfca..3da308272c 100644 --- a/files/ja/web/javascript/reference/global_objects/promise/promise/index.md +++ b/files/ja/web/javascript/reference/global_objects/promise/promise/index.md @@ -2,106 +2,114 @@ title: Promise() コンストラクター slug: Web/JavaScript/Reference/Global_Objects/Promise/Promise tags: - - Constructor + - コンストラクター - JavaScript - Promise - - Reference + - リファレンス + - ポリフィル +browser-compat: javascript.builtins.Promise.Promise translation_of: Web/JavaScript/Reference/Global_Objects/Promise/Promise --- -
{{JSRef}}
+{{JSRef}} -

Promise コンストラクターは、主にまだプロミスに対応していない関数をラップするために使用します。

+**`Promise`** コンストラクターは、主にまだプロミスに対応していない関数をラップするために使用します。 -
{{EmbedInteractiveExample("pages/js/promise-constructor.html", "taller")}}
+{{EmbedInteractiveExample("pages/js/promise-constructor.html", "taller")}} - +## 構文 -

構文

+```js +new Promise(executor) +``` -
new Promise(executor)
-
+### 引数 -

引数

+- `executor` -
-
executor
-
新しい Promise オブジェクトを構築する過程でコンストラクターによって呼び出される {{jsxref("function")}} です。 executor は結果をプロミスに結びつけるカスタムコードです。プログラマーが executor を書きます。この関数の形式は次のようなものであると期待されます。
-
- 
function(resolutionFunc, rejectionFunc){
-    // 通常、いくつかの非同期操作。
-}
-
-
-
コンストラクターが新しい Promise オブジェクトを生成するとき、 resolutionFunc と rejectionFunc の一対の関数も生成します。これらは Promise オブジェクトに「結束」されます。従って、 executor の中のコードが何らかの操作を実行し、その操作の結果を (値が別の Promise オブジェクトでない場合) 「満足」または「拒否」として、それぞれ resolutionFunc または rejectionFunc のどちらかを呼び出すことで反映する機会を持っています。
-
executor は意味のある返値を持ちません。これは resolutionFunc または rejectionFunc を使用することの副作用を介して通信します。この副作用とは、 Promise が「解決済み」になることです。
-
通常は、次のように動作します。 executor の内部の走査は非同期であり、コールバックを提供します。コールバックは executor のコード内で定義されます。コールバックは、 resolutionFunc を呼び出すことで終了します。 resolutionFunc の呼び出しには、引数 value が含まれます。 value は、結束された Promise オブジェクトに渡されます。 Promise オブジェクトは (非同期的に) それに関連付けられた任意の .then() を呼び出します。 .then() によって受け取った value は、 handleFulfilled の呼び出しに入力引数として渡されます (「連鎖したプロミス」の節を参照)。
-
また、 executor はエラー時に rejectionFunc を呼び出す try{} catch() ブロックを含む可能性があります。
-
これらの2つの関数の呼び出し形式は単純で、あらゆる型の引数を1つだけ取ります。もちろん、これらの関数の実際の名前は好きにしてよく、すなわち、 executor の引数として名づけます。どちらの関数も必要な時に呼び出すために使用します。
-
+ - : 新しい `Promise` オブジェクトを構築する過程でコンストラクターによって呼び出される関数 ({{jsxref("function")}}) です。 `executor` は結果をプロミスに結びつけるカスタムコードです。プログラマーが `executor` を書きます。この関数の形式は次のようなものであると期待されます。 + + ```js + function(resolutionFunc, rejectionFunc){ + // 通常は非同期操作です。 + } + ``` + + `resolutionFunc` と `rejectionFunc` も関数で、実際には好きな名前を付けることができます。呼び出し形式は単純で、単一の任意の型の引数を受け付けます。 + + + ```js + resolutionFunc(value) // 解決した時に呼び出し + rejectionFunc(reason) // 拒否した時に呼び出し + ``` + + `resolutionFunc` の `value` 引数は他のプロミスオブジェクトにすることもでき、そうするとそのプロミスは[プロミス連鎖](/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise#chained_promises)の中に動的に挿入されます。 -
-
- 
resolutionFunc(value) // 満足したときに呼び出される
-rejectionFunc(reason) // 拒否されたときに呼び出される
+ `executor` については、以下のことを理解することが重要です。 -

返される value は、プロミスをチェーンに動的に挿入するために、別なプロミスオブジェクトにすることができます。

-
-
+ - `executor` の返値は無視されます。 + - `executor` の中でエラーが発生した場合、プロミスは拒否されます。 -

返値

+ つまり、 `executor` の中のコードが効果を発揮する仕組みは、次のようなものです。 -

new を通じて呼び出された場合、 Promise コンストラクターはプロミスオブジェクトを返します。このプロミスオブジェクトは、 resolutionFunc 関数または rejectionFunc 関数が呼び出されると「解決」になります。なお、 resolutionFunc または rejectionFunc を別な Promise オブジェクトを引数にして呼び出すと、これが「解決」であると言えますが、「満足」であるとは言えません。

+ - コンストラクターが新しい `Promise` オブジェクトを生成した時点で、対応する `resolutionFunc` と `rejectionFunc` の一対の関数も生成されます。これらは `Promise` オブジェクトに「結束」されます。 + - `executor` 内のコードは、何らかの操作を行う機会を得、その結果を（値が他の Promise オブジェクトでない場合）「解決済み」または「拒否済み」として反映し、それぞれ `resolutionFunc` または `rejectionFunc` を呼び出して終了します。 + - つまり、`executor` 内のコードは、 `resolutionFunc` や `rejectionFunc` による副次的影響を介して通信を行います。その副次的影響とは、 `Promise` オブジェクトが「解決済み」または「拒否済み」になることです。 -

例

+ 以上のことを踏まえて、典型的な流れをまとめてみました。 -

新しい Promise の作成

+ 1. `executor` の中の操作は非同期であり、コールバックを提供します。 + 2. コールバックは `executor` コードの中で定義されます。 + 3. コールバックは `resolutionFunc` を呼び出して終了します。 + 4. `resolutionFunc` の呼び出しには `value` 引数が含まれます。 + 5. `value` は繋がっている `Promise` オブジェクトに送り返されます。 + 6. `Promise` オブジェクトは（非同期に）関連付けられた `.then(handleResolved)` を呼び出します。 + 7. `.then(handleResolved)` から受け取った `value` は、 `handleResolved` の呼び出しで入力引数として渡されます（[プロミスの連鎖](/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise#chained_promises)を参照してください）。 -

Promise オブジェクトは new キーワードとコンストラクターで作成されます。コンストラクターは executor 関数と呼ばれる引数を取ります。 executor 関数は 2 つの関数を引数として取ります。1 つめの関数 (resolve) は非同期タスクが成功して完了した場合に呼び出され、タスクの結果を値として返します。2 つめの関数 (reject) はタスクが失敗した場合に呼び出され、失敗した理由 (典型的には error オブジェクト) を返します。

+### 返値 -
const myFirstPromise = new Promise((resolve, reject) => {
-  // do something asynchronous which eventually calls either:
+`new` を通じて呼び出された場合、 `Promise` コンストラクターはプロミスオブジェクトを返します。このプロミスオブジェクトは、 `resolutionFunc` 関数または `rejectionFunc` 関数が呼び出されると「解決」になります。なお、 `resolutionFunc` または `rejectionFunc` を別な Promise オブジェクトを引数にして呼び出すと、これが「解決」であると言えますが、「満足」であるとは言えません。
+
+## 例
+
+### 新しい Promise の作成
+
+`Promise` オブジェクトは `new` キーワードとコンストラクターで作成されます。コンストラクターは「executor 関数」と呼ばれる引数を取ります。 これは 2 つの関数を引数として取ります。 1 つ目の関数 (`resolve`) は非同期タスクが成功して完了した場合に呼び出され、タスクの結果を値として返します。2 つ目の関数 (`reject`) はタスクが失敗した場合に呼び出され、失敗した理由（ふつうはエラーオブジェクト）を返します。
+
+```js
+const myFirstPromise = new Promise((resolve, reject) => {
+  // 次のどちらかを呼び出す非同期処理を行います。
   //
-  //   resolve(someValue)        // fulfilled
-  // or
-  //   reject("failure reason")  // rejected
+  //   resolve(someValue)        // 履行
+  // または
+  //   reject("failure reason")  // 拒否
 });
-
+``` -

Promise を返す関数の作成

+### Promise を返す関数の作成 -

関数に Promise 機能を提供するには、次のように単に Promise を返すようにします。

+関数にプロミス機能を提供するには、次のように単にプロミスを返すようにします。 -
function myAsyncFunction(url) {
-  return new Promise((resolve, reject) => {
+```js
+function myAsyncFunction(url) {
+  return new Promise((resolve, reject) => {
     const xhr = new XMLHttpRequest()
     xhr.open("GET", url)
-    xhr.onload = () => resolve(xhr.responseText)
-    xhr.onerror = () => reject(xhr.statusText)
+    xhr.onload = () => resolve(xhr.responseText)
+    xhr.onerror = () => reject(xhr.statusText)
     xhr.send()
   });
-}
+} +``` -

仕様書

+## 仕様書 - - - - - - - - - - - -
仕様書
{{SpecName('ESDraft', '#sec-promise-constructor', 'Promise コンストラクター')}}
+{{Specifications}} -

ブラウザーの互換性

+## ブラウザーの互換性 -

{{Compat("javascript.builtins.Promise.Promise")}}

+{{Compat}} -

関連情報

+## 関連情報 - +- `Promise` のポリフィルは [`core-js`](https://github.com/zloirock/core-js#ecmascript-promise) で利用できます +- [プロミスの使用](/ja/docs/Web/JavaScript/Guide/Using_promises) -- cgit v1.2.3-54-g00ecf