🧊

同じ動作を実装するとき、JavaScriptの書き分け方

同じ動作をするコードも、いくつかの書き方ができるわけで。
その時々によって良し悪しがあるんやろうけど、この場合の違いはなんやろ?っていうメモ。

オブジェクトでやるパターン

var test1 = {
     init: function(){
          this.make();
     },
     make: function(){
          console.log('Make something 1.');
     }
};

test1.init(); // Make something 1.

この○○.init()って、プラグインとか各所でよく見るなぁと思ってて、実際の使い所は?って思ってたんです。

いいところ

実装する内容を、1つのグローバル変数に閉じ込められる点かな?たぶん。

よくないところ

↓でも書くけど、newしてインスタンス増やして拡張していくとか、そういうのができない。

functionでやるパターン

var test2 = function(){
     this.init = function(){
          this.make();
     };
     this.make = function(){
          console.log('Make something 2.');
     };
}

/*
test2.init();
って書いても動かないので
*/

var test3 = new test2();
test3.init(); // Make something 2.

いいところ

クラスとしてnewしてnewしたい場合はこっち。
最初のパターンでnew test1()ってしたくても、test1は関数じゃないのでできないんね。

よくないところ

newする必要がないなら冗長になるだけ。

つまり

プラグインなど単体で動作するものを定義したい場合は、Objectパターン。
プログラムとしてクラスを定義したい場合は後者のfunctionパターン。

というように理解したけどあってるのかしら?
Oreilly本でも読み返したら載ってるかしら。