Java Script の基礎



Java Script の特徴

    Java Script は Web ブラウザ上で動作するスクリプト言語(注1) である. さまざまなインターネット関連技術のなかで,Java Script は重要な役割を担っている. Java Script は Web ブラウザ (Web クライアント) 側で動作するので, Web サーバの管理者以外でも Web ページにさまざまな機能を簡単に 追加することができる. この点が Java Script の最大の利点である. 逆に,Java Script の欠点は 1) セキュリティの観点から,Web クライアントから情報を取り出したり, 書き込んだりすることはできない, 2) Web ページの閲覧者からコードを隠すことができない,以上の 2 点が挙げられる. これらの制約から,Java Script は Web クライアント側でのフォームのための 事前処理や Web ページの要素をインタラクティブに動作させるということに向いている.
    (注1) スクリプト言語とはコンピュータ言語の一種で, 反復的なタスクをひとまとめにして動作させるためにおもに利用される.

目次へ戻る
Java Script の組み込み

(書式)
   <SCRIPT language="JavaScript">
     スクリプト文
   </SCRIPT>
    Java Script の HTML への組み込みは <SCRIPT> </SCRIPT> 命令の "language" 属性の属性値に JavaScript とすることで可能になる.
    <SCRIPT language="JavaScript">
    document.write("ようこそ,JavaScript の世界へ")
    </SCRIPT>
    (ブラウザでの表示結果)
(注)
  1. HTML では大文字/小文字は区別されないが,Java Script では大文字/小文字を 間違えるとエラーになる! <SCRIPT> タグで囲まれた範囲内では大文字/小文字の入力には注意せよ!
  2. Java Script にはいくつかのバージョンがあり, バージョンの違いにより使える機能と使えない機能がある. Web ブラウザを判定して,それぞれに対して異なるスクリプトを書く必要がある. "language" の属性値に,例えば JavaScript1.2 のように,バージョンを明示するなど の方法もある.

  3. 目次へ戻る
    JavaScript の実装

    (書式)
       <SCRIPT language="JavaScript" src="*****.js">
       </SCRIPT>
      JavaScript を実装するための <SCRIPT> タグは基本的には HTML テキスト中の どこにおいてもかまわない.ただし,Web ページ読み込み時に動作させたい場合には <BODY> よりも前に配置しなくてはならない. しかし,次のような場合にはスクリプトを直接,HTML ファイルに記述するのではなく, 別の外部ファイルに記述し,そのファイルを HTML 内に読み込み JavaScript を 実装するようにした方が便利である.
      • 長いスクリプト
      • 多くの HTML ファイルで同じスクリプトを使う
      • JavaScript コードを Web 閲覧者に見せたくない
      外部ファイルの呼び出しは "SRC" 属性を指定すること により可能になる. 属性値は読み出すファイルのファイル名を相対もしくは絶対パスで指定する. なお,Java Script コードを書いたファイルの拡張子 (extension) は js でなくてはならない.
      外部ファイル「extanal.js」を読み込む場合.
      <SCRIPT language="JavaScript" src="extanal.js"> </SCRIPT>

    目次へ戻る
    Java Script のコメント

    (書式)
       // ・・・
       /* ・・・*/
      Java Script では // を記述した行は // を記述したところから 行末までをコメント (注意書き) 文として処理される. また,/* ・・・*/ で囲まれた部分も同様にコメント文として扱われ無視される.
      <SCRIPT language="JavaScript">
      // document.write("Hello,JavaScript World")
        document.write("ようこそ,JavaScript の世界へ")
      /* document.write("ヨウコソ,ジャバスクリプトノセカイヘ") */
      </SCRIPT>
      (ブラウザでの表示結果)

    目次へ戻る
    Java Script で扱えるデータ

      Java Script において扱えるデータは 4 形式ある.
      数値10, 0.1, 1.0e3
      文字列"Hello", "じゃばすくりぷと"
      論理値true, false
      nullnull
      文字列は " " ダブルクォートもしくは,' ' シングルクォートで囲む. 論理値 true は真を意味し,false は偽を意味する. null は何も入っていないことを表す特別なキーワードである.

    目次へ戻る
    変数の生成

    (書式)
        var 変数名 = データ値
        変数名 = データ値
      Java Script でデータを扱うためには,変数を設定しそれにデータを入れるという 方法をとる. 変数には名前があり,任意の値を変数に代入すると変数名でその値が 参照できるようになる. 変数名にはアルファベットとアンダースコア (_) を用いることができる. ただし,下記の予約語は利用できない. var 変数名で変数を宣言し,等号 (=) に続いてデータ値を代入する. 変数の宣言文 var は省略可能である.
      (注) 変数名は大文字と小文字を厳密に区別する. (Hello と hello は別の変数と見なされる.)
      var Hello="こんにちは"
      hello="まいど!"
    break, case, catch, continue, default, delete, do, else,
    finally, for, function, if, in, instanceof, new, return,
    switch, this, throw, try, typeof, var, void, while, with
    Java Script が使用するものとして予約されている名前

    目次へ戻る
    配列

    (書式)
        配列名 = new Array(配列要素数)
      配列とは変数を数個のひとかたまりとして扱える型にしたもの. 表現としては変数に添え字が付いたもの (Aij, Xk). 数値を用いて変数を扱う場合,配列を宣言すると便利である.
      X = new Array(3)
      この宣言により,配列 X に 3 つの配列要素: X(0),X(1), X(2) を 代入することができる. (注) 配列の最初の添え字は「0」である.

    目次へ戻る
    演算子

      変数に対して変数,演算子を用いた計算処理行うことにより, さまざまなことを実現できる.

    目次へ戻る
    条件処理

    条件式の条件部分には任意の式が用いられる. 条件演算子は条件に対し真か偽の 2 つの値のどちらかを返すという条件選択 を行なう. しかし, これらの方法では処理は上から下へというプログラムの流れは変えられない. ここでは, 条件により処理の方法を変える方法について説明する.

    目次へ戻る
    関数の利用

    同じ処理を何度も繰り返す場合には関数 (function) を定義し, 必要に応じて実行すると便利である.

目次へ戻る
オブジェクト

オブジェクトは Java Script プログラミングで非常に重要な役割をもつ. オブジェクトとは, 簡単にいえば, 特定の処理を行うモノである. オブジェクトは
メソッドにより操作される. Java script に組み込まれているオブジェクト (ビルドインオブジェクト) には 次の通りである.
JavaScript ビルドインオブジェクト
Anchor, anchors array, Applet, applets array, Area, arguments array, Array, Button, Checkbox, Date, document elements array, embeds array, FileUpload, Form, forms array, Frame, frames array, Function, Hidden, links array, location, Math, MimeType, mimeTypes array, navigator, Number, Option, options array, opptions array elements, Password, Plugin, plugins array, Radio, Reset, Select, String, Submit, Text, Textarea window
メソッド
メソッドとはオブジェクトを操作するためのスイッチである. オブジェクトにはそれぞれを操作するためのメソッドが用意されており, JavaScript ではメソッドを用いて, オブジェクトを操作するという プログラミングスタイルをとる.
(書式) オブジェクト名.メソッド名()
オブジェクトのメソッドを操作には,「どのオブジェクト」に対して 「どのような操作」をするかを指定しなくてはならない. JavaScript ではドット (.) を用いてこの関係を記述する.
Web ページに文字列を表示する場合
    document オブジェクトに write メソッドを指定する.
document.write("Hello")

プロパティ
オブジェクトがあらかじめ保持している値 (オブジェクト内の固有の変数) をプロパティと呼ぶ. プロパティに値を設定することにより, オブジェクトの設定値を変更することができる. 背景色, テキスト色, ブラウザ情報等がプロパティ値として設定されている.
(書式) オブジェクト名.プロパティ名
     オブジェクト名.プロパティ名 = 値
プロパティ操作は「どのオブジェクト」に対して「どの値」の形式で指定する. ドット (.) を用いてこの関係も記述する. 代入演算子を利用するとプロパティ名に値を設定できる.
背景色の設定
    document オブジェクトに bgColor プロパティ値を設定する.
document.bgColor
document.bgColor="orangered"

(参) プロパティを参照するには, 変数に代入するか, メソッドを用いて直接記述する.
var NaN = navigator.appName
document.write(navigator.appName)

目次へ戻る
クッキー

セキュリティ上の問題から Web ブラウザはクライアント側に 情報を保存することはできない. JavaScript を利用するとクッキーファイル (coolie file) を用いて 情報をクライアント側に保存することができる. また, 従来は Web サーバは接続してきたクライアントが誰なのかを 特定することができなかった. しかし, クッキーを利用すると比較的簡単にこれを解決することができる. クライアントが Web サーバにアクセスしたとき, JavaScript プログラムが クッキーファイルの中にその Web サーバが発行した Web ブラウザ固有の ID があるかどうかを確認し, ID がなかった場合は次回からその Web ブラウザを 特定できるように ID を発行する. それがクッキーファイルに保存される. 次回からは Web ブラウザの固有 ID 確認時に, ID を Web サーバに送ることが できる. この固有 ID を用いてユーザは自身がカスタマイズした Web ページを送ったり, 以前に設定された値を用いてユーザ固有の処理を行ったりできる.