# Promise

[JS](https://lochiwei.gitbook.io/web/js) ⟩ [async](https://lochiwei.gitbook.io/web/js/async) ⟩ Promise

{% hint style="success" %}
[es6](https://lochiwei.gitbook.io/web/js/feature/es6 "mention") \
the <mark style="color:red;">**future**</mark>**&#x20;**<mark style="color:yellow;">**result**</mark> of an [**async**](https://lochiwei.gitbook.io/web/js/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](https://lochiwei.gitbook.io/web/js/async/promise/using-promises "mention")
  * [getjson](https://lochiwei.gitbook.io/web/js/async/promise/custom-promises/getjson "mention") - get JSON ([promise](https://lochiwei.gitbook.io/web/js/async/promise "mention")) from [url](https://lochiwei.gitbook.io/web/browser/api/url "mention").
* [error-handling](https://lochiwei.gitbook.io/web/js/async/promise/error-handling "mention")
  * [recoverable-errors](https://lochiwei.gitbook.io/web/js/async/promise/error-handling/recoverable-errors "mention")
  * [finally](https://lochiwei.gitbook.io/web/js/async/promise/error-handling/finally "mention")
* [chaining](https://lochiwei.gitbook.io/web/js/async/promise/chaining "mention")
* [in-parallel](https://lochiwei.gitbook.io/web/js/async/promise/in-parallel "mention")
  {% endtab %}

{% tab title="👥 相關" %}

* [es2018](https://lochiwei.gitbook.io/web/js/feature/es2018 "mention") - [await](https://lochiwei.gitbook.io/web/js/grammar/statement/loop/for/await "mention"), [finally](https://lochiwei.gitbook.io/web/js/async/promise/error-handling/finally "mention")
* [await](https://lochiwei.gitbook.io/web/js/async/await "mention")
* [promises](https://lochiwei.gitbook.io/web/js/async/await/promises "mention")
* [promise.wait](https://lochiwei.gitbook.io/web/js/async/promise/custom-promises/promise.wait "mention")
* [promise.inseries](https://lochiwei.gitbook.io/web/js/async/promise/chaining/promise.inseries "mention")
* [in-parallel](https://lochiwei.gitbook.io/web/js/async/promise/in-parallel "mention")
* [functions](https://lochiwei.gitbook.io/web/js/async/async/functions "mention")
* [methods](https://lochiwei.gitbook.io/web/js/async/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 %}
