Edited at

JavaScriptの変数ってなんだっけ

More than 1 year has passed since last update.


はじめに

これからJSやjQueryを学ぼう、という人がおそらくはじめに勉強するのが、JSの基本文法でしょう。

新しい言葉がいくつも出て来て、勉強を進めるうちに、あれ?この単語ってなんだっけ?となることがあるので、まとめておきました。

こちら変数編になります。

まとめ記事目次はこちら

(2018/04/08現在、修正中)


変数

変数とは、データを格納するための入れ物のようなもの。

変数にデータをいれることを、「変数にデータを代入する」と言う。


特徴


ES5までの仕様


  • 使用前に定義しておく必要がある。varという予約語と、その後に任意の名前を指定することで、変数を宣言できる。

var myVariable:


  • 定義後、値を割り当てることができる。

var myVariable;

myVariable = 20;


  • 定義と同時にデータを代入することもできる。(よく使います)

var myVariable = 20;


  • あとで値を変更することもできる

var myVariable = '学生';

myVariable = '社会人';


  • 様々なデータ型を入れられる

var myVariable = 20;  //数値(例 0.01, 200)

var myVariable = 'kurage'; //文字列。’’か””で囲う。(例'apple','くらげ')

var myVariable = true; //真偽値。真か偽の二種類のみ(例 true,false)

var myVariable = [1,10,100 ]; //配列。複数の値。(例 ['dog','cat','rat'])

var myVariable = document.querySelector('h1'); //オブジェクト。


  • 変数に変数を代入することもできる

var myVariable = 20;

myVariable = myVariable + 20;


  • 自分自身の値を変更する場合は省略可能

var myVariable = 20;

myVariable += 20;
// myVariable = myVariable + 20;

myVariable -= 20;
// myVariable = myVariable - 20;

myVariable = myVariable++;
//インクリメント。自分自身から1を加算。

myVariable = myVariable--;
//デクリメント。自分自身から1を減算。


ES2015以降の仕様

ES2015からはvarの代わりにletconstを使い分けます。


  • 定数宣言はconst
    constは一度宣言したら、値を再び代入することができない。なので、はじめに宣言したら値を買えない定数に使用する。(再度代入しようとするとエラーを吐く)

const myVariable = '学生';

myVariable = '社会人'; //error


  • 変数宣言はlet
    何度も値を代入し直す場合は、letで宣言する。

let myVariable = '学生';

myVariable = '社会人';


  • {}を使ったブロックスコープの使用
    ブランケットを使用した範囲がスコープとなり、変数の使用場所を限定することができる。

{

let myVariable = '学生';
myVariable = '社会人';
console.log(myVariable); // '社会人'
}
console.log(myVariable); // undefined