へーほーなるほどね。 クラスとコンストラクタとプロトタイプ †JavaScriptクラスのサブクラス化 †function Rectangle(w, h) { this.width = w; this.height = h; } Rectangle.prototype.area = function() {return this.width * this.height; } //サブクラスの定義 function PositionedRectangle(x, y, w, h){ //width/heightプロパティを初期化 //callメソッドを使ってこのオブジェクトのメソッドとしてコストラクタを呼び出す = コンストラクタチェーン Rectangle.call(this, w, h); this.x= x; this.y = y; } PositionedRectangle.prototype = new Rectangle(); //Rectangleオブジェクトのwidth/heightプロパティは継承したくないので、削除 delete.PositionedRectangle.prototype.width; delete.PositionedRectangle.prototype.height; //PositionedRectangleオブジェクトはRectangleコンストラクタを参照しているので、 //PositionedRectangleコンストラクタを参照するようにconstructorプロパティを変更 PositionedRectangle.prototype.constructor = PositionedRectangle; //プロトタイプオブジェクトにインスタンスメソッドを追加 PositionedRectangle.prototype.contains = function(x, y) { return (x > this.x && x < this.x + this.width && y > this.y && y < this.ty + this.height); } var r = new PositionedRectangle(2,2,2,2); print(r.contains(3,3)); //インスタンスメソッドを呼び出す print(r.area()); //継承したインスタンスメソッドを呼び出す print(r.x + ", " + r.y + " , " + r.width + ", "+ r.hegith); コンストラクタチェーン †//スーパークラスのコン素トラクタの参照を保存する PositionedRectangle.prototype.superclass = Rectangle; //1レベルのサブクラスしかない場合は、サブクラスのプロトタイプオブジェクトに //superclassという名のプロパティを追加すればよい // =>superclassプロパティは継承階層中で一度しか使えない //call()やapply()を使う必要はない function PositionedRectangle(x,y,w,h){ this.superclass(w,h); this.x = w; this.y - y; } オーバーライドされたメソッドを呼び出す †//元 Rectangle.prototype.toString = function() { return "["+this.wdith+","+this.height+"]"; } //拡張その1 PositionedRectangle.prototype.toString = function () { return "("+this.x+","+this.y+")"+ //このクラスのフィールド Rectangle.prototype.toString.apply(this); //スーパークラスとチェーン } //拡張その2(superclassプロパティを追加していた場合(Rectangleを明示的に記述しなくてもよい) PositionedRectangle.prototype.toString = function () { return "("+this.x+","+this.y+")"+ //このクラスのフィールド this.superclass.prototype.toString.apply(this); //スーパークラスとチェーン } 継承以外でクラス拡張する場合は、元クラスの全メソッドを別クラスのプロトタイプオブジェクトにcopyする事で使う事が出来る。 オプジェクトクラスの判定 †任意の型の判定について valueof演算子の問題点は valudof null -> object/ valueof 関数(オブジェクトなのに) -> functionとなる instanceof †関数ではくオブジェクトだったらinstanceof演算子がよいらしい instanceof f == "function" // true x instanceof Array // true f instanceof Function // true f instanceof Object // true Object.toString()で型判定 †Object.toString()は[object class]という形で返してくれる
[object class->内部クラスの文字列=オブジェクトのコンストラクタ関数の名前] duck typing †あるオブジェクトがクラスXで定義されるプロパティを持てば、たとえX()コンストラクタ関数で生成されたものではなくてもそのオブジェクトをクラスXのインスタンスとして扱う事が出来る モジュールと名前空間 †生成 †ルール
Webブラウザ †
windowオブジェクト: web ブラウザによって表示されるウィンドウ、またはウィンドウ内の1つのフレームを表す クライアントサイドオブジェクトの階層構造とDOMレベル0 †Documentオブジェクト以下をDOMと呼ぶ 現在のウィンドウ
HTMLドキュメントへのJavaScriptコードの埋め込み †
<script>タグ †HTMLなどの場合 <script> //script </script> XHTMLの場合 <script><![CDATA[//script...]]></script> scriptタグは何個でも書いてよい、現れた順に実行される イベントハンドラ †
実行方法 †
セキュリティ †クライアントサイドJavaScriptではクライアント側のコンピューター上のファイルやディレクトリに対して、読みだし、書き込み、作成、削除、表示などが出来ない ブラウザウィンドウの制御 †タイマー †グローバル関数
Windowオブジェクトとは関係ないが、windowsオブジェクトがクライアントサイドでのグローバルオブジェクトになるため、これらの関数がメソッドになる URL解析 †Locationオブジェクトのhrefプロパティには完全なURLが文字列として格納される。 LocationオブジェクトのtoString()はhrefを返すので、location.hrefでもlocationでもよい Locationオブジェクト
Navigatorオブジェクト †ブラウザーのバージョンやブラウザで表示可能なデータ形式などの情報が格納される。windowオブジェクトのnavigatorプロパティで参照出来る
<script language="JavaScript"> function browserinfo(){ var browser = "Browser info \n"; for(var i in navigator){ browser += i + ":" + navigator[i] + "<br />"; } document.write(browser); } </script> <script language="JavaScript"> browserinfo(){ </script> ウィンドウのオープン制御 †aに入っていた時だけ。
キーボード系 †
コード †metaにあるdescription/keywordsを取得する †<script type="text/javascript"> var nodes = document.getElementsByTagName('meta'); for (var i = 0, I = nodes.length; i < I; i++) if ('keywords' == nodes[i].name) { alert(document.title + '\n\n' +nodes[i].content); } </script> |