JavaScriptが急に楽になった日。～“型”で考えるという気づき～

毎度様でした。

今日はJavaScriptの復習をしていました。

これまでの自分は、

「動くコードは書けるけど、なぜそう書くのか説明できない」

という状態だったなと、改めて感じています。

特にしんどかったのが、

〇target

〇current

〇dataset

〇indexOf

といったものが、ある日突然まとめて出てくる瞬間でした。

「え、なんで急にこんな変数が増えるの？」

「今どこを見て、何をしてるの？」

理解が追いつかず、頭のMPが一気に削られていく感覚でした。

なぜこんなに疲れていたのか

原因を振り返ってみると、

毎回その場で流れを考えていたことが一番大きかったと思います。

①クリックされた

②どの要素？

③今どんな状態？

④次はどうする？

⑤見た目を更新する

これを全部、毎回即興で考えていたんですよね。

そりゃ疲れるはずだな、と。

気づいたこと：「これ、全部同じ流れじゃないか？」

あるときふと、

あれ？

これって毎回同じことを、同じ順番でやってない？

と気づきました。

整理してみると、流れはほぼ固定でした。

①イベントが起きる

②対象の要素を特定する

③今の状態を取得する

④次の状態を決める

⑤render で見た目を反映する

これ、毎回同じ。

違うのは中身だけで、構造は完全に同じでした。

「型」として考えるようにした結果

そこで、

「理解しきってから使おう」ではなく、

まずは型として覚えて使うことにしました。

すると、

どこで何が起きているか迷わない

変数が増えても怖くならない

脳の体力消費が明らかに減る

という変化がありました。

型があることで、

考えるエネルギーを“理解”に回せるようになった感覚です。

JavaScriptは魔法じゃなかった

今回一番の学びは、

JavaScriptは

「自由にその場で考えるもの」ではなく

「型を使い回すもの」だった

ということでした。

CSSが見た目の状態を定義して、

JavaScriptはそれを「いつ切り替えるか」を決めているだけ。

魔法のように見えていた動きも、

実はとても地道で、整理された処理の積み重ねでした。

同じように悩んでいる方へ

もし、

JSが動くけど怖い

コードを見た瞬間にMPが削られる

毎回ググりながらで自信がない

そんな状態なら、

まずは「型」で覚えてしまっていいと思います。

意味は、あとから必ず追いつきます。

まだまだ基礎練習の段階ですが、

一つずつ腹落ちさせながら、

地に足をつけて進んでいこうと思います。

同じように学習中の方の参考になれば嬉しいです。

P.S.　２日間プログラミングをお休みして、長距離ドライブ旅をしていました。

デジタルデトックスとともに、目の疲労を自然をみることで回復

することができました。

これかなりおすすめです。

お金を稼げるようになったら定期的に

デジタルデトックスの旅に出たいなと思いました。

サウナにも行きまして、３回ととのって4にかけましたね。ハイ。