これからはじめるフロントエンドJavaScript：はじめまして。JavaScript（1）（2/2 ページ）

JavaScriptをゼロから書くときの作法や、デバッグの方法と、変数やプログラムの制御について説明します

[野村亮之，Jamlogic]

変数を使ってみよう

　変数とは、宣言した名前の箱のようなものです。その箱にいろいろな値を入れておくことを代入といいます。入門書などにも出てくる言葉なので、頭に入れておきましょう。

　JavaScriptで変数を宣言するときは、varを使います。変数名は、半角英数字を利用できます。＿（アンダーバー）は利用できますが、ハイフンは利用できません。小文字と大文字を区別します（eXampleとexampleは違う変数です）ので、注意しましょう。

var sample = "example";

sampleという変数を宣言して、その中に文字列のexampleを入れます

var sample;

空の変数を宣言できます。中身は、undefined（定義はされていない）に設定されます。

var sample = "example", sample1, sample2;

いくつかの変数を連続して宣言できます。

ポイント

　プログラムには、“型”という概念があります。それは、その代入された値が、文字列か数字かなど判別します。JavaScriptでは、以下のものが代表的な型として決められています。

　文字列(string)、数字(number, int, float)、真偽(boolean, true | false)、オブジェクト(object)、配列(array)

　この5つを覚えておけば、基本的には大丈夫です。使い方は以下の通りです。

　文字列　“sample”

　「”」か「’」で囲んだものが文字列になります。私たちは、メッセージや表示する値などの場合は、「”」を、プログラムで利用する値は、「’」で囲むようにしています。

　数字　1000, 1.02

　数字は、そのまま書きます。整数も書け、小数点を含んだ値も書けます。マイナスにする場合は、「-100」というような形で書きます。

プログラムを制御

　では、早速プログラムを書いていきましょう。

<script type="text/javascript">
var a = 1;
var b = 2;
console.debug(a + b); //答えは何？
//ifで比較できます
if(a > b){
	console.debug("aの方が大きい");
}else{
	console.debug("bの方が大きい");
}
//分岐を下記のように書けます
switch(a){
	case 1:
		console.debug("aは1である");
		break;
	case 2:
		console.debug("aは2である");
		break;
	default:
		console.debug("aはそれ以外である");
		break;
}
//ループは以下のようにできます。
//配列を順に呼び出して、アラートで配列の中身を表示します。
var arr = ["apple", "orange", "pine"];
for(var i = 0; i < arr.length; i++){
	console.debug(arr[i]);
}
var obj = {a: 1, b: 2, c: 3};
for(var key in obj){
	console.debug(obj[key]);
}
//文字列と数字を足す場合
var a = "1";
var b = 2;
console.debug(a + b); //答えは何？
</script>

　先ほどのデバッグ方法を試しながら、正しく動作するように、プログラムを書いてみてください。ifやforなどの制御関数に関しては、次回以降詳しく見ていきたいと思います。

　今回は、実際のプログラムを書いてみて、実行ができたことの喜びをかみしめましょう！ 今回は簡単なプログラムを書いてみて、デバッガでその値を見ただけですが、少しJavaScriptについて理解できたのではないでしょうか？

　次回からは、より詳しい言語の仕様と、JavaScriptフレームワークを取り入れながら、簡単なアプリを書けるような実践をしていきたいと思います。

著者プロフィール

野村亮之（のむら あきゆき）

2004年 在学中に株式会社sus4を設立・取締役に就任。デザイン視点でのWebサービスの在り方をアプローチの基本として、さまざまなWebサービス構築に従事。2006年8月日本初のオンライン動画編集サービスClipCastを開発・運営開始。2009年7月動画解析サービスVideoAnalyticsを開発・運営開始。

2009年8月Ext Japan LLCにてSenior Software Architectに就任。

2011年4月(株)エムワープ（（株）マクロミル連結子会社）にて、レコメンデーションサービスとSNSを組み合わせたWebサービスPOPCORNをiPhoneで開始。2日でAppStore無料ランキング1位を獲得。6月にAndroid版を開始。2012年1月から同社最高技術責任者。

2012年5月からアポイ(株)CTO就任。(株)Jamlogic設立。(株)インタレストマーケティング取締役／CTO就任。

2011年8月より、ビジネス教育をベースとした実践型エンジニア／ディレクター育成ラボ「techGarage東京・福岡」を設立。学生のエンジニア・ディレクター教育を継続的に行っている。