只今、PHPを学習しております

【JavaScript入門】変数と定数 / let & const について

トッド

JavaScriptの変数宣言には、let & const があります。

ここでは、Javascriptの変数宣言で使用する、変数と定数について紹介していきます。

変数とは何か?と、一言で表すと「名前の付いた値の乗り物」です。

JS
let fruits = 'りんご';

このように書くと、変数fruitsの中には「りんご」という値が入っている状態を表しており、

JS
let fruits;

このように書くと、値を入れる領域だけ確保している状態を表すことができます。

例のように、初期値(例えば、りんご)を設定していない場合の変数中には、undefinedが入っており、「値がありません」を意味します。

また、変数名は重複を許さないので仮に同名の変数が存在した場合はエラーになります。

なぜ、箱の中に値を格納する事をjavascript 学習の初めの単元で学ぶのか?と言うと、javascriptに限らず、プログラミングとは、いかに値を転がして意図する仕組み(スクリプト)の中を這わせるのか?を問われる学問だからです。

はぁ?ってなると思います。

分かりやすく言うと、昔話の「桃太郎」を思い出してください。

お婆さんは川に洗濯をしに行ったところ、川の上流から大きな桃が流れてきました。

もし、流れてきたものが、川で遊んでいる少年だったらお婆さんは、ほくそ笑んで物語は終わっていたでしょう。

という変数が流れて来た事によって、「持って帰る」という行動をとりました。

家に帰って展開してみると、中から赤ん坊というが登場する事により、物語は機能し最終的に「桃太郎」という結果を出力します。

変数を名前の付いた値の乗り物と例えるならば、桃は変数で、川はスクリプトです。

そしてこの物語を書いた作者はプログラマーと言えるでしょう。

そしたら世界観を戻していただいて……

変数名の名付けルール

変数に付ける名称には、いくつかの条件があります。

命名規則と呼ばれるもので、

    1. 1.頭文字は英字(aA)/アンダーバー(_)/ドル記号($)であること。
    1. 2.頭文字以降は、英字/アンダーバー/ドル記号/に加えて数字が使用できます。
    1. 3.大文字と小文字は区別して認識される。
    1. 4.javascript の予約語でないこと。

予約語には、

break casecatchclassconstcontinuedebuggerdefaultdeletedoelseexportextendsfinallyforfunctionif importimplementsininstanceofinterfacenewpackageprivateprotectedpublicreturnsuperswitchthisthrowtrytypeofvarvoidwhilewithyield

があります。

予約語というのは、JavaScript言語の中で既に使われているモノのことを指しており、暗記する必要はありません。

JavaScriptの学習を進めて行く過程で、それぞれ意味のある語句として登場するので自然と使わないようになります。


定数について

定数とは、定まった数ということで変数のように格納した値がコロコロ変わらない意味のある値に対して使用するものになります。

使い方はletの代わりにconstを用いて宣言するだけです。

身近な所で言うと、消費税率とか円周率(3.14)などが例として挙げられます。

定数(const)を使った変数宣言の特徴は、letと同じように変数名の重複を許さないのに加えて、値の再代入ができません。

サンプル
let str = "JavaScript";
str = "HTML5&CSS3";
console.log(str); // 結果 = HTML5&CSS3

const THEME = "JavaScript";
THEME = "HTML5&CSS3";
console.log(THEME); // 結果 = エラー

上記サンプルは、let & const を用いて値の再代入を実際に行ったときの挙動を表しています。

letで変数宣言を行った変数strの場合は、値の再代入によってコンソールに出力される値がHTML5&CSS3になりました。

一方で、constで行う定数を使った場合は、値の再代入を行おうとすると、エラーを弾きます。

このことからも、定数は値が変わらないものに対して使用するようにしましょう。

おまけ

何気なくサンプルコードの箇所でconsole.logo()というワードが出てきて、気になられたと思います。

JavaScriptにおいて、返される値が意図したものかどうかを確認する場所としてコンソールに出力してみるという確認方法があります。

コンソールはブラウザの開発者ツールから選択して確認することが可能です。

スクリプトのデバック作業は、おもにコチラで行います。

JavaScript学習を始める環境構築

コメントを残す

メールアドレスが公開されることはありません。