差分

このページの2つのバージョン間の差分を表示します。

--- javascript [2011/06/27 06:24] – [DOM (Document Object Model)] nullpon
+++ javascript [2015/07/29 10:01] (現在) – nullpon
@@ 行 1: / 行 1: @@
 ====== JavaScript ======
-JavaScriptはオブジェクト指向スクリプト言語。主にブラウザ上でDHTMLの実現、ユーザ操作の補助、Ajaxと呼ばれる手法で高度なWebアプリケーション作成に利用される。
+JavaScriptはオブジェクト指向スクリプト言語。
+Webブラウザ上で動作するスクリプト言語として主に使用されてきたが、node.jsの登場よってWebアプリケーションのサーバサイド実装にも利用されるようになってきた。
+ページ整理中
+  * [[JavaScript]] 名前空間は主にブラウザで動作するJavaScriptの話題を扱う
+  * 言語仕様的な話は [[ECMAScript]] 名前空間で
+  * node.jsの話は [[nodejs]] 名前空間で
 ===== 仕様 =====
   * ECMAScript - 言語仕様。
   * DOM - XMLやHTMLを扱うためのAPI仕様。表示されているHTML文書のDOMをJavaScriptで操作することでWebページを操作する。
   * E4X - JavaScript中で直接XMLを扱うためのECMAScript拡張仕様、ブラウザによっては全く動かないのであまり使われていない。
-==== ECMAScript ====
+ECMAScriptにはHTML文書の操作（DHTML）の仕様は定められていない。DHTMLに関する仕様はw3cのDOMによって決められている。
-JavaScriptの言語仕様部分。最新の仕様はECMA-262 5th Editionで文書化されている。現在の主要なブラウザが実装している仕様はECMAScript 3rd Editionであるが、最新のブラウザでは既に5thの一部の仕様が実装されている。
-  * [[http://www.ecma-international.org/publications/standards/Ecma-262.htm|ECMA-262 5th Edition]]
-  * [[http://www.ecma-international.org/publications/standards/Ecma-262-arch.htm|ECMA-262 Archives]]
-ECMAScriptは言語仕様であり、HTML文書の操作（DHTML）の仕様は一切定められていない。DHTMLに関する共通仕様はW3CのDOMによって決められている。
   * ネイティブオブジェクト - ECMAScript仕様で定義されているオブジェクト。StringやArray。
   * ホストオブジェクト - 実行環境が提供するオブジェクトでECMAScriptの仕様外のもの。windowやDOMオブジェクト、XMLHttpRequest。
-DOM以外のホストオブジェクト（window、navigator、location、history 等）には標準仕様がなく各ブラウザベンダが互いに様子見したり、協力しつつ実装しているようだ。ただ、XMLHttpRequestについては[[html:html5]]で仕様化されるようだ。
+DOM以外のホストオブジェクト（window、navigator、location、history 等）には標準仕様がなく各ブラウザベンダが互いに様子見したり、協力しつつ実装しているようだ。新しいAPIについてはwhatwgによって仕様化が進められている。
-==== プロトタイプベースオブジェクト指向 ====
-Java等のオブジェクト指向はクラスベースのオブジェクト指向と呼ばれる。一方、JavaScriptはプロトタイプベース、あるいはインスタンスベースオブジェクト指向と呼ばれる。
-クラスベースは、まず振る舞いとデータをクラスとして定義し、クラスを型とするインスタンスを作成する。そしてクラスで定義した操作を組み合わせてプログラミングする。プロトタイプベースでは、まずインスタンスを作成し、そのインスタンスに独自の性質を付加してプログラミングする。また別のインスタンスをプロトタイプとすることでプロトタイプとなったインスタンスの性質を引き継ぐことができる。
-クラスに縛られないため、実行中の任意の場所でプロパティやメソッドをオブジェクト毎に変更したり、新しく追加したり、削除したりすることができる。これはStringやwindow等のビルトインオブジェクトも例外ではなく、同じStringのオブジェクトでもオブジェクトごとに別の振る舞いを持たせる事もできる
-<code javascript>
-var a = new String("JavaScript");
-var b = new String("JavaScript");
-b.toString = function() { return this.valueOf() + "にゃー"; };
-console.log(a.toString());  // "JavaScript"
-console.log(b.toString());  // "JavaScriptにゃー"
-</code>
-===== JavaScript言語 =====
-  * [[javascript:function|関数]]
-  * [[javascript:closure|クロージャ]]
-  * [[javascript:object|オブジェクト]]
-  * [[javascript:class|クラス]]
-  * [[javascript:inherit|継承とオーバーライド]]
-  * [[javascript:generator|ジェネレータ]]
-===== TIPS =====
-  * [[javascript:extendsString|Stringを拡張する]]
-  * [[javascript:stringReplace|String#replaceに関数を渡す]]
 ===== DOM (Document Object Model) =====
@@ 行 53: / 行 29: @@
   * [[javascript:css|JavaScriptでCSSを動的に定義する]]
   * [[javascript:addEventListener|addEventListenerメソッドのuseCaptureについて]]
 ===== Ajax (Asynchronous JavaScript and XML) =====
   * [[ajax]]
@@ 行 61: / 行 38: @@
   * [[javascript/bookmarklet]]
-===== 実行環境 =====
-==== ECMAScriptの処理系 ====
-  * [[https://developer.mozilla.org/ja/Rhino|Rhino - MDC]] - Javaで書かれたJavaScriptエンジン、JDK6に付属しているJavaScriptエンジンはこれ。
-  * JScript - WSH(Windows付属のスクリプト実行環境)、IEのJavaScriptエンジン、ASPの記述言語として利用される。WSHはWindowsコマンドプロンプト上で実行できる他、.js拡張子のスクリプトをダブルクリックで実行可能。最新版では、ActiveXオブジェクトや、.NETクラスライブラリを使うこともできる。
-==== ブラウザのJSエンジン ====
-  * SpiderMonkey - Firefox3のJavaScriptエンジン
-  * TraceMonkey - Firefox3.1、JIT技術による大幅な高速化
-  * JavaScriptCore - Safari
-  * Nitro - Safari4 (SquirrelFish Extremeから改名？)
-  * V8 - Google Chrome
-===== ライブラリ =====
-言語機能拡張、ウィジェット・GUIコンポーネントの提供、クロスブラウザ、Ajax処理の簡易化等の機能を提供する。
-^ ライブラリ ^ ライセンス ^ メモ ^
-| [[http://www.prototypejs.org/|prototype.js]] | MIT | これに依存するライブラリが多い。  |
-| [[http://script.aculo.us/|script.aculo.us]] | MIT | prototype.jsにエフェクト等の機能を追加する拡張ライブラリ |
-| [[http://www.dojotoolkit.org/|Dojo Toolkit]] | [[http://dojotoolkit.org/about/license|AFL v2.1]] | 全部入りの重量級ライブラリ |
-| [[http://openrico.org/rico/home.page|rico]] | Apache 2.0  | prototype.js依存 |
-| [[http://mochikit.com/|Mochikit]] | MIT or AFL v2.1 | 軽量 |
-| [[jQuery]] | [[http://docs.jquery.com/Licensing |MIT or GPL]]  | prototypeを抜きトップ独走中 |
-| [[http://ui.jquery.com/|jQuery UI]] | [[http://docs.jquery.com/Licensing|MIT or GPL]]  | jQueryにUIコンポーネントを追加 |
-| [[http://extjs.com/|Ext JS]] | [[http://extjs.com/license|LGPL 3.0]] | prototype.js、YUI、jQueryにコンポーネントを追加する。単体でも動作可能、重い |
-| [[http://developer.yahoo.com/yui/|YUI]] | BSD | Yahoo!が作成したライブラリ |
-| [[http://mootools.net/|MooTools]] | MIT | 軽い |
-その他
-  * [[http://livepipe.net/projects/control_modal/|Cotrol.Modal]] LightBox風モーダルダイアログ作成ライブラリ、要prototype.js
-  * [[http://www.kawa.et/works/js/jkl/calender.html|jkl.calendar]] とりあえずカレンダーが欲しいときに便利
-  * [[http://www.sproutcore.com/|SproutCore]] JavaScript単体ライブラリではなくサーバサイドとセットになっており、アプリケーション作成に特化されている
-巨大ライブラリで通信負荷が気になる場合は、Gzip圧縮転送などを使う。
-==== Google AJAX Libraries API ====
-GoogleのサーバからjQuery等の各種ライブラリを取得できる。これを用いる事で開発者にはダウンロード設置の手間が省け、運用では負荷の低減、ユーザにはライブラリのキャッシュヒットの可能性が高くなり、高速化が期待できる（かも…）
-http://code.google.com/intl/ja/apis/ajaxlibs/
-直接読み込む
-  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" />
-googleのライブラリを通して取得する
-  <script src="http://www.google.com/jsapi"></script>
-  <script>
-    google.load("jquery", "1.3.1");
-  </script>
-==== JavaScript WYSIWYGエディタ ====
-  * [[http://www.fckeditor.net/|FCKeditor]]
-  * [[http://tinymce.moxiecode.com/|TinyMCE]]
-  * [[http://code.google.com/p/jwysiwyg/|jwysiwyg]]
-[[http://kyms.ne.jp/siteman/item_218.html|TinyMCEとFCKeditorの違いを比較]]、TinyMCEは複数の1つのインスタンスで複数のテキストエリアに対応できるので、1画面上に二つのエディタを置くとき圧倒的に速い。
-jwysiwygはjQueryプラグインとして提供されるライブラリ。