ということに気が付いた。

すげーあほなこといってます。

よくある？サンプル

fetch(url)
.then(function(response){
    //fetchで返ってきたデータをjson形式にする
    return response.json();
})
.then(function(json){
    //jsonで何か処理する
    doSomething(json);
})
.catch(function(error){
    //エラー発生
    console.log(error);
})

（async/await使えよって指摘はごもっともなんですが……）
初見で見たときすごい未知の呪文に見えたんですね。
で、なんとなく真似てやってみても、ちょっと変えようとすると動かない、みたいな。
めっちゃ変な書き方しちゃう、みたいな。

「thenはメソッドで引数にコールバックを指定します。」
ただこれだけなのに、なぜか謎の呪文に見えていた時期があった。

アホの極み

というか今までthenのメソッドチェーンが特殊な記法に見えていたんだけど、これって
（fetchが返す）Promiseオブジェクトが持つthenメソッド
じゃん。普通の書き方じゃん。A.B()じゃん。PHP風に書くとA->B()じゃん。
え、なんでこんなこと今まで気づかなかったの、俺。馬鹿じゃん。

たぶん、メソッドの引数がコールバックで、しかも無名関数で書かれているから、その時点でちょっと複雑になって、
しかも括弧と波括弧とfunctionがゲシュタルト崩壊起こして謎の呪文に見えていたんだな。きっと。
実際はもっと処理が書いてあって複雑だし。

あと、メソッドの部分で改行するのも馴染みがない。
そりゃ、長くなるからわかるんだけども、なんか、ねえ……。
だって、

mojiretsu
.substring(0,5);

とか普通書かないじゃん。
（意外と書くのかな？）

なんかこの辺、コーディング規約とかあるのかな？

ということで書き直す

function convertToJson(response){
    //fetchで返ってきたデータをjson形式にする
    return response.json();
}

function doSomething(json){
    //json使って何か処理する
    doSomething(json);
}

function addErrorLog(error){
    //エラー発生
    console.log(error);
}

fetch(url).then(convertToJson).then(doSomething).catch(addErrorLog);

（アロー関数使えって指摘はごもっともなんですけどね……）
これならもっと理解早かったわ、きっと。
まあ、この次にPromiseとかコールバックを理解するっていう壁があるんですけどね。
thenメソッドに渡したコールバック関数の引数って何だよ、とか。
その辺は別の記事で書くかもしれない。

教訓

サンプルがわからないときは自分がわかるように分解・再構築するとわかりやすいかも。
アロー関数がわからない（慣れてない）ならfunctionに直すとか。
(アロー関数は覚える必要があるという前提で。というか、こういう作業をやっていくと覚えやすいのでは)
無名関数でゲシュタルト崩壊起こすなら、別関数に切り出すとか。
あとは、まあ、いろいろ。

まあ、わからないから勉強しようとして、それがわからないんだから、直すのも一苦労だろうけど。
わかるところから分解するしかないよなー。

当たり前だけど、自分で手を動かさなきゃわからんよね。

以上