【JavaScript】モジュールパターン
自分用メモ。モジュールパターンと言いつつ、1つしか知らない。
【index.html】
<!DOCTYPE html> <html> <head> <title>Module Test</title> <meta charset="UTF-8"> </head> <body> <script type="text/javascript" src="baseModulePattern.js"></script> <script type="text/javascript"> var image = new Image('testImage'); console.log(image.getImage()); image.setImage('newImage'); console.log(image.getImage()); console.log(image.self.image_); // this cause error becase accessing pribate member image_. </script> </body> </html>
【Moduleのほう】
var Image = (function(){ var self = this; // constructor var Image = function(image) { self.image_ = image; }; var p = Image.prototype; // public p.getImage = function() { return self.image_; }; // public p.setImage = function(image) { self.image_ = image; }; // private var setImageInfo = function(info) { sefl.info = info; }; return Image; // important for "new". must return Constructor. })();
ポイントは、return Image;
ここでconstructor Image functionオブジェクトを返している。
モジュールを使う人はvar image = new Image(image);とし、imageにImage functionが入る。
Image functionだけ入れても何も出来ないので、セッター、ゲッターなどのpublic関数を用意する。
それらをprototypeで辿れるように、Image funcitonのprototypeにセッターゲッターを登録している。
という認識だが、間違っているかも。