Definieren der Variablen von Javascript innerhalb der Klassenbereich

Question

Jungs ich weiß, es ist Dummy Frage, aber ich habe viel versucht und nie erreicht .. Ich möchte die Variablen der Javascript-Datei innerhalb des Umfangs der Klasse nicht durch irgendwelche außerhalb überschrieben werden Quelle .. hier ist mein Code

var pageSize = 5; 
 
\t var startIndex = 0; 
 
\t var endIndex = startIndex + pageSize; 
 
\t var page = 1; 
 
\t var textField; 
 
\t var check = 0; 
 
// i want all of the above variables to be defined inside the scope of the class not outside 
 

 
function bindContext(fn, context) { 
 
\t return function() { 
 
\t \t fn.apply(context, arguments); 
 
\t } 
 
} 
 

 
function GridLibraryDep(data) { 
 
\t this.data = data; 
 
\t this.columns = $.map(this.data[0], function(item, key) { 
 
\t \t return key; 
 
\t }); 
 
\t document.getElementById("from").innerHTML = 1; 
 
\t document.getElementById("to").innerHTML = pageSize; 
 
\t document.getElementById("total").innerHTML = data.length; 
 
\t $("#first").click(bindContext(this.first, this)); 
 
\t $("#last").click(bindContext(this.last, this)); 
 

 
} 
 

 

 
GridLibraryDep.prototype = { 
 
\t \t 
 
\t first : function() { 
 
\t \t var size = this.data.length; 
 
\t \t page = 1; 
 
\t \t // document.getElementById("lbl").innerHTML = page; 
 
\t \t endIndex = page * pageSize; 
 
\t \t startIndex = endIndex - pageSize; 
 
\t \t this.deleteTable(); 
 
\t \t document.getElementById("from").innerHTML = 1; 
 
\t \t document.getElementById("to").innerHTML = endIndex; 
 
\t \t document.getElementById("total").innerHTML = size; 
 
\t \t this.display(); 
 
\t }, 
 

 
\t last : function() { 
 
\t \t var size = this.data.length; 
 
\t \t endIndex = size; 
 
\t \t startIndex = Math.floor(size/pageSize) * pageSize; 
 
\t \t page = Math.ceil(size/pageSize); 
 
\t \t this.deleteTable(); 
 
\t \t // document.getElementById("lbl").innerHTML = page; 
 
\t \t document.getElementById("from").innerHTML = startIndex + 1; 
 
\t \t document.getElementById("to").innerHTML = endIndex; 
 
\t \t document.getElementById("total").innerHTML = size; 
 
\t \t this.display(); 
 
\t }};

Answer 1

Dies ist eine gängige Methode ist es, einen Prototyp der Klasse zu erstellen - https://jsfiddle.net/aaronfranco/fysbbdp7/10/

var MyClass = MyClass || {}; 

(function() { 
    "use strict"; 

    //============================================================ 
    // Constructor - MUST BE AT TOP OF FILE 
    //------------------------------------------------------------ 
    MyClass = function() { 
     this.created = true; 
    }; 

    //============================================================ 
    // Member Functions & Variables 
    //------------------------------------------------------------ 
    MyClass.prototype = { 
     pageSize:5, 
     startIndex:0, 
     endIndex:0, 
     page:1, 
     textField:null, 
     check:0, 
     init: function(){ 
      this.endIndex = this.startIndex + this.pageSize; 
     }, 
     first : function() { 
      // function here 
      console.log(this.endIndex); 
     }, 

     last : function() { 
      // function here 
      //alert(this.pageIndex); 
      console.log(this.pageSize) 
     }, 
     iterater: function(int) { 
      console.log(this.pageSize); 
      this.pageSize += int; 
     } 
    } 
})(); 

Hier ist die zur Verfügung stehende Beispiel für die Verwendung in dem JSFiddle Link oben: mit

var newClass = new MyClass(); 
newClass.init(); 

Sie könnten dann erstellen geschützte Variablen in der Klasse

var newClass = new MyClass(); 
newClass.init(); 
newClass.first(); 

for(var i=0; i<10; i++){ 
    newClass.iterater(i); 
    newClass.last(); 
} 

diesen „Namespace“ -Technik verwenden, können Sie diese Klasse instanziiert indem man sie privat macht. Es gibt einen guten Artikel über einige Möglichkeiten, geschützte Variablen hier zu erstellen.

http://philipwalton.com/articles/implementing-private-and-protected-members-in-javascript/