プロトタイプとコンストラクタ
仕事が始まった。予想通りだけど平日は JavaScript の勉強をする時間がとれないので、今日は一週間ぶりの勉強。
まあでも、仕事で早速 Chrome の extension を作ってみたらとてもすんなりと思った通りのものが作れてとてもうれしかった。勉強した甲斐があったなあ。
で、今日勉強したことはプロトタイプとコンストラクタ。
コンストラクタは前から何度も使っていたけど、自分で定義したのは初めて。
教科書に従ってこんなのを書いてみた。
function Book(title, author, asin, thumbnailURL){ this.title = title; this.author = author; this.asin = asin; this.thumbnailURL = thumbnailURL; }
プロトタイプも試してみた。
Book.prototype = { showTextLink : function(target){ var link; link = "<a href = 'http://www.amazon.co.jp/exec/obidos/asin/"; link += this.asin + "'"; if(target){ link += " target='" + target + "'"; } link += ">" + this.title + "</a>"; alert(link); document.write(link); },
で、これを書いているうちに疑問がひとつ出てきた。
コンストラクタでプロパティを定義するのとプロトタイプで定義するのと何が違うんだろう?
例えばこんな書き方したっていいんじゃないの。
function Book(title, author, asin, thumbnailURL){ this.title = title; this.author = author; this.asin = asin; this.thumbnailURL = thumbnailURL; this.showTextLink= function(){ ... }; }
この疑問に答えてくれたのがこちらのブログ。
JavaScriptの「プロトタイプ入門」 - Qiita
つまり、コンストラクタでプロパティとして定義してしまうと、毎回そのオブジェクトのインスタンスが生成される度に関数が定義されてしまう。
なので、それを避けるためにはプロトタイプとして関数を定義すると良い。
このブログのお陰で疑問点がすぐ解決できてよかった!