私人財產和關閉

我想知道如何創建JS計數器（下面的期望看起來）使用私有屬性的原型obeject和封閉。如果有人能告訴我如何，但也評論它，所以我可以理解的步驟和過程，我真的很感激它。私人財產和關閉

<!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>

來源

2013-12-10 user3088804

我不明白這個問題。你有什麼問題與你的代碼（這似乎很工作）？ – Bergi

你想要一個原型對象麼？這個功能絕對沒有必要 - 你沒有多個共享公共屬性的實例。 – Bergi

我想爲一個按鈕做一個計數器，而不是僅僅使用js，我想在原型和閉包上使用私有屬性。所以我只是把這個代碼放在我想要的樣子的例子中。對困惑感到抱歉。 – user3088804

原型實例間共享，因爲你只能通過關閉模擬私處你不能對原型實例特定的專用值。

有關構造函數和原型的介紹，您可以閱讀this answer。

構造函數創建一個計數器，可以啓動和停止可以是這樣的（我使用_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);

來源

2013-12-11 00:12:02 HMR

您可以創建一個構造函數來創建原型對象。私人性質可以用局部變量來模擬，在這裏我們創建一個局部變量count，這個變量不能在Counter函數之外被修改

構造函數綁定點擊處理函數並創建一個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])); 
}

來源

2013-12-11 00:15:45

原型發生了什麼？我似乎記得在問題中提到它。 – HMR

私人財產和關閉

回答

相關問題