Heim > Web-Frontend > js-Tutorial > Hauptteil

So definieren Sie eine Klasse in JavaScript_Grundkenntnisse

WBOY
Freigeben: 2016-05-16 16:36:19
Original
1109 Leute haben es durchsucht

So habe ich es ursprünglich geschrieben:

function Dog(){
  this.name = 'hachi';
}

Dog.prototype = {
  makeNoise:function(){
    alert('wangwangwang');
  }
};

Nach dem Login kopieren

Später sah ich eine andere Schreibweise, die etwas komplizierter war und unnötig erschien:

function Dog(){
  var privateVariable = 'secret';

  var fn = function(){
    //...
  }

  fn.prototype = {
    makeNoise:function(){
      alert('wangwangwang');
    }
  }

  return fn;
}

Nach dem Login kopieren

Die Dog-Funktion hier ist eigentlich eine Klassenerstellungsfunktion, die die echte Dog-Klasse zurückgibt.
Ich glaube, dass der Vorteil dabei in einer besseren Kapselung liegt.
PrivateVariable ist hier beispielsweise eine private Variable:

var d = new Dog;
d.privateVariable //undefined
Nach dem Login kopieren

Außerdem, wenn Sie am Ende des ersten Beispiels einen Satz hinzufügen:

Dog.prototype = {
  //e...WTF??
}
Nach dem Login kopieren

Auf diese Weise ist Hund nicht länger Hund~

Späteres Verständnis:
Die obige Methode zum Erstellen einer neuen Klasse überschreibt direkt das Prototypobjekt. Auf diese Weise gehen die ursprünglich eingebauten Eigenschaften des Prototyps verloren (Argumente, Aufruf, Anwenden usw.).
Die folgende Methode zum Erstellen einer neuen Klasse scheint besser zu sein:

var Dog = function(name){
  this.name = name;
  var privateVariable = 'you cannot see me.';
  this.getPrivate = function(){return privateVariable;};
}
Nach dem Login kopieren

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage