# Promise

[JS](..) ⟩ [async]() ⟩ Promise

{% hint style="success" %}
[es6](../feature/es6 "mention") \
the <mark style="color:red;">**future**</mark>**&#x20;**<mark style="color:yellow;">**result**</mark> of an [**async**]() operation.

```javascript
let p = promise.then(onFulfilled, onRejected)
```
{% endhint %}

{% tabs %}
{% tab title="🔸 定義" %}
<img src="https://2527454625-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MfvEFZnSBhKT6fJmus0%2Fuploads%2Fe7PZTIP1ma7WokjFhgUk%2Ffile.drawing.svg?alt=media&#x26;token=1e3d0340-ffd6-41e6-a2ac-658296149284" alt="" class="gitbook-drawing">

{% hint style="success" %}
if we have：

```javascript
let p = promise.then(onResolved, onRejected)
```

we say p is：

* <mark style="color:purple;">**resolved**</mark> if **onResolved()** is called.
  * <mark style="color:green;">**fulfilled**</mark> if **onResolved()** returns a **non-Promise** value.
* <mark style="color:red;">**rejected**</mark> if <mark style="color:red;">`onRejected()`</mark> is called.
* <mark style="color:orange;">**settled**</mark> if it's <mark style="color:green;">**fulfilled**</mark> **or** <mark style="color:red;">**rejected**</mark>.
* <mark style="color:yellow;">**pending**</mark> if it's **neither** <mark style="color:green;">**fulfilled**</mark> **nor** <mark style="color:red;">**rejected**</mark>.
{% endhint %}

{% hint style="warning" %}
Any <mark style="color:orange;">**settled**</mark> Promise has an associated <mark style="color:yellow;">**value**</mark> , which <mark style="color:red;">**won't change**</mark>.
{% endhint %}
{% endtab %}

{% tab title="🔴 主題" %}
* [using-promises](promise/using-promises "mention")
  * [getjson](promise/custom-promises/getjson "mention") - get JSON ([promise](promise "mention")) from [url](../../browser/api/url "mention").
* [error-handling](promise/error-handling "mention")
  * [recoverable-errors](promise/error-handling/recoverable-errors "mention")
  * [finally](promise/error-handling/finally "mention")
* [chaining](promise/chaining "mention")
* [in-parallel](promise/in-parallel "mention")
{% endtab %}

{% tab title="👥 相關" %}
* [es2018](../feature/es2018 "mention") - [await](../grammar/statement/loop/for/await "mention"), [finally](promise/error-handling/finally "mention")
* [await](await "mention")
* [promises](await/promises "mention")
* [promise.wait](promise/custom-promises/promise.wait "mention")
* [promise.inseries](promise/chaining/promise.inseries "mention")
* [in-parallel](promise/in-parallel "mention")
* [functions](async/functions "mention")
* [methods](async/methods "mention")
{% endtab %}

{% tab title="📗 參考" %}
* [ ] JavaScript: The Definitive Guide (13.2 Promises)
* [ ] amazon.jp ⟩ [マンガでわかる JavaScript の Promise](https://www.amazon.co.jp/dp/B09XQ89M9Y/ref=olp-opf-redir?aod=1) ([Kindle Cloud Reader](https://read.amazon.co.jp/manga/B09XQ89M9Y?ref_=dbs_t_r_mwr))
{% endtab %}

{% tab title="📘 手冊" %}
* [Promise.resolve()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/resolve)
* [Promise.reject()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/reject)
{% endtab %}
{% endtabs %}
