主にプログラミングに関して。Python, .NET Framework(C#), JavaScript, その他いくらか。
記事にあるサンプルやコードは要検証。使用に際しては責任を負いかねます

JavaScript: prototypeを理解する、ライブラリを作る

                
tags: JavaScript
 ここ最近で再利用しそうなスクリプトを2つ書いた。それをライブラリ化するときにprototypeというJavaScriptの特徴を使ったり使わなかったりしつつ書いたのでメモ。


MinifyJpeg.js
まず一つ目のMinifyJpegは、JPEG画像をExifをたもったまま縮小するための関数をメソッドとして揃えている。使い方としてはインスタンスを作成せず、メソッドを関数としてそのまま使って、返り値を得るようになっている。
var minified = MinifyJpeg.minify(image, length);
var encoded = MinifyJpeg.encode64(minified);
インスタンスを作る必要がないので、オブジェクトを作ってそこに必要な関数をそれぞれ入れていくカタチでライブラリにした。
var funcs = {};
funcs.func1 = function(){return 1;}
funcs.func2 = function(str){return str;}
funcs.func3 = function(a1, a2){return a1 + a2;}

alert(funcs.func1());
alert(funcs.func2("mozi"));
alert(funcs.func3("mozi", " mozi"));



PostPacker.js
 二つ目は使用時にインスタンスを作る必要があって、最終的にprototypeを使って書くようにした。
var pack = new PostPacker(3.0, "/upload");
なぜprototypeを使うのか。prototypeを使わずに、関数をそのままメソッドとして置いてしまうのもありなはずだ。prototypeを使ったのはパフォーマンスをよりよくするため。
 オブジェクトのインスタンスが作成されると、そのインスタンス内で、指定されたプロパティが見つからない場合にprototypeが参照されるようになる。prototypeを参照するということは、そのインスタンス自身の内にプロパティとしてそれを持っていないから、継承元にあるものをそのまま使うということになる。新たに作る必要がないからメモリの節約や処理の高速化につながる。
var obj = (function(){
function C(str){this.str = str;}
C.prototype.func1 = function(){return this.str + "1";};
C.prototype.func2 = function(str){return this.str + str;};
C.prototype.func3 = function(a1, a2){return this.str + a1 + a2;};
return C;
})();

var inst = new obj("Oh,");
alert(inst.func1());
alert(inst.func2(" my God!"));
alert(inst.func3(" my God!", " Jesus!"));


 prototypeについてもう少し。あるコンストラクタ(関数)のprototypeになにかメソッドやプロパティを追加したとして、それをそのままメソッドやプロパティのように使用することはできない。そのコンストラクタのインスタンスでなければ、直接メソッドやプロパティのように使うことができない。どういうことか。
function obj(){}
obj.prototype.num = 6;
alert(obj.num); // undefined

var newLib = new obj();
alert(newLib.num); // 6
alert(obj.prototype.num); // 6

メソッドやプロパティを呼び出すコンストラクタが、オブジェクトのインスタンスでなければ、prototypeは参照されない。


参考: http://codezine.jp/article/detail/221
スポンサーサイト



プロフィール

h

Author:h

最新記事
リンク
作ったものなど
月別アーカイブ
カテゴリ
タグリスト

検索フォーム
Amazon