[Closure] JavaScript使用 Closure模擬出 Private Member

  JavaScript裡面其實並沒有 Private Member的概念，(至少在EMCAScript 4)，那如果我們要實作Private Member要怎樣實作呢? 可透過 Closure來完成。

function person (){
  this.age = 10;
  this.name = "Kevin";
};
var p = new person();
console.log(p.age + ":" + p.name);

function person_closure (age, name) {
  this.getName = function () {return name; };
  this.setName = function (newName) {name = newName; };
  this.getAge  = function () {return age;};
  this.setAge  = function (newAge) {age = newAge;};
  
}
var p_c = new person_closure(10, "Kevin");
console.log(p_c.age + ":" + p_c.name);
console.log(p_c);
p_c = null;Check out this Pen!

  如上方例子第一個例子由於沒有使用 Closure來達成 Private，只要打開瀏覽器的 debugger都可以觀察的到裡面的欄位。而第二個 person_closure透過參數傳入 age以及 name也只能使用 getter以及 setter方式存取變數值，進而達到 private 變數。

  最後稍微提醒一下，Closure容易造成記憶體無法釋放的問題，在此例 age，name會一直存在記憶體。所以我最後設定 p_c = null讓瀏覽器回收記憶體。

  這是我參考MSDN JavaScript: 使用物件導向技術來建立進階 Web 應用程式所做的案例探討，也歡迎大家來信更正。

延伸閱讀: [JavaScript] Closure 概念

[JavaScript] Closure 概念

  最近跟 Vexed在討論 JavaScript的 Closure概念, 就參照了他的投影片加上自己參考 Nicholas C. Zakas的 Professional JavaScript for Web Developers以及 wiki當中的 Closure概念.自己試著講解了一次什麼是 JavaScript Closure.


  其實 Closure的定義就是一個方法能夠存取到非同一個scope的方法的變數. Closure在很多語言都有使用到, 而在 JavaScript當中是透過 Scope Chain去達成.

  下面這個例子很有趣, 很明顯的表達出 Scope Chain是 Lexical 分析時候決定, 而非 Execution time決定.

var arg = 1;   
 function funcTest() {   
      alert(arg);   
      var arg = 2;   
 }   

 funcTest(); 
 function funcTest2() {   
      alert(arg);   
      //var arg = 2;   
 }  
funcTest2();
Check out this Pen!