webサイト制作の勉強|2018年9月クラス用ブログ

webサイト制作の勉強に関する解説ブログです。

変数の使い方

JavaScriptでまず覚える事は変数の使い方です。変数とは値を入れておくことができる箱のようなものです。
処理結果などの値を変数に格納したり、それをまた別の処理へ引き渡したりすることができます。

変数宣言

変数を使用する上で、まず行うのが変数宣言です。ようは「こういった変数を使います」とまず宣言します。1回宣言すれば、その変数はいくらでも使い回す事が出来ます。


基本的に変数名は任意の文字で構いませんが、絶対に使ってはいけないワードがあります。それらの事を予約語といいます。
JavaScriptとして特別な意味を持つ単語は予約語として登録されています。例えば条件分岐を記述する時に使用される「if」などが予約語です。今後変数名など識別子として使う時にはJavaScript予約語は使用することができません。

f:id:yachin29:20160822111937j:plain


var 変数名 = '値、もしくは文字列';

それでは変数を使って文字を表示させてみましょう。

<script>
var x = 'Hellow World!!';

document.write(x);
</script>

console.log

console.log関数とは文字通り、コンソール画面にログ(記述したスクリプト内容)を表示させる為に使う関数です。
自身の好きなタイミングで変数やオブジェクトの中身の値を確認できる為、正しい道順でプログラムが動いているか、途中途中で確認する事が出来ます。CSSの時と同じように、まずは「ミスをしない」よりも「ミスを自身で見つけられる」ようになりましょう。

使い方

確認したい変数などを「console.log( );」の中に入れて、Webブラウザの開発ツールのコンソールを立ち上げて各種ログを確認できます。

例えばChromeではデバッグしたいWebページを表示した状態でF12キー(もしくは検証モード)を押下し,上部のメニューからconsoleを選択します。

記述例

<script>
 
var a = 10

console.log(a);
 
</script>