はじめに
まだ苦手意識があるJS。コンソールのエラーがなかなか読み取れない。そこで、本日の学習でデバックのやり方が少し身についたので、記録しておく。
基本パターン
debuggerをコードに入れておけば、そこで強制的に処理を止めてくれる。Railsで言うbinding.pryのようなもの。
どの辺りでエラーが出ているのか、エラー文を見ればわかるが、debuggerを使えば、行ごとに細かく検証していくことができる。
変数定義ができているかの確認
JSでDOMを操作するときはとにかく変数に入れることが多いと感じる。その時々で、ちゃんと変数に意図したものが入っているのか確認する必要がある。そんなときは、cosole.log(変数名)でブラウザのコンソールに出力させる。そのときに、nilと出れば、変数定義されていないことに気付くことができる。
最後に
本日の学習では、この２つのパターンを使って、エラーを解決することができた。ファイルの読み込みはできているのか、イベント発火は正常かなど、細かく検証していくことが大切だと感じた。