技術情報
JavaScriptの基本
JavaScriptは以下のような3種類の書き方があります。
  • HTML文書中に直接記述
  • <script>~</script>で囲んだ部分にプログラムを記述します。

    (例)
    <script>
    alert('ようこそ');
    </script>

  • 外部ファイルに記述
  • 外部ファイル(拡張子 .js)にプログラムを記述し、scriptタグを使って、HTMLドキュメントに読み込みます。

    (例)
    <script src="sample.js"></script>

  • タグのイベントに直接記述
  • タグのイベントハンドラに直接記述します。

    (例)
    <input type="button" value="ボタン" onClick="alert('ようこそ')">

  • ステートメント
  • ステートメントの最後はセミコロン(;)を付けます。
    但し、if文やwhile文のような構文は除きます。

  • コメント
  • 1行のコメントはダブルスラッシュ(//)を付けます。
    複数行のコメントは
    /*
      ~ コメント ~
    */
    で記述します。

  • 変数
  • 変数は var を付けて宣言します。
    変数は宣言せずに使用することができますが、その場合は1つのHTML文書内でグローバル変数となります。
    変数のスコープを明確にするためにも、宣言することを推奨します。
    一方、ifやwhileなどの予約語を含む変数名は使えません。また、大文字・小文字は区別されますので、注意が必要です。

  • 数値
  • 整数、小数、指数(例:1.15e4)、8進数(先頭に0をつける)、16進数(先頭に0xをつける)が使用できます。

  • 文字列
  • 文字列はダブルクォーテーション(")またはシングルクォーテーション(')で囲みます。

  • 関数
  • 関数は引数固定と引数可変の2通りの宣言の仕方があります。

    [引数固定]
    function 関数名 (引数1, 引数2, ... 引数n)
    {
    ~ 処理 ~

    return 戻値; // 戻値不要な場合は省略
    }

    [引数可変]
    function 関数名 (/* ... */)
    {
    ~ 処理 ~       // 引数は argments 配列に格納されます。
    return 戻値;   // 戻値不要な場合は省略
    }

    上記の通常関数の他に関数名を省略した「無名関数」というものがあります。
    変数に代入すれば、あたかも関数のように振る舞います。
    (例)
    var myTest = function () {
    alert('こんばんは');
    }

    myTest();

  • if文
  • if (条件式A) { ~ 処理A ~ }
    else if (条件式B) { ~ 処理B ~ }
    ...
    else { ~ 処理Z ~ }

  • switch文
  • switch (条件式)
    case 値A : { ~ 処理A ~ }
    case 値B : { ~ 処理B ~ }
    ...
    default : { ~ 処理Z ~ }

  • while文
  • while (条件式) { ~ 処理 ~ }

  • do文
  • do { ~ 処理 ~ } while (条件式)

  • for文
  • for (条件式A; 条件式B; 条件式C) { ~ 処理 ~ }
    または
    for (変数 in 配列) { ~ 処理 ~ }

  • label文
  • 「ラベル名 :」で定義します。break文やcontinue文のジャンプ先に使用されます。

  • break文
  • 「break ラベル名;」と記述します。ラベル名を省略した場合は、break文から見て1つ外側のfor文、while文、do文、switch文から抜けます。

  • continue文
  • 「continue ラベル名;」と記述します。ラベル名を省略した場合は、continue文から見て1つ外側のfor文、while文、do文の次の条件処理へジャンプ(continue文以降をスキップ)します。

  • with文
  • with (オブジェクト)
    {
      ~ 同一オブジェクトの処理 ~
    }

    同一のオブジェクトを扱う場合に省略して記述するために使用します。

  • return文
  • 「return 戻値;」と記述します。関数の戻値となります。戻値がない関数の場合はreturn文は省略します。

  • throw文
  • 「throw (式)」と記述します。例外をスローします。

  • try ~ catch ~ f
  • inally文
    try
    {
      ~ 通常処理 ~
    }
    catch (エラー変数)
    {
      ~ エラー発生時の処理 ~
    }
    finally
    {
      ~ 後処理 ~
    }

通常の1次元配列の他に、多次元配列や連想配列も利用可能です。
配列の宣言は以下のいずれかで行います。
  • new Array()
  • 配列の宣言のみ行います。

    (例)
    var ary = new Array();
    ary[0] = "Tokyo";
    ary[1] = "Osaka";
  • new Array(引数)
  • 要素数をあらかじめ設定して宣言します。

    (例)
    var ary = new Array(5);
    ary[0] = "Tokyo";
    ary[1] = "Osaka";
  • new Array(引数, 引数, ...)
  • 引数に配列の要素を直接指定して要素とともに宣言します。

    (例)
    var ary = new Array("Tokyo", "Osaka");
多次元配列は配列の要素に配列を代入するという方法を繰り返すことにより実現します。

(例) 2×2の2次元配列
var ary = new Array(2);
ary[0] = new Array(2);
ary[1] = new Array(2);

ary[0][0] ="100";
ary[0][1] ="200";
ary[1][0] ="300";
ary[1][1] ="400";

連想配列は要素の添字(数値)の代わりに文字列を使用します。

(例)
var ary = new Array();
ary["Tokyo"] = "東京";
ary["Osaka"] - "大阪";