目次


JavaScript 言語入門, 第 2 回

変数

Comments

コンテンツシリーズ

このコンテンツは全7シリーズのパート#です: JavaScript 言語入門, 第 2 回

このシリーズの続きに乞うご期待。

このコンテンツはシリーズの一部分です:JavaScript 言語入門, 第 2 回

このシリーズの続きに乞うご期待。

Interactive code: When you see Run at the top of a code sample, you can run the code, check the results, make changes, and run it again.

編集者による注記: このシリーズは、対話式コーディング機能を追加して更新されています。コード・リストに「実行」ボタンがある場合、そのコードを実行して結果を確認し、コードを変更してから再度実行して、その成果を確認できることを意味します。

変数は十分に理解しておかなければならない要素の 1 つです。変数には、後で取得したり、新しいデータで更新したりできるデータが格納されます。変数に格納するデータは、値または式にすることができます。JavaScript 言語での式には、以下の 3 つのタイプがあります。

  • 演算: 数値に評価します。
  • 文字列: 文字列に評価します。
  • 論理: ブール値 (true または false) に評価します。

変数のタイプ

変数には、ローカル変数とグローバル変数の 2 つのタイプがあります。ローカル変数を宣言するには var キーワードを使用します。var キーワードを使用しなければ、変数はグローバル変数になります。var キーワードを使用した場合、その変数を宣言した場所のスコープの外部からはアクセスできないため、ローカル変数であると考えられます。例えば、関数内でローカル変数を宣言すると、関数の外部からはその変数にアクセスできず、変数はその関数のローカル変数となりますが、同じ変数を var キーワードを使用ししないで宣言すると、その変数には関数の中だけでなく、スクリプト全体からアクセスできるようになります。

変数とは、特定の値を参照する名前のことです。変数を宣言するには、以下のように var キーワードの後に変数の名前を続けます。

var example;

上記では変数が宣言されていますが、定義はされていません (つまり、特定の値を参照していません)。以下に、特定の値を参照するように定義された変数の例を示します。この例での変数は、「some string」です。

var example = 'some string';

文字列とは、一続きの文字のことを指します。英字、数字、句読点、スペースは、いずれも文字の例です。文字列値は、単一引用符または二重引用符で囲みます。

'this is a string'
"this is also a string"

ローカル変数を宣言する

以下に例として示しているのは、num という名前のローカル変数です。この変数には、値 10 が代入されます。

var num = 10;

スクリプト内の別の箇所で num 変数の値にアクセスするには、以下に示すように、変数をその名前で参照します。

挑戦!

挑戦アイコン「実行」をクリックして、以下のコードをそのまま実行した場合の結果を確かめます。その後、変数を変更してから、もう一度「実行」をクリックして、変更後の結果を確認してください。

Show result

演算式を格納する

変数に演算式を格納するには、演算結果の値に変数を割り当てます (例: var num = (5 + 5))。この場合、変数に格納されるのは、演算そのものではなく、演算の結果です。

挑戦!

挑戦アイコン「実行」をクリックして、以下のコードをそのまま実行した場合の結果を確かめます。その後、変数または演算子を変更してから、もう一度「実行」をクリックして、変更後の結果を確認してください。

Show result

既存の変数の値を変更する

変数の値を変更するには、以下のように、変数に割り当てられた名前 (この例では num) で変数を参照し、等号を使用して新しい値を代入します。この場合、var キーワードを使用する必要はありません。変数はすでに宣言されているためです。

挑戦!

挑戦アイコン「実行」をクリックして、以下のコードをそのまま実行した場合の結果を確かめます。このスクリプトを実行すると、「The value of num is: 10」に続けて「The new value of num is: 15」が出力されます。これを確かめたうえで、変数を変更し、もう一度「実行」をクリックして変更後の結果を確認してください。

Show result

次は、学んだ内容を実践に移しましょう。この後の 2 つの例では、複数の文字列を連結して追加するために、それぞれ異なる方法を使用します。最初の方法では、演算子 + を使用して複数の文字列を追加します。その次の例では、concat() メソッドを使用します。

挑戦!

挑戦アイコン「実行」をクリックして、このスクリプトが複数の文字列を連結して追加し、出力した結果を確かめます。その後、文字列、演算子、またはコードのその他の部分を変更して、どのような結果になるのかを確認してください。

Show result

挑戦!

挑戦アイコンファーストネームとラストネームのそれぞれを変数に代入し、それら 2 つの変数を一緒に var fullName に追加した後、「実行」をクリックしてフルネームを出力してください。

Show result

このセクションでは変数について説明するなかで、次に扱うトピックである演算子も取り入れました。値を変数に代入するために使用した等号 (=) は、代入演算子です。また、5 + 5 の加算で使用したプラス記号 (+) は算術演算子です。このシリーズの第 3 回では、JavaScript 言語で使用できるすべての演算子を取り上げ、それぞれの使用方法を説明します。

まとめと次のステップ

このチュートリアルでは、JavaScript 言語の基礎のうち、変数とスクリプトについて紹介しました。全 7 回からなるチュートリアル・シリーズの第 3 回で、このとりわけよく使われているプログラミング言語の学習を続けてください。第 3 回でトピックとして取り上げるのは、演算子です。


ダウンロード可能なリソース


関連トピック


コメント

コメントを登録するにはサインインあるいは登録してください。

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=60
Zone=Web development
ArticleID=1049298
ArticleTitle=JavaScript 言語入門, 第 2 回: 変数
publish-date=09072017