Javascript 私人物业及闭包_Javascript_Button_Closures_Prototype

Javascript 私人物业及闭包

javascript button

Javascript 私人物业及闭包,javascript,button,closures,prototype,Javascript,Button,Closures,Prototype,我想知道如何在原型对象和闭包上使用私有属性创建JS计数器（如下所示）。如果有人能告诉我怎么做，也能给我点评，这样我就能理解这些步骤和过程，我会非常感激 <!DOCTYPE html> <html> <body> <button name="button" class="click-tracking">Click Me</button> <script> var counts = {}, tra

我想知道如何在原型对象和闭包上使用私有属性创建JS计数器（如下所示）。如果有人能告诉我怎么做，也能给我点评，这样我就能理解这些步骤和过程，我会非常感激

<!DOCTYPE html>
<html>
<body>
    <button name="button" class="click-tracking">Click Me</button>
    <script>
    var counts = {},
    track  = document.getElementsByClassName('click-tracking');

for (var i = 0, max = track.length; i < max; i++) {
    track[i].addEventListener('click', function() {

        var name = this.name,
            ele  = document.getElementById(name + '-count') || false;


        if (typeof counts[name] === 'undefined') {
            counts[name] = 0;
        }


        if (!ele) {
            var ele    = document.createElement('div');
                ele.id = name + '-count';


            this.parentNode.insertBefore(ele, this.nextSibling);
        }

        ele.innerHTML = counts[name]++;
    });
}
        </script>
</body>

</head>
</html>


点击我
变量计数={}，
track=document.getElementsByClassName（'click-tracking'）；
对于（变量i=0，max=track.length；i

原型在实例之间共享，因为您只能通过闭包模拟私有，所以原型上不能有特定于实例的私有值

有关构造函数和原型的介绍，请阅读

创建可以启动和停止的计数器的构造函数可以如下所示（我使用的是

\u private

命名约定，而不是闭包）

var Counter = function(name){
  //instance specific values
  this._intervalid=false;
  this._counter=0;
  this.name=name;
};
Counter.prototype.start=function(){
  //create closure for invoking object
  var me=this;
  this._intervalid=setInterval(function(){
    me._counter++;
    console.log(me.name,me._counter);
  },100);
};
Counter.prototype.stop=function(){
  if(this._intervalid){
    clearInterval(this._intervalid);
  }
};

var c1=new Counter("counter1");
var c2=new Counter("counter2");
setTimeout(function(){c2.start();},200);
c1.start();
setTimeout(function(){c2.stop();c1.stop();},2000);

您可以创建一个构造函数来创建原型对象。可以使用局部变量模拟私有属性。这里我们创建一个局部

count

变量，该变量不能在

计数器

函数之外修改

构造函数绑定click处理程序并创建一个getter方法来返回当前计数。

getCount

和事件处理程序关闭每个实例的计数值

function Counter(trackElement) {
    var count = 0;
    this.getCount = function() { return count; }
    trackElement.addEventListener('click', function() {
        count++;
    });
}

var counters = [],
    track  = document.getElementsByClassName('click-tracking');

for (var i = 0, i < track.length; i++) {
    counters.push( new Counter(track[i]) );
}

功能计数器（trackElement）{
var计数=0；
this.getCount=函数（）{return count；}
trackElement.addEventListener（'click'，function（）{
计数++；
});
}
变量计数器=[]，
track=document.getElementsByClassName（'click-tracking'）；
对于（var i=0，i

我不明白这个问题。你的代码有什么问题（看起来很有效）？你想要一个原型对象做什么？这个功能完全没有必要-你没有任何共享公共属性的多个实例。我想为一个按钮创建一个计数器，但不只是使用js，我想在一个原型和一个闭包上使用私有属性。所以我只是将该代码放在一个示例o中f我希望它看起来像什么。很抱歉造成混淆。我只是想用我熟悉的东西来进一步了解原型和闭包。很抱歉，这些概念不适用于这个熟悉的简单脚本。顺便说一句，你从哪里得到的？没有“原型上的私有属性”这样的东西，这在JavaScript中是不可能的。原型发生了什么？我似乎记得问题中提到过它。