JavaScript

JavaScriptの変数ってなんだっけ

はじめに

これから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を使い分けます。

  • 定数宣言はconstconstは一度宣言したら、値を再び代入することができない。なので、はじめに宣言したら値を買えない定数に使用する。(再度代入しようとするとエラーを吐く)
const myVariable = '学生';
myVariable = '社会人'; //error
  • 変数宣言はletで 何度も値を代入し直す場合は、letで宣言する。
let myVariable = '学生';
myVariable = '社会人'; 
  • {}を使ったブロックスコープの使用 ブランケットを使用した範囲がスコープとなり、変数の使用場所を限定することができる。
{
  let myVariable = '学生';
  myVariable = '社会人';
  console.log(myVariable); //  '社会人'
}
console.log(myVariable); // undefined