javascriptのデバック方法

JavaScriptの代表的なデバッグ方法としてconsole.logとdebuggerがあります。

１console.log:実行時にブラウザのコンソール画面に任意のメッセージを表示するメソッド

①右クリック → 検証 → Consoleタブをクリックするとコンソール画面が表示されます。
 ②例えばnameという変数に格納された文字列をconsole.log(name)によってコンソール画面に表示し、確認することができます。ここからデバックをしていく。
③console.logでコンソールに内容が表示されると、そもそも該当の処理が実行されているのかの切り分けができます。

2 debugger:任意の箇所で処理を止めて、コンソール画面でデバッグ処理を行うことが可能です。binding.irbとやり方は似ている。

①.jsで終わるJavascriptファイルの検証したい部分でdebuggerを記載し、GoogleChromeなどのブラウザの検証ツール（cmd option i）を起動してSourcesタブを選択した状態でdebuggerの行が実行されると処理が停止してデバッグモードになります。
②デバッグモードでは1行ずつコードを実行させたり、その時点でのJavascriptをコンソールタブで実行して実行結果や要素が取得できるかなどの確認ができます。