console.log
JavaScript はHTMLと違って書いたコードを必ずしも画面で確認できるわけではありません。
確認ができないと自分が何をやっているのか分からなかったり、想定の動きをしているかテストをすることが出来ず開発が進まないなんてことにもなりかねません。
なのでまずは文字や数字を画面に出力するための方法から学んでいきましょう。
前回使用したTESTフォルダを使用していきます。
index.jsファイルを開いてください。
開いたら以下のコードを消してください。
alert("私がJavascriptです");消したら次のコードを記入して保存してください。
console.log("私もJavaScriptだ");index.htmlファイルを開いて以下のコードも削除しましょう、消したら保存をしてブラウザでHTMLファイルを開いてください。
<p>jsを使えるようになる</p>真っ白な画面が開いたと思います。
このように画面上には何も出ていないのですが実はもうconsole.logが力を発揮しています。
力を見届けるためにブラウザで次の操作をしてください。
右クリックをして検証を押す。
覚えると楽なので以下のショートカットをよければ覚えてください。
Windows「F12」を押す。または「control」＋「shift」＋「I」キーの同時押し
Mac「command」＋「option」＋「I」キーの同時押し
このような画面が出ると思います。
そうしたら右上にあるコンソールという箇所をクリックしてみてください。
私もJavascriptだ の文字が出てきたと思います。
このように（）の中身をコンソールに出してくれるのがconsole.logの力です。
これをコンソールに出すや、ログ出しなどと言います。
課題
それでは今回の課題です。
index.jsファイルの
console.log("私もJavaScriptだ");を削除して、「私はログ出しを習得した」をコンソールにログ出ししてみてください。
コラム
エラーについて
ちなみに
console.log(私もJavaScriptだ);このように文字を””や”で挟まなかった場合以下のようなエラーが出てきます。
Javascriptでは文字は””や”で挟むというルールになっているので覚えておいてください。
また今後Javascriptで物を作るとき様々なエラーが出ると思いますが、基本コンソールにエラーを書いてくれるのでたくさん活用してください。
プログラミングを学習し始めた方でエラーが怖い、解決できなくてしんどいなど、エラーに対してマイナスなイメージを持ってしまう方が一定数います。
そんなエラーですが実はとても有難い存在なんです。
なぜならエラー文にはどこが、どのように間違っていてエラーが起きてしまっているのか書いてあり、そこを直してあげれば解決するからです。
直し方がすぐ分からないなどと言ったことは、プロのエンジニアでもよくあることですので安心してください、そこで解決をするための方法をお伝えします。
それは出たエラー文をコピーしてGoogle大先生に聞いて解決していくという方法です。
今回覚えたconsole.logはこれからもずっと使っていくのでここで必ず覚えておいてください！
今回はここで終了です、お疲れ様でした。
