JavaScriptの実装

JavaScriptの核心であるECMAScriptは、その言語の構文と基本オブジェクトを説明しています;

DOMはウェブページの内容を処理する方法とインターフェースを説明しています;

BOMはブラウザとのインタラクション方法とインターフェースを説明しています。

ECMAScript、DOM、およびBOM

ECMAScriptは重要な標準ですが、JavaScriptの唯一の部分ではありません。もちろん、標準化された唯一の部分でもありません。実際には、完全なJavaScript実装は以下の3つの異なる部分で構成されています:

JavaScriptはECMAScript、DOM、BOMを含んでいます

ECMAScript

ECMAScriptは特定のブラウザにバインドされていません。実際には、ユーザー入出力のための方法も言及されていません(これはCなどの言語とは異なり、外部のライブラリに依存してこのようなタスクを完了する必要があります)。それでは、ECMAScriptとは何でしょうか?ECMA-262標準(第2段)の説明は以下の通りです:

「ECMAScriptは異なる種類のホスト環境に核心のスクリプトプログラミング能力を提供することができ、したがって核心のスクリプト言語は特定のホスト環境とは独立して規定されます... ...」

WebブラウザはECMAScriptのためのホスト環境ですが、それが唯一のホスト環境ではありません。実際には、NombasのScriptEaseやMacromediaがFlashとDirector MXで同時に使用するActionScriptなど、ECMAScript実装を収容できる無数の他の様々な環境があります。それでは、ECMAScriptはブラウザ以外で何を規定しているのでしょうか?

簡単に言えば、ECMAScriptは以下の内容を説明しています:

  • 文法
  • タイプ
  • キーワード
  • 保留語
  • 演算子
  • オブジェクト

ECMAScriptは単なる記述であり、スクリプト言語のすべての属性、メソッド、オブジェクトを定義しています。他の言語はECMAScriptを実現して機能の基準として使用することができます。JavaScriptがその一例です:

ECMAScript、JavaScript、ActionScript、ScriptEase

各ブラウザは独自のECMAScriptインターフェースの実装を持っており、その実装はさらに拡張され、DOMとBOM(以下のセクションで詳述)が含まれています。もちろん、ECMAScriptを拡張し、他の言語が機能の基準として実現する他の実装もあります。例えば、Windows Scripting Host(WSH)、MacromediaがFlashとDirector MXで使用するActionScript、およびNombas ScriptEaseなどがあります。

1. ECMAScriptのバージョン

ECMAScriptはいくつかの異なるバージョンに分かれており、ECMA-262という標準で定義されています。他の標準と同様に、ECMA-262は編集や更新されます。主要な更新があると、新しい標準版が発表されます。最新のECMA-262のバージョンは5.1で、2011年6月に発表されました。

ECMA-262の第1版は本質的にNetscapeのJavaScript 1.1と同じですが、ブラウザに関連するすべてのコードを削除して、さらにいくつかの小さな調整がなされました。まず、ECMA-262はUnicode標準のサポートを要求しています(多言語のサポートのためです)。次に、オブジェクトがプラットフォーム无关であることを要求しています(NetscapeのJavaScript 1.1は実際には異なるオブジェクト実装を持っており、例えばDateオブジェクトはプラットフォーム依存です)。これがJavaScript 1.1と1.2がECMA-262規格第1版に合致しない主な理由です。

ECMA-262 の第2版のほとんどの更新は編集的なものでした。この標準の更新は、ISO/IEC-16262 との厳密な一致を図るために行われ、特別に追加、変更、削除された内容はありません。ECMAScript は一般的に第2版に従いません。

ECMA-262 第3版は、この標準が初めて実際の更新を受けました。文字処理、エラーデータ、数値出力の更新が提供されました。同時に、正規表現、新しい制御構造、try...catch 異常処理のサポート、および標準の国際化を図るための小さな変更が追加されました。一般的には、ECMAScript が本格的なプログラミング言語として認められることを示しています。

2. ECMAScript の適合性とは何か

ECMA-262 では、ECMAScript の適合性(conformance)が明確に定義されています。スクリプト言語は以下の四つの基本的な原則を満たす必要があります:

  • 基準に従った実装は、ECMA-262 で説明されているすべての「タイプ、値、オブジェクト、属性、関数、プログラム言語およびセマンティクス」をサポートする必要があります(ECMA-262、第1ページ)。
  • 基準に従った実装は、Unicode 字符標準(UCS)をサポートする必要があります。
  • 基準に従った実装は、ECMA-262 で指定されていない「追加のタイプ、値、オブジェクト、属性、関数」を追加できます。ECMA-262 はこれらの追加を規格の未指定の新しいオブジェクトまたはオブジェクトの新しい属性として説明します。
  • 基準に従った実装は、ECMA-262 で定義されていない「プログラムおよび正規表現の構文」(内蔵の正規表現のサポートを置き換えたり拡張したりできる意味)をサポートできます。

すべての ECMAScript 実装は上記の基準に従う必要があります。

3. Web ブラウザでの ECMAScript のサポート

JavaScript 1.1 を含む Netscape Navigator 3.0 は 1996 年に発表されました。それから、JavaScript 1.1 の規格は新しい標準の草案として EMCA に提出されました。JavaScript の画期的な人気により、Netscape は 1.2 版の開発を非常に喜んで始めました。しかし、問題があります。ECMA は Netscape の草案を受け入れませんでした。Netscape Navigator 3.0 が発表されてすぐに、マイクロソフトが IE 3.0 を発表しました。このバージョンの IE には JScript 1.0(マイクロソフトの独自の JavaScript 実装の名前)が含まれており、JavaScript 1.1 と並ぶことを予定していました。しかし、文書が不完全で、いくつかの不適切な重複特性により、JScript 1.0 は JavaScript 1.1 に比べて遠く及びませんでした。

ECMA-262 第1版が最終決定される前に、JavaScript 1.2 を含む Netscape Navigator 4.0 が 1997年にリリースされました。その年の後半には、ECMA-262 标準が承認され標準化されました。したがって、JavaScript 1.2 は ECMAScript 第1版と互換性がなく、ECMAScript は JavaScript 1.1 に基づくべきでした。

JScript の次のステップは、IE 4.0 に追加された JScript 3.0(2.0 版は IIS 3.0 とともにリリースされましたが、ブラウザには含まれませんでした)。マイクロソフトは JScript 3.0 を世界で初めて ECMA 标準に完全に準拠したスクリプト言語であると大々的に宣伝しました。その時、ECMA-262 はまだ最終決定されていませんでしたので、JScript 3.0 も JavaScript 1.2 と同じ運命を辿り、最終的な ECMAScript 标準に準拠することはできませんでした。

Netscape は Netscape Navigator 4.06 で JavaScript 実装をアップグレードしました。JavaScript 1.3 で Netscape はようやく ECMAScript 第1版に完全に準拠しました。Netscape は Unicode スタンダードのサポートに参加し、すべてのオブジェクトが JavaScript 1.2 で導入された新機能を維持しつつプラットフォーム独立を実現しました。

Netscape がそのソースコードを Mozilla プロジェクトとして公表した際、本来は JavaScript 1.4 が Netscape Navigator 5.0 に組み込まれる予定でした。しかし、急進的な決定 - Netscapeのコードを全く新しいデザインから作り直すという決定がこの作業を妨げました。JavaScript 1.4 は単に Netscape Enterprise Server のサーバースクリプト言語としてリリースされ、その後もブラウザに組み込まれませんでした。

現在、すべての主要な Web ブラウザは ECMA-262 第3版に従っています。

以下のテーブルは、多くの人気WebブラウザでのECMAScriptのサポートを示しています:

ブラウザ DOMの互換性
Netscape Navigator 2.0 -
Netscape Navigator 3.0 -
Netscape Navigator 4.0 - 4.05 -
Netscape Navigator 4.06 - 4.79 エディション1
Netscape 6.0+ (Mozilla 0.6.0+) エディション3
Internet Explorer 3.0 -
Internet Explorer 4.0 -
Internet Explorer 5.0 エディション1
Internet Explorer 5.5+ エディション3
Opera 6.0 - 7.1 エディション2
Opera 7.2+ エディション3
Safari 1.0+/Konqueror ~ 2.0+ エディション3

DOM

DOM(ドキュメントオブジェクトモデル)は、HTMLとXMLのアプリケーションインターフェース(API)です。DOMは、ページ全体をノード階層で構成するドキュメントとして計画します。HTMLやXMLのページの各部分は、ノードの派生体です。以下のHTMLページを考えてみてください:

<html>
  <head>
    <title>サンプルページ</title>
  </head>
  <body>
    <p>こんにちは、世界!</p>
  </body>
</html>

このコードはDOMを使ってノード階層図として描かれることができます:

DOMノード階層図

DOMは、ドキュメントを木構造で表現し、開発者がドキュメントの内容と構造に対する圧倒的な制御力を持ちます。DOM APIを使えば、簡単にノードを削除、追加、または置き換えることができます。

1. DOMがなぜ不可欠か

IE 4.0とNetscape Navigator 4.0から、異なる形式の動的HTML(DHTML)をサポートし始めて以来、開発者はページの外観や内容をリロードしないで変更できるようになりました。これはWeb技術の大きな進歩でしたが、大きな問題も引き起こしました。Netscapeとマイクロソフトはそれぞれ独自のDHTMLを開発し、Web開発者がすべてのブラウザでアクセスできるように一つのHTMLページを書くことができる時代が終わりました。

業界は、Webのプラットフォーム間の互換性を維持するために何かをしなければならないと決定しました。彼らは、Netscapeとマイクロソフトがこれを行った場合、Webは二つの独立した部分に分断されることを恐れ、それぞれの部分は特定のブラウザにのみ適用されることになります。したがって、Web通信標準を指定する責任がある団体W3C(World Wide Web Consortium)は、DOMの制定を開始しました。

2. DOMの各レベル

DOM Level 1は1998年10月にW3Cが提案しました。それは2つのモジュールで構成されており、DOM CoreとDOM HTMLです。前者はXMLに基づくドキュメントの構造図を提供し、ドキュメントの任意の部分にアクセスおよび操作するために使用されます;後者はDOM CoreにHTML専用のオブジェクトとメソッドを追加し、DOM Coreを拡張します。

DOMはJavaScript専用ではありません。実際、多くの他の言語が実装しています。ただし、WebブラウザのDOMはECMAScriptで実現されており、現在はJavaScript言語の非常に重要な一部です。

DOM Level 1は、ドキュメントの構造を計画するゴールであり、DOM Level 2のゴールはもっと広範です。原始のDOMに対する拡張は、マウスとユーザーインターフェースイベント(DHTMLが豊富にサポートしている)、範囲、遍歴(DOMドキュメントのメソッドを繰り返し実行する)のサポートを追加し、CSS(カラフルなスタイルシート)のサポートをオブジェクトインターフェースで追加しました。Level 1で導入された原始のDOM CoreもXML名前空間のサポートが追加されました。

DOM Level 2では、新しいインターフェースタイプを処理するためにいくつかの新しいDOMモジュールが導入されました:

  • DOM ビュー - ドキュメントのさまざまなビュー(CSSスタイル化前後のドキュメント)を追跡する説明
  • DOM イベント - イベントのインターフェースの説明
  • DOM スタイル - CSSスタイルに基づくインターフェースの説明
  • DOM 過去と範囲 - ドキュメントツリーを操作するインターフェースの説明

DOM Level 3では、ドキュメントの読み込みと保持を統一した方法(DOM Load and Saveとして新たに追加されたモジュール)およびドキュメントの検証(DOM Validation)の方法が導入され、DOMがさらに拡張されました。Level 3では、DOM CoreはXML 1.0のすべての特性をサポートするようになり、XML Infoset、XPath、XML Baseを含みます。

DOMを学ぶ際に、DOM Level 0が参照されることがあります。ただし、DOM Level 0という標準は存在しません。それはDOMの歴史的な参照点に過ぎず(DOM Level 0はIE 4.0とNetscape Navigator 4.0でサポートされていた原始のDHTMLを指します)。

3. 他の DOM

DOM Core と DOM HTML に加えて、他のいくつかの言語が独自の DOM 标準を発行しています。これらの言語はすべて XMLに基づいており、それぞれのDOMは対応する言語に特有のメソッドとインターフェースを追加しています:

  • 可縮尺ベクターリング言語(SVG)1.0
  • デジタルマークアップ言語(MathML)1.0
  • 同期マルチメディア統合言語(SMIL)

注釈:さらに詳しい情報を学びたい場合は、CodeW3Cの SMIL チュートリアルSVG チュートリアル

また、他の言語も独自のDOM実装を開発しており、例えばMozillaのXMLユーザーアイデンティティ言語(XUL)があります。しかし、上記に示したような言語だけがW3Cの推奨標準です。

4. WebブラウザにおけるDOMサポート

DOMはWebブラウザが実装する前にすでに標準でした。IEがDOMを初めて試みたのは5.0バージョンで、実際には5.5バージョン以降に本格的なDOMサポートが得られました。IE 5.5はDOMレベル1を実現しました。それ以来、IEは新しいDOM機能を導入していません。

NetscapeはNetscape 6(Mozilla 0.6.0)までDOMサポートを導入しました。現在、Mozillaは最も優れたDOMサポートを持ち、完全なレベル1、ほぼすべてのレベル2、一部のレベル3を実現しています。(Mozilla開発チームの目標は、標準と100%互換性のあるブラウザを作ることであり、彼らの努力は報われました。)

Operaは7.0バージョンまでDOMサポートを追加し、SafariもDOMレベル1のほぼすべてを実現しました。これらはほぼすべてIE 5.5と同じレベルであり、一部の情况下、IE 5.5を超えています。しかし、DOMのサポートにおいては、すべてのブラウザはMozillaに遠く及びません。以下の表に、一般的なブラウザのDOMサポートを示します。

ブラウザ DOMの互換性
Netscape Navigator 1.0 - 4.x -
Netscape 6.0+ (Mozilla 0.6.0+) レベル1、レベル2、レベル3(一部)
IE 2.0 - 4.x -
IE 5.0 レベル1(最小)
IE 5.5+ レベル1(ほぼすべて)
Opera 1.0 - 6.0 -
Opera 7.0+ レベル1(ほぼすべて)、レベル2(一部)
Safari 1.0+/Konqueror ~ 2.0+ レベル1

注釈:DOMの知識をさらに学びたい場合は、CodeW3Cの HTML DOM チュートリアルXML DOM チュートリアル

BOM

IE 3.0 と Netscape Navigator 3.0 は、BOM(ブラウザオブジェクトモデル)という機能を提供しており、ブラウザウィンドウにアクセスおよび操作できます。BOM を使用すると、開発者はウィンドウを移動、ステータスバーのテキストを変更、ページ内容に関連しない他のアクションを実行することができます。BOM が特異的でまた疑問視される理由は、それは JavaScript の一部であり、関連する標準が存在しないことです。

BOM は主にブラウザウィンドウとフレームを処理しますが、通常、ブラウザ固有の JavaScript エクステンションは BOM の一部として見なされます。これらのエクステンションには:

  • 新しいブラウザウィンドウを弹出
  • ブラウザウィンドウの移動、閉じる、およびサイズの調整
  • Web ブラウザの詳細情報を提供するロケーションオブジェクト
  • ユーザーのスクリーン解像度の詳細情報を提供するスクリーンオブジェクト
  • cookie のサポート
  • IE は BOM を拡張し、ActiveXObject クラスを追加し、JavaScript で ActiveX オブジェクトをインスタンス化できます

関連する BOM スタンダードがないため、各ブラウザは独自の BOM 実装を持っています。実際の標準として、ウィンドウオブジェクトとナビゲーションオブジェクトを持つものがありますが、各ブラウザはこれらのオブジェクトや他のオブジェクトに対して独自の属性やメソッドを定義できます。

参照: