在JavaScript中聲明私有靜態成員變量

Question

我被JavaScript的設計模式所困擾，我想創建一個私有的靜態成員變量來保持對象計數。 遵循以下原則：

var person = function(name){
    //How to persist this value across multiple calls avoiding Globals
    var _personCount = _personCount || 0;
    _personCount++;
    var _name = name;
    getPerson = function(){
          return "Person is: " + _name;
    }
};

person("foo");//_personCount should be 1 after this call
person("bar");//_personCount should be 2 after this call

這個想法類似於私有靜態變量，只能由類的內部變量訪問

Answer 1

您可以使用顯示模塊模式 ：

var something = (function() {
  var myThing = 0;

  return {
    doSomething: function() {
      myThing++;
    }
  };
})();

something.doSomething(); // myThing is now 1

該變量位於所謂的IIFE（立即調用的函數表達式）中，它將在程序的整個生命周期中保持不變。

如果要在不同位置多次實例化模塊，則還需要創建一個singleton 。

Answer 2

如果要使變量對所有人都是全局變量，則需要在包含函數的范圍內定義它們。 這可以是IIFE，因為它只需要運行一次。

var person = (function() {
    var _personCount = _perconCount || 0;
    return function(name) {
        _personCount++;
        var _name = name;
        getPerson = function() {
            return "Person is: " + _name;
        };
    };
})();

Answer 3

您必須在閉包上下文中創建私有靜態變量。

var person = (function() {
    //private variable
    var _personCount = 1;

    return function(name) {
        this.name = name;
        this.id = _personCount++;
    }

}());

var foo = new person('foo');
console.log(foo.id + ' ' + foo.name);//1 foo

var boo = new person('boo');
console.log(boo.id + ' ' + boo.name);//2 boo

這里封閉的匿名函數再也不會被調用。 它在JS引擎解析您的代碼時執行，並創建_personCount變量，該變量只能由內部函數function(name)進行訪問，從而使其像private static。

Answer 4

我認為這可以幫助您！ 注意：具有實例方法的prototype屬性！ 注意：計數是靜態的！

 var Person = (function() { var counter = 0; function Person(name) { this.name = name; } Person.prototype.getName = function() { counter += 1; return this.name; }; Person.count = function() { return counter; }; return Person; })(); var superman = new Person('SuperMan'); var batman = new Person('BatMan'); var el = function() { return window.document.getElementById('counter'); } function p1() { var name = superman.getName(); el().innerText = name + ' - ' + Person.count(); } function p2() { var name = batman.getName(); el().innerText = name + ' - ' + Person.count(); } 

 <h1 id="counter">0</h1> <button onclick="p1()">Person1</button> <button onclick="p2()">Person2</button>