1から始めるJs講座、第三回は
プログラムを記述していく上で重要になる「変数」について解説していこうと思います。
変数とは
簡単に説明すると文字や数値、命令などに名前をつけ、いろいろなところで呼び出せるようにするものです。
どのプログラミング言語でも変数を利用しますが、Jsの変数は他のものより柔軟に作られています。
変数の宣言
変数を宣言する場合は以下の構文を使います。
var 変数名 = 値 ;
■ 変数名とは?
変数につける名前です。
変数の命名にはいくつかのルールがあるので注意しましょう。
- 全角文字は使えない。
- 先頭が数字で始まってはならない。
- あらかじめ定義されている単語は使えない(例 : if. class. true. function. 等)
■ 値とは?
変数に格納するデータを設定します。
変数にはデータ型というものがあり、使用目的によって
適切なデータ型を利用する必要があります。
数値型 | 数値を表すデータ。Jsでは小数や無限大も数値型に分類される。 |
---|---|
文字列型 | 文字列を表すデータ。 |
論理型 | 真偽値と呼ばれ、’true’ か ‘false’ のいずれかの値を持つ。 |
オブジェクト型 | Jsのオブジェクト。 |
関数型 | 関数/メソッドであることを示す。 |
Null型 | 空であることを示す。 |
undefined型 | 未定義型と呼ばれ中身や変数自体が存在しないことを示す。 |
変数の使い方
それでは実際に変数を使ってみましょう。
今回は基本となるデータ型、「数値型」と「文字列型」を使用します。
まずは文字列型を使い警告ウィンドウに文字を表示させてみます。
Jsで文字列を使用する時はダブルクォーテーション(”)またはシングルクォーテーション(’)で囲みます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> var firstName = 'ジョニー'; window.alert(firstName); </script> </head> <body> </body> </html> |
最初の記述でfirstNameという変数に’ジョニー’という文字列を格納しています。
そして次の記述の引数に変数firstNameを入れ、警告ウィンドウにジョニーと表示させています。
変数を(+)でつなぐことで文字列をつなげて表示することもできます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> var firstName = 'ジョニー'; var lastName = 'デップ'; window.alert(firstName + lastName); </script> </head> <body> </body> </html> |
ブラウザで実行すると警告ウィンドウにジョニーデップと表示されるはずです。
次は数値を使用してみます。
数値を使用する時はクォーテーションマークは不要です。
また + や – 等の演算子を使い計算を行うことができます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> var numA = 10; var numB = 10; window.alert(numA + numB); </script> </head> <body> </body> </html> |
ブラウザで実行すると10足す10の計算結果の20が表示されるはずです。
変数はJsのみならず、プログラムを記述していく上で
なくてはならないものです。
しっかり理解しておきましょう。
次回は変数とは違い、複数の値を管理することができる配列について学びます。
- 2827 views
- ITの雄