JavaScript でヘンな数

　今回は「変数」とは何かを勉強します。

１　変数とは

　変数はいろんな値（数字、文字列など）を入れることができるハコのようなものです。
　書籍では、よく「箱」のイラストが描かれています。

　変数を扱う方法
　　①宣言（let の部分）　②代入（＝の部分）

HTML（コード入力）

<!DOCTYPE html>
<html>
<head>
    <title>サンプル</title>
    <meta charset="UTF-8">
</head>
<body>
    <script>
        let a;
        a = 100;
        document.write("<p>" + a + "</p>");
    </script>
</body>
</html>

ブラウザ（実行結果）

てすと

　コードでは write メソッドの引数として a が使われていますが、ブラウザでは「100」が表示されています。
　とうことは、箱そのものではなく、その箱の中の値が表示されるということですね。
　そして、この変数には基本的に何度でも値を代入することができます。

HTML（コード入力）の一部

let b;
b = 100;
document.write("<p>" + b + "</p>");
b = 200;
document.write("<p>" + b + "</p>");

ブラウザ（実行結果）

てすと

　b にはいったん「100」代入して表示しています。
　その後、b に「200」を代入して表示。
　変数には様々な値を代入することができ、かつ上書きできます。

２　変数の名前

　変数の名前にはルールがあります。

Unicode文字、アンダーバー、ドル記号
大文字と小文字は区別される（ABC と abc とは別の変数）
１文字目に数字はダメ
あらかじめ JavaScript で決まっている文字列はダメ（for などの「予約語」）

３　変数の値

　さて、次は中に入れる値についてみていきます。
　その前に、宣言と代入を同時に行う方法です。

HTML（コード入力）の一部

let c;
c = 100;

let c = 100;

　上段の１行目及び２行目と同じことを、下段の１行のみで行っています。

HTML（コード入力）の一部

let d = 100;
document.write("<p>" + d + "</p>");
d = "こんにちは";
document.write("<p>" + d + "</p>");

ブラウザ（実行結果）

サンプル

　１行目では宣言と代入を同時に行ったので、２行目の write メソッドで変数 d の値である「100」（数値）が表示されます。
　そして３行目ではその d に「こんにちは」を代入し、それを４行目で表示しています。
　このように、同一の変数であっても、例えば上の例のようにそれぞれ数値と文字列といった異なる「型」の値を代入して表示することができます。

４　次回

　変数がどのような性質なのか分かったので、次回はこの変数を使って演算（計算）を行いたいと思います。

手習い日記帳

１　変数とは

HTML（コード入力）

ブラウザ（実行結果）

HTML（コード入力）の一部

ブラウザ（実行結果）

２　変数の名前

３　変数の値

HTML（コード入力）の一部

HTML（コード入力）の一部

ブラウザ（実行結果）

４　次回

カテゴリー

更新記事

タグ

JavaScript でヘンな数

１ 変数とは

HTML（コード入力）

ブラウザ（実行結果）

HTML（コード入力）の一部

ブラウザ（実行結果）

２ 変数の名前

３ 変数の値

HTML（コード入力）の一部

HTML（コード入力）の一部

ブラウザ（実行結果）

４ 次回

カテゴリー

更新記事

タグ

１　変数とは

２　変数の名前

３　変数の値

４　次回