[JavaScript General] HTML5 Rocks の Promise 記事の抜粋

Promise の記事が読みづらいのでポイントだけ memo.

[markdown]
日本語で読めなくなっている。

> [JavaScript Promises: There and back again – HTML5 Rocks](http://www.html5rocks.com/ja/tutorials/es6/promises/)

[こちら](https://developers.google.com/web/fundamentals/getting-started/primers/promises)にリダイレクト。[日本語の原稿](https://github.com/html5j-english/www.html5rocks.com/blob/html5jeng-master/content/tutorials/es6/promises/ja/index.html)。

## Promise と EventListener の違い

### EventListener

あるオブジェクトに対して複数回発生する事象（例えばキーアップやタッチ開始）を表現するのに、イベントは向いている。
通常この場合は、リスナーを追加する前に何が起きたか気にする必要はない。

### Promise

非同期処理が成功したか失敗したかによって処理を分けたい場合、Promise を利用する。
Promise は基本的にイベントリスナーと似ているが、以下の点で異なる。

– Promise は一度だけ成功もしくは失敗する。２回成功／失敗したり、成功状態から失敗状態へ変化したりしない。
– Promise がすでに成功もしくは失敗した後に成功／失敗を通知するコールバックを追加した場合、すでにイベントは完了しているにもかかわらず、正しいコールバックが呼び出される。

## jQuery の Deferred を標準の Promise にキャストする方法

JavaScript Promise API では、then メソッドを持つオブジェクトであればなんでも、Promise 風オブジェクト、もとい、Promise 語で言うところの thenable として扱う。
jQuery の Deferred には問題があるが、以下のようにすれば Deferred を標準の Promise にキャストできる。

“`javascript
var jsPromise = Promise.resolve($.ajax(‘/whatever.json’));
“`

上の例で、jQuery の $.ajax は Deferred を返す。Deferred は “then” メソッドを持っているため、Promise.resolve に渡すことで、JavaScript Promise に変換される。
ただし、Deferred はコールバック関数を呼び出す際、以下のように複数の引数を渡すのに対して、

“`javascript
var jqDeferred = $.ajax(‘/whatever.json’);
jqDeferred.then(function(response, statusText, xhrObj) {
// …
}, function(xhrObj, textStatus, err) {
// …
});
“`
JavaScript Promise は先頭の引数以外は無視する。
“`javascript
jsPromise.then(function(response) {
// …
}, function(xhrObj) {
// …
});
“`

だいたいの場合において、先頭の引数しか必要ないので、これで問題ない。
また、jQuery は Error オブジェクトを reject 関数に渡さないことには注意が必要。

## XMLHttpRequest の Promise 化

後で何かを例にコードを書いてみる。
書いた。

> * [XMLHttpRequest する関数を Promise を返すように修正するチュートリアルをやってみた | deadwood](https://www.d-wood.com/blog/2017/02/13_8809.html)

## 補遺

もっとよいサマリーがあった。

> * [あなたが読むべきJavaScript Promises – JSer.info](https://jser.info/post/77696682011/es6-promises/)
[/markdown]