fetchの使い方を覚える ～ XHRからの脱却

IEも終了することですし、もうXHRじゃなくても良いかなと思いまして、
fetchの使い方を覚えてみます。

qiita.com

fetch("/", {
  method: "GET",
}).then(response => response.text())
.then(text => {
  console.log(text);
});

まず、アロー演算子の読み方ですが、次のように読み替えられます。

(引数,...)=>{...関数の本体...}
function(引数,...){...関数の本体...}

つまり、大まかに、
『response => response.text()』は、
『function(response){response.text()}』と読み替えて良さそうです。

fetchのレスポンスはPromiseで、そのPromiseの結果はResponseオブジェクトで返します。
Responseオブジェクトは、レスポンスヘッダーが全て返ってきた時点で結果が得られます。
さらに、そのResponseオブジェクトのresponse.text()の結果は、
やっぱりResponseオブジェクトで返されます。
なので、もう一つ.thenでつないでtextを取得するわけです。

なるほどぉ。