【JS学習マラソン】第7回 1.2.4 変数
JavaScript学習マラソンの第7回は、
「現代の JavaScript チュートリアル」パート1の2.4「変数」です。
変数 https://ja.javascript.info/variables
を読んでみます。
変数
コンピューターのプログラムは、
- データ
- 処理
という2つの構成要素から成り立っています。
プログラムでデータを扱う仕組みとして、「変数」や「定数」があります。
プログラミングにおいて、変数(へんすう、variable)とは、プログラムのソースコードにおいて、扱われるデータを一定期間記憶し必要なときに利用できるようにするために、データに固有の名前を与えたものである。
一人一人の人間が異なる名前によって区別されるように、一つ一つの変数も名前によって区別される。
これにより、複数のデータを容易に識別することができる。
変数が表しているデータをその変数の値(あたい)という。
変数の特徴
- 変数(英語ではvariableという)は、データ(値)を入れられる。
- 変数に入れたデータは、後で他のデータに入れ替えることができる。
- 変数の名前の付け方にはルールがあって、変数名には使えない文字や単語がちょっとある。
letキーワード
JavaScriptの変数は、「let」キーワードで作ります。
=「let 〇〇〇」と書けば、〇〇〇という名前の変数が用意できる。
- 変数に値を入れるには「=」で代入する。
- この「=」には、「代入演算子」という呼び名が付けられている。
プログラミングって、いろんな用語が出てきますね!(覚えるのが面倒)
変数の値の再代入
変数は後で別の値を代入して、中身を入れ替えることができます。
↑上記の例の場合、
- 最初、変数messageに「Hello!」という文字列を入れた。
- 次に、変数messageに「World!」という文字列を入れ直した。
- ここで、変数messageの中身を表示させたら「World!」が表示される。
変数のネーミング
JavaScript変数名は2つの制限があります:
- 名前は文字、数字、記号 $ と _ のみを含む必要があります。
- 最初の文字は数字であってはいけません。
その他、JavaScriptの変数名の命名則には、細々としたルールがあるので、一通りチュートリアルを見ておきましょう。
定数
プログラムのデータ構造にはいろいろありますが、「定数」というデータ構造もあります。
プログラミングにおいて定数(「ていすう」または「じょうすう」、Constant)とは、変数同様プログラムのソースコードにおいて、扱われるデータを一定期間記憶し必要なときに利用できるようにするために、データに固有の名前を与えたものである。
ただし変数とは異なり、一度初期化するとその内容を変更することはできない。
よって、内容が変化しないことが保証される名前が必要なときに使用される。
定数の特徴
定数は、一度値を設定したら、後から変えることはできません。
constキーワード
定数を宣言するためには、 let の代わりに const を使います。
定数を作る場合は、「const」キーワードを使います。
「var」キーワード
JavaScriptのバージョンによって、文法が変わっています。
- JavaScriptの昔のバージョンES5では、変数を「var」キーワードで作ってました。(まだ「let」や「const」はありませんでした。)
- JavaScriptの新しいバージョンES6(ES2015)では、「let」「const」キーワードが追加されました。
新しいES2015以降のJavaScriptでコードを書く場合は、「let」や「const」を使います。
昔の「var」は、今の「let」と比べると若干機能が違うので、必要なければ使わないようにしておきます。
(「var」については、チュートリアルの6.4「古い "var"」で説明されています。)
まとめ
(教材のサマリーから引用)
- let – は現代の変数宣言です。Chrome(V8)では、let を使うには、そのコードは strict モードである必要があります。
- var – は伝統的なスタイルの変数宣言です。一般的には使いませんが、必要なときのために、チャプター 古い "var" で let との微妙な違いを説明します。
- const – は let のようですが、変数の値は変更することができません。

スラスラ読める JavaScript ふりがなプログラミング (ふりがなプログラミングシリーズ)
- 作者: リブロワークス,及川卓也
- 出版社/メーカー: インプレス
- 発売日: 2018/06/22
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る