変数と演算子の使い方 - web-0127のブログ

変数の表示

変数の中身を表示するには、「console.log」や「alert」の丸括弧（）内に変数名を指定します
変数名をシングルクォートまたはダブルクォートで囲むと、囲まれた範囲は単純な文字列となり、変数名がそのまま表示されてしまいます

《変数の中身の表示》

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>変数の中身の表示</title>
</head>
<body>
<script>
  var a = 10;
  console.log(a);
</script>
</body>
</html>

《実行結果》

変数名はシングルクォートまたはダブルクォートで囲まない！

データ型

データ型とは、変数に入っているデータの種類のことです
文字列と数値とは、異なる種類のデータ型になります
データ型が異なると、実行できる処理内容も異なります
文字列型のデータに対しては文字列の検索や置換などの処理ができます
数値型のデータは計算処理に利用できます

《JavaScriptのデータ型》

データ型	説明	例
数値	整数や実数	10 0.5
文字列	シングルクォートまたはダブルクォートで囲まれた文字の並び	'abc' "こんにちは"
論理値	・真（条件を満たす）の意味をもつ「true」・偽（条件を満たさない）の意味をもつ「false」	true false
配列	複数のデータの集合体	[10, 20, 30]
連想配列（オブジェクト）	キーと値の集合体	{ width : 90, height : 50 }
null値	オブジェクトが存在しないことを表す特殊なデータ型	null
undefined値	変数が初期化されていない、あるいはプロパティが定義されていないことを表す特殊なデータ型	undefined
NaN値	数値でないことを表す特殊なデータ型	NaN

JavaScriptはデータ型について厳密なチェックを行わないため、数値型の値が入っていた変数を文字列型の値で上書きすることも可能

スクリプト中で扱うデータは変数に入れる
変数に入れるデータの種類のことをデータ型と呼ぶ

演算子の挙動の違い

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>+演算子の挙動の違い</title>
</head>
<body>
<script>
  var x = 123 + 456;
  var y = '123' + '456';
  console.log(x);
  console.log(y);
</script>
</body>
</html>

《実行結果》

複合代入演算子

インクリメント、デクリメント

変数の値を１増やすこと
「++」はインクリメント演算子

デクリメント

変数の値を１減らすこと
「--」はデクリメント演算子

以下の２つは、まったく同じ処理をします

<script>
  var a = 10;
  a = a + 5;
  console.log(a);
</script>

<script>
  var a = 10;
  a += 5;
  console.log(a);
</script>

《実行結果》

以下の３つは、まったく同じ処理をします

<script>
  var a = 10;
  a = a + 1;
  console.log(a);
</script>

<script>
  var a = 10;
  a += 1;
  console.log(a);
</script>

<script>
  var a = 10;
  a++;
  console.log(a);
</script>

《実行結果》

演算でデータの計算や代入、比較などの処理を行う