The Wayback Machine - https://web.archive.org/web/20161120204814/https://ja.wikipedia.org/wiki/JavaScript

JavaScript

出典: フリー百科事典『ウィキペディア（Wikipedia）』
移動先: 案内、 検索
ウィキペディア ウィキペディアにおけるJavaScriptの使用についてはWikipedia:カスタムJSをご覧ください。
JavaScript
パラダイム マルチパラダイム
登場時期 1995年
設計者 ブレンダン・アイク
開発者 ネットスケープコミュニケーションズ、Mozilla Foundation
最新リリース 1.8 / 2008年
評価版リリース 1.9.3 / 2010年
型付け ダック・タイピング
主な処理系 JavaScriptCore、KJS、Nitro、Rhino、SpiderMonkey、V8ほか
方言 JScript
影響を受けた言語 C言語、Java、Perl、Python、Scheme、Self
影響を与えた言語 Dart、Objective-J（英語版）
プラットフォーム クロスプラットフォーム
拡張子 .js
Wikibooks logo JavaScript - ウィキブックス

JavaScriptとは、プログラミング言語のひとつである。Javaと名前が似ているが、異なるプログラミング言語である（後述の#歴史を参照）。

一般的に、プロトタイプベースのオブジェクト指向スクリプト言語であると言われている。しかし、コンストラクタなどのクラスベースに見られる機能も取り込んでいる。

実行環境が主にウェブブラウザに実装され、動的なウェブサイト構築や、リッチインターネットアプリケーションなど高度なユーザインタフェースの開発に用いられる。

2010年以降は、軽量かつ高速なサーバサイドJavaScript実行環境やライブラリの充実により、MEANに代表されるように、Web開発の全ての領域で活用されるようになってきている。

概要[編集]

JavaScriptという言葉は狭義にはMozillaが仕様を策定し実装しているスクリプト言語を指す。このスクリプト言語はEcmaインターナショナルでECMAScript (ECMA-262) として標準化されており、多くのウェブブラウザ等はこの標準化されたECMAScriptを実装している。たとえば、マイクロソフトによる実装はJScriptと呼ぶ。

一般的にJavaScriptという言葉が使われるときはこのようなさまざまなECMAScriptの実装も含んだ幅広い意味でつかわれるので、どちらの意味でJavaScriptという言葉が使われているかは文脈で判断する必要がある[1]。

ECMAScriptは仕様自体に独自の拡張を条件付きで認める記述があり[2]、現在主要なブラウザが実装しているスクリプト言語はすべてECMAScriptに準拠していることになる。広義の意味でこれをJavaScriptと呼ぶ場合、主要なブラウザが実装しているスクリプト言語はマイクロソフトやGoogle、アップルの実装も含めてJavaScriptである。

なお、ウェブブラウザでよく実装されているAPIであるDOM (Document Object Model) はECMAScriptの仕様の一部ではないので、DOMの準拠の有無はECMAScriptの準拠の有無とは関係ない[3]。

プログラミング言語としての特徴[編集]

一般的に、JavaScriptはプロトタイプベースのオブジェクト指向プログラミング言語であると言われている(クラスベースの言語と同様に、オブジェクト生成時にnew演算子を使ってコンストラクタを呼び出す場合が多いなど、厳密にはプロトタイプベースとクラスベースのハイブリッドと呼ぶべきである)。多くの場合はC言語に似た手続き型言語のようなスタイルで書かれるが、第一級関数をサポートしている（関数を第一級オブジェクトとして扱える）など、関数型言語の性質も持ち合わせている。そのような柔軟な設計から、いくつかのアプリケーションではマクロ言語としても採用されている[4]。

AptanaやEclipse、NetBeans、IntelliJ IDEAなどの統合開発環境はJavaScriptをサポートしており、大規模開発が可能になっている。また各処理系の実装の違いによる互換性の問題は、Prototype JavaScript FrameworkなどのJavaScriptライブラリが吸収することにより解決が図られている。さらにExt JSなどの本格的なGUIライブラリの登場により、デスクトップアプリケーションと遜色ないユーザインタフェースの構築が可能になった。

また、Direct Web Remoting (DWR) などの技術の発達によりクライアント・サーバ間の通信が著しく容易になったことや、JettyなどのアプリケーションサーバがComet利用時のメモリ使用量の削減を実現したため、サーバからクライアントへの情報のプッシュ型の配信が実用的となった。

JavaScriptはスレッド制御の命令をサポートしていないため、マルチスレッドのコードを書くことが困難だが、WHATWGによりWeb Workers[5] APIの策定が進められており、バックグラウンド処理や非同期入出力の制御が容易に実現できるようになる。

歴史[編集]

誕生[編集]

JavaScriptはネットスケープコミュニケーションズのブレンダン・アイクによって開発され、Netscape Navigator 2.0で実装された。開発当初はLiveScriptと呼ばれていたが、1995年にサン・マイクロシステムズ（現・オラクル）が開発したプログラミング言語Javaが当時大きな注目を浴びており、ネットスケープとサン・マイクロシステムズが業務提携していた事もあったため、JavaScriptという名前に変更された[6][7]。

1996年にマイクロソフトのInternet Explorer 3.0に搭載されるようになると、その手軽さからJavaScriptは急速に普及していく。1997年、通信に関する標準を策定する国際団体EcmaインターナショナルによってJavaScriptの中核的な仕様がECMAScriptとして標準化され[8]、多くのウェブブラウザで利用できるようになった。

ネットスケープは、ウェブアプリケーション開発言語として自社のサーバ製品に実装したLiveWire JavaScriptも発表したが[7]、こちらはあまり普及しなかった。

JavaScriptの登場初期は、ブラウザベンダー間で言語仕様の独自拡張が行われていたため、ブラウザ間の互換性が極めて低かった。しかし現在では、ECMAScriptの策定により実装間の互換性は向上し、DOMなど関連仕様の実装に関する互換性も比較的高くなっている。ただ、現在でも特定のブラウザでしか実行できないECMAScript以前の古い構文や、ブラウザ独自のDOMを使ったコードが使用されている場合があり、互換性の問題が完全に解消されたわけではない。

現在[編集]

市場のブラウザ間互換性がある程度確立された2000年頃には、GoogleやAmazon等の大手企業もJavaScriptを積極的に利用し始めた。2005年、マイクロソフトが開発したJavaScriptの非同期通信を利用した技術にAjaxという名前が付けられたことによって、高機能なウェブアプリケーション開発言語の一つとして再び注目を集めた。Ajaxを利用している代表的なアプリケーションとして、Google マップ[1]やAmazon Diamond Search[2]などがある。

また最近では、Mozilla Firefox用アドオンのGreasemonkeyやOperaの標準機能、Google Chromeのエクステンションなどにおいて、「ユーザスクリプト」と呼ばれるウェブページ読み込み時に実行できるJavaScriptアプリケーションが登場している。

以前はインタプリタ方式で実行されることが一般的であったため、実行速度はさほど速くなかったが、現在ではJITコンパイルなどを利用した各種の最適化がなされており、各ウェブブラウザのベンダーともに高速化を図ってしのぎを削っている。さらには、この高速化を受ける形で、Node.jsのようにサーバサイドでもJavaScriptを使う動きが見られる。

JavaScript 2.0[編集]

2000年から2003年にかけて、現在のJavaScriptの後継バージョンとなるJavaScript 2.0を作ろうとした動きがあったが、ネットスケープとマイクロソフトの対立でまとまらなかった。当時ネットスケープが提案していた案はアドビのActionScript 2.0に引き継がれ、マイクロソフトの案はJScript .NETへと引き継がれた。その後ECMAScript 4の策定が進められ、2006年の時点でMozilla Foundationはこれに基づいてJavaScript 2.0を作成することを表明していた。MozillaはECMAScript 4の策定にあたって、Pythonの文法を一部取り込んだ案を提案しており、自身でもこれを実装している[9]。

しかしその後、ECMAScriptの標準化作業がMozilla、Adobe、Opera、Googleらが推すECMAScript 4と、Microsoft、Yahoo!らが推すECMAScript 3.1に事実上分裂してしまった影響から、2008年8月に大きな方針転換があり、JavaScript 2.0のベースを策定するプロジェクトとして新たに「ECMAScript Harmony」が発足した。同プロジェクトではECMAScript 3.1をベースとしつつも、ECMAScript 4に入る予定だった機能のいくつかを取り込む形で標準を策定する予定となっている。なお、ECMAScript 4で導入された名前空間・パッケージなどの機能は導入されない[10]。

文法[編集]

詳細は「JavaScriptの文法（英語版）」を参照

基本的な文法[編集]

JavaScriptの変数は var キーワードを使用して宣言できる[11]。

var x; // 変数xの宣言。値が未指定のため、特殊な値である undefined の状態となる。
var y = 2; // 変数yの宣言。同時に 2 が設定される。

上記例のスラッシュ2文字以降はコメントである。

JavaScriptは言語仕様にI/Oが組み込まれておらず、それらは実行環境により提供される。ECMAScript 5.1の仕様では以下のように言及されている。[12]

この仕様の中では外部データの入力または計算結果の出力は供給しない。
(… indeed, there are no provisions in this specification for input of external data or output of computed results.)

しかしながら、ほとんどの実行環境は console オブジェクトを持っており[13]、そこにコンソール出力を行える。以下に最小のHello worldプログラムを示す。

console.log("Hello World!");

再帰関数は以下のように書ける。

function factorial(n) {
    if (n == 0) {
        return 1;
    }
    return n * factorial(n - 1);
}

無名関数（またはラムダ式）の構文とクロージャの例は以下である。

var displayClosure = function() {
    var count = 0;
    return function () {
        return ++count;
    };
}
var inc = displayClosure();
inc(); // 1 が返る
inc(); // 2 が返る
inc(); // 3 が返る

可変長引数は以下のように記述する（arguments は特殊な変数である）。[14]

var sum = function() {
    var i, x = 0;
    for (i = 0; i < arguments.length; ++i) {
        x += arguments[i];
    }
    return x;
}
sum(1, 2, 3); // 6 が返る

即時実行関数式（英語版） (IIFE) の例。JavaScriptはブロックスコープを持たないが、関数を用いることで変数をクロージャに閉じ込めることができる。

var v;
v = 1;
var getValue = (function(v) {
  return function() {return v;};
})(v);

v = 2;

getValue(); // 1 が返る

複雑な例[編集]

以下のサンプルコードは、様々なJavaScriptの機能を示したものである。

/* 2つの数値の最小公倍数を求める */
function LCMCalculator(x, y) { // コンストラクタ関数
    var checkInt = function (x) { // 入れ子の関数
        if (x % 1 !== 0) {
            throw new TypeError(x + " is not an integer"); // 例外のスロー
        }
        return x;
    };
    this.a = checkInt(x)
    //   行末のセミコロンはオプション。改行でも可
    this.b = checkInt(y);
}
// オブジェクトのプロトタイプはコンストラクタ関数の prototype プロパティに格納する
LCMCalculator.prototype = { // オブジェクトリテラル
    constructor: LCMCalculator, // このようにプロトタイプを上書きする場合は、
                                // constructorプロパティにコンストラクタ関数名を再指定する
    gcd: function () { // 最大公約数を計算するメソッド
        // 「ユークリッドの互除法」アルゴリズムで計算
        var a = Math.abs(this.a), b = Math.abs(this.b), t;
        if (a < b) {
            // 変数の入れ替え
            t = b;
            b = a;
            a = t;
        }
        while (b !== 0) {
            t = b;
            b = a % b;
            a = t;
        }
        // 最大公約数の計算は一度でよいため、自分自身を計算済みの結果を返すメソッドで再定義（上書き）する。
        // （これにより LCMCalculator.prototype.gcd の代わりに this.gcd が呼ばれるようになる。
        //   ただし、計算後にプロパティ a や b が変更されてしまうと、結果は誤りとなる。）
        // なお 'gcd' === "gcd", this['gcd'] === this.gcd である。
        this['gcd'] = function () {
            return a;
        };
        return a;
    },
    lcm : function () { // 最小公倍数を計算するメソッド
        // 変数名は、オブジェクトのプロパティと衝突しない。例）lcm は this.lcm とは異なる。
        // 以下では、浮動小数の精度の問題を避けるために this.a * this.b としていない。
        var lcm = this.a/this.gcd()*this.b;
        // 最小公倍数の計算も一度でよいため、自分自身を計算済みの結果を返すメソッドで再定義（上書き）する。
        this.lcm = function () {
            return lcm;
        };
        return lcm;
    },
    toString: function () {
        return "LCMCalculator: a = " + this.a + ", b = " + this.b;
    }
};

// 汎用の出力関数の定義。この実装はWebブラウザ上でのみ動作する。
function output(x) {
    document.body.appendChild(document.createTextNode(x));
    document.body.appendChild(document.createElement('br'));
}

// 注、配列の map() と forEach() は JavaScript 1.6 で追加されたメソッドである。
// クラス生成と出力呼び出し。JavaScriptの関数の特性を利用した書き方。
[[25, 55], [21, 56], [22, 58], [28, 56]].map(function (pair) { // 配列リテラル + マッピング関数
    return new LCMCalculator(pair[0], pair[1]);
}).sort(function (a, b) { // 指定した比較関数を用いたソート
    return a.lcm() - b.lcm();
}).forEach(function (obj) {
    output(obj + ", gcd = " + obj.gcd() + ", lcm = " + obj.lcm());
});

上記コードをウェブブラウザ上で実行すると、以下の結果が表示される。

LCMCalculator: a = 28, b = 56, gcd = 28, lcm = 56
LCMCalculator: a = 21, b = 56, gcd = 7, lcm = 168
LCMCalculator: a = 25, b = 55, gcd = 5, lcm = 275
LCMCalculator: a = 22, b = 58, gcd = 2, lcm = 638

Webページでの使用[編集]

「ダイナミックHTML」および「Ajax」も参照

JavaScriptは主にHTMLページにクライアント側のふるまいを持たせるために用いられており、これはダイナミックHTML (DHTML) としても知られている。JavaScriptはHTMLに直接埋め込まれまたはインクルードされ、Document Object Model (DOM) と組み合わせて用いられる。JavaScriptの使用例としては、以下のようなものがある。

  • ページの再読み込みなしで新しいコンテンツを読み込むまたはAjaxを用いてサーバーに投稿する（例、SNSでページを離れることなく新しい投稿を表示する）。
  • ページ要素のアニメーション、フェードイン/アウト、リサイズ、移動などを行う。
  • ゲームや音楽、映像再生といった動的なコンテンツ。
  • データをサーバーに送信せずにフォーム入力値の検証（英語版）を行う。
  • Web解析（英語版）や広告追跡（英語版）、パーソナライゼーションなどのためにユーザーの閲覧情報を収集する。[15]

JavaScriptはサーバーではなくユーザーのブラウザ上で動作できることから、ユーザーの操作に対して素早く反応することができ、アプリケーションをよりレスポンシブにすることができる。さらにJavaScriptはHTML単独では対応できない操作、例えばキー入力などにも応答することができる。Gmailのようなアプリケーションでは、JavaScriptでUIロジックを実装し、さらにJavaScriptでサーバーから情報（例えばeメールのメッセージ）を取得することで、こうしたメリットを享受している。このような利点からAjaxは大きなトレンドとなった。

JavaScriptエンジン（英語版）（またはJavaScriptインタプリタやJavaScript実装）は、JavaScriptのソースコードを解釈してプログラムを実行するインタプリタである。最初のJavaScriptエンジンはネットスケープコミュニケーションズのブレンダン・アイクによりNetscape Navigatorウェブブラウザのために作成されたものであった。このエンジンはSpiderMonkeyと呼ばれており、C言語で実装されていた。これは後にECMA-262 Edition 3を満たすためにアップデートされた (JavaScript 1.5)。Rhinoエンジンも同じくNetscapeのNorris Boyd（後にGoogleに移籍）が主となって作成したもので、Javaにより実装されている。RhinoもECMA-262 Edition 3に準拠している。

ウェブブラウザはJavaScriptの最も主要な実行環境である。ウェブブラウザは通常、Document Object Model (DOM) を扱うためのホストオブジェクトを提供する。一方でWebサーバもまた、JavaScriptの実行環境の一つとして存在する。JavaScriptのWebサーバでは、HTTPリクエストやレスポンスが直接ホストオブジェクトとして提供され、動的にWebページ自体を生成することができる。

JavaScriptは主要ウェブブラウザの大半でサポートされている唯一の言語であることから、意図されたことではなかったが、様々な言語やフレームワークのコンパイル先の出力言語となっている。[16] 動的な言語であることからパフォーマンスが制限されるにも関わらず、JavaScriptエンジンの性能向上によりこうした言語は予想外の発展を見せている。

DOM[編集]

詳細は「Document Object Model」を参照

DOMとは、HTMLやXHTML (XML) で書かれたドキュメントにアクセスするためのAPIである。DOMは多くのプログラミング言語でライブラリやモジュールとして実装されているが、ウェブブラウザと統合しているJavaScriptの処理系では特に言語仕様として組み込まれており[要出典]、DOMオブジェクトを介してアクセスできる。ただし、SpiderMonkeyなど単体のJavaScriptエンジンには組み込まれていない。

例[編集]

以下はJavaScriptとDOMを含むWebページのごく単純な例である（HTML5構文）。

<!DOCTYPE html>
<html>
    <meta charset="utf-8">
    <title>単純な例</title>
    
    <body>
        <h1 id="header">これはJavaScriptです</h1>
        
        <script>
            document.body.appendChild(document.createTextNode('Hello World!'));
        
            var h1 = document.getElementById('header'); // id='header'の<h1>要素の参照を取得。
            h1 = document.getElementsByTagName('h1')[0]; // または<h1>要素を全て取得してそこから先頭を取得。
        </script>
        
        <noscript>表示中のブラウザはJavaScriptをサポートしていないか、OFFになっています。</noscript>
    </body>
</html>

バージョンとブラウザの対応表[編集]

「ECMAScript#バージョン」も参照
バージョン 日付 規格 Netscape
Navigator		 Mozilla
Firefox		 Internet
Explorer		 Opera Safari Google
Chrome
1.0 1996年3月 2.0 3.0
1.1 1996年8月 3.0
1.2 1997年7月 4.0-4.05
1.3 1998年10月 ECMA-262 1st edition / ECMA-262 2nd edition 4.06-4.7x 4.0 5.0
1.4 Netscape
Server		 6.0
1.5 2000年11月 ECMA-262 3rd edition 6.0 1.0 5.5 (JScript 5.5),
6.0 (JScript 5.6),
7.0 (JScript 5.7),
8.0 (JScript 6.0)
1.6 2005年11月 1.5 + Array extras + Array and String generics + E4X 7.0-8.0 1.5 7.0-9.0 3.0, 3.1
1.7 2006年10月 1.6 + Pythonic generators + Iterators + let 2.0 3.2-5.1 1.0-19.0
1.8 2008年7月 1.7 + Generator expressions + Expression closures 3.0
1.8.1 1.8 + Minor Updates 3.5
1.9 1.8.1 + ECMAScript 5[17] Compliance 4.0-11.0

[18]

JavaScriptライブラリ[編集]

代表的なJavaScriptライブラリは以下のとおり。

脚注[編集]

[ヘルプ]
  1. ^ JavaScript 第5版（オライリー・ジャパン、2007）P2。
  2. ^ ECMA-262 第5版 2.Confermance
  3. ^ DOMはW3Cが標準化している。ECMA-262にはDOMへの言及はない。
  4. ^ 例えばAdobe Acrobatは、JavaScriptによるマクロ機能を搭載している。
  5. ^ Web Workers
  6. ^ Marc Andreessen. “INNOVATORS OF THE NET: BRENDAN EICH AND JAVASCRIPT”. 2008年1月22日閲覧。
  7. ^ a b “NETSCAPE AND SUN ANNOUNCE JAVASCRIPT, THE OPEN, CROSS-PLATFORM OBJECT SCRIPTING LANGUAGE FOR ENTERPRISE NETWORKS AND THE INTERNET”. 2008年1月22日閲覧。
  8. ^ ECMA 262, ISO/IEC 16262, JIS X 3060
  9. ^ “Python and JavaScript” (英語). Brendan's Roadmap Updates (2006年2月19日). 2007年9月5日閲覧。
  10. ^ JavaScript 2.0はECMAScript 3.1ベースに、ECMAScript 4は譲歩 - マイコミジャーナル
  11. ^ “var – JavaScript – MDN”. The Mozilla Developer Network. 2012年12月22日閲覧。
  12. ^ “ECMAScript Language Specification – ECMA-262 Edition 5.1”. Ecmaインターナショナル. 2012年12月22日閲覧。
  13. ^ “console”. Mozilla Developer Network. Mozilla. 2013年4月6日閲覧。
  14. ^ “arguments”. Mozilla Developer Network. Mozilla. 2013年4月6日閲覧。
  15. ^ “JavaScript tracking – Piwik”. Piwik. 2012年3月31日閲覧。
  16. ^ Hamilton, Naomi (2008年7月31日). “The A-Z of Programming Languages: JavaScript”. computerworld.com.au. 2016年6月29日閲覧。
  17. ^ 後藤大地 (2009年12月9日). “JavaScriptのブラウザ非互換に解決のみとおし”. journal.mycom.co.jp. 2009年12月9日閲覧。
  18. ^ John Resig. “Versions of JavaScript”. Ejohn.org. 2009年5月19日閲覧。

関連項目[編集]

ウィキブックスにJavaScript関連の解説書・教科書があります。
ウィキメディア・コモンズには、JavaScriptに関連するカテゴリがあります。

外部リンク[編集]

JavaScript
概念
エンジン
コンパイラ
デバッガ
エディタ
サーバーサイド
フレームワーク
・ライブラリ
ユニットテスト
Docジェネレータ
コード解析
パッケージ管理
関連技術
人物
ECMAScript
方言
エンジン
フレームワーク
・ライブラリ
クライアントサイド
サーバーサイド
ライブラリ
人物
その他
プログラミング言語
低水準言語
言語
プロセス
高水準言語
1957年-1959年
1960年代
1970年代
1980年代
1990年代
2000年代
2010年代
「https://ja.wikipedia.org/w/index.php?title=JavaScript&oldid=61843931」から取得

案内メニュー

個人用ツール

名前空間

変種

その他

他のプロジェクト

Morty Proxy This is a proxified and sanitized view of the page, visit original site.