第101回 JavaScriptで関数をクラスのように使うとき 中にvarと書くかthisと書くかそれが問題だ

JavaScriptは、関数をnewして、
他の言語でいうところのクラスのような使い方をするわけですが

サンプル1:

var C = function(){
          var i = 1;
          function say_i(){ console.log(i) };
        };

とvarを使って書くのか？

サンプル2:

var C = function(){
          this.i     = 1;
          this.say_i = function(){ console.log(i) };
        };

とthisを使って書くのか？

わかってなかったわけですが..........

var と this　はまったく違うもの

var と this　は、まったく別のもの。

var

varは、関数の中だけで生きる事ができる変数。
ちなみに、サンプル1は
以下のように、書いたのと同じ。

var C = function(){
          var i     = 1;
          var say_i = function(){ console.log(i) };     // varを使って書き直す
        };

中に書いた関数もvarなんで、含まれている関数の中でしか生きられない。

this

thisは、
JavaScript の this について - IT戦記

実行時に与えられるもの

まあ、なんというか.....
そのメソッドを呼んだものになるということですね（きっと）。

どう使い分けるか

おし、ここからが本番だ。
このvar と thisを
どう使い分けるか　ということなんですが

var はクロージャとして使う

var C = function(){
          var i = 1;

          // クロージャを表示
          this.say_i = function(){ console.log(i); };
        };

var c = new C();
c.say_i();

結果：

1

もし、以下のように i に直接アクセスしたら....

var C = function(){
          var i = 1;

          // クロージャを表示
          this.say_i = function(){ console.log(i); };
        };

var c = new C();
console.log(c.i);    // undefined

コメントにあるように undefined　になる。
i にはアクセスできんとです＞＜

結論

var はクロージャとして使う。
this は .（ドット）でつなげてアクセスしたいものに使う。

他にも用法はあるかもしれないのですが、
今日はこれを理解しました。

setTimeoutに何も考えずに渡した場合は、切り離されたりしますが、
それはまた別の話と言うことで....（どっちかというと「実行時に与えられるもの」という話なのかな）