Heim > Web-Frontend > js-Tutorial > Methoden zur Klassen- und Instanzimplementierung in JavaScript

Methoden zur Klassen- und Instanzimplementierung in JavaScript

PHPz
Freigeben: 2018-09-29 16:20:23
Original
1373 Leute haben es durchsucht

Dieser Artikel stellt hauptsächlich die Implementierungsmethoden von Klassen und Instanzen vor. Er hat einen gewissen Referenzwert. Die Details sind wie folgt 🎜>

In JavaScript gibt es kein Konzept für eine übergeordnete Klasse, eine Unterklasse oder eine Klasse und eine Instanz. Bei der Suche nach den Eigenschaften eines Objekts durchläuft JavaScript die Prototypenkette nach oben Die entsprechende Eigenschaft wird gefunden. Es gibt mehrere Möglichkeiten, die Konzepte von Klasse und Instanz zu simulieren.

1. Verwenden Sie den Konstruktor direkt zum Erstellen des Objekts zur Objektinstanz.

function Animal() {  
 this.name = "animal";  
 }  
 Animal.prototype.makeSound = function() {  
 console.log("animal sound");  
 }  
[Function]  
 var animal1 = new Animal();  
 animal1.name;  
'animal'  
 animal1.makeSound();  
animal sound
Nach dem Login kopieren
Sehen Sie sich ein anderes Beispiel an:

function Point(x, y) {  
 this.x = x;  
 this.y = y;  
 }  
 Point.prototype = {  
 method1: function() { console.log("method1"); },  
 method2: function() { console.log("method2"); },  
 }  
{ method1: [Function], method2: [Function] }  
 var point1 = new Point(10, 20);  
 point1.method1();  
method1  
 point1.method2();  
method2
Nach dem Login kopieren
Geben Sie oben zunächst das Prototypattribut eines Konstruktorobjekts an. Erstellen Sie dann eine neue Instanz des Objekt und rufen Sie dann den in der Methode angegebenen Prototyp auf.


2. Verwenden Sie die Methode Object.create(), um ein Objekt zu erstellen

var Animal = {  
 name: "animal",  
 makeSound: function() { console.log("animal sound"); },  
 }  
 var animal2 = Object.create(Animal);  
 animal2.name;  
'animal'  
 console.log(animal2.name);  
animal  
 animal2.makeSound();  
animal sound
Nach dem Login kopieren
Dies Die Methode ist einfacher als die Konstruktormethode. Private Eigenschaften und private Methoden können jedoch nicht implementiert werden, und Daten können nicht zwischen Instanzobjekten gemeinsam genutzt werden, und die Simulation von Klassen ist immer noch nicht umfassend genug.


3. Vom niederländischen Programmierer Gabor de Mooij vorgeschlagener minimalistischer Ansatz

var Animal = {  
 init: function() {  
 var animal = {};  
 animal.name = "animal";  
 animal.makeSound = function() { console.log("animal sound"); };  
 return animal;  
 }  
 };  
 var animal3 = Animal.init();  
 animal3.name;  
'animal'  
 animal3.makeSound();  
animal sound
Nach dem Login kopieren
Verwenden Sie keinen Prototyp und müssen Sie nur einen Konstruktor init anpassen Ganz einfach.

var Cat = {  
 init: function() {  
 var cat = Animal.init();  
 cat.name2 = "cat";  
 cat.makeSound = function() { console.log("cat sound"); };  
 cat.sleep = function() { console.log("cat sleep"); };  
 return cat;  
 }  
 }  
 var cat = Cat.init();  
 cat.name; // 'animal'  
 cat.name2; // 'cat'  
 cat.makeSound(); // 类似于方法的重载  
cat sound  
 cat.sleep();  
cat sleep
Nach dem Login kopieren
Verwendung privater Attribute und privater Methoden:

var Animal = {  
 init: function() {  
 var animal = {};  
 var sound = "private animal sound"; // 私有属性  
 animal.makeSound = function() { console.log(sound); };  
 return animal;  
 }  
 };  
 var animal4 = Animal.init();  
 Animal.sound; // undefined 私有属性只能通过对象自身的方法来读取.  
 animal.sound; // undefined 私有属性只能通过对象自身的方法来读取  
 animal4.makeSound();  
private animal sound
Nach dem Login kopieren
Solange die Attribute und Methoden nicht auf dem Tierobjekt definiert sind, sind sie privat und können es nicht sein Zugriff durch die Außenwelt.

Zwischen Klassen und Instanzen können Sie einen Datenaustausch erreichen

var Animal = {  
 sound: "common animal sound",  
 init: function() {  
 var animal = {};  
 animal.commonSound = function() { console.log(Animal.sound); };  
 animal.changeSound = function() { Animal.sound = "common animal sound changed"; };  
 return animal;  
 }  
 }  
 var animal5 = Animal.init();  
 var animal6 = Animal.init();  
 Animal.sound; // 可以视为类属性  
'common animal sound'  
 animal5.sound; // 实例对象不能访问类属性  
undefined  
 animal6.sound;  
undefined  
 animal5.commonSound();  
common animal sound  
 animal6.commonSound();  
common animal sound  
 animal5.changeSound(); // 修改类属性  
undefined  
 Animal.sound;  
'common animal sound'  
 animal5.commonSound();  
common animal sound  
 animal6.commonSound();  
common animal sound
Nach dem Login kopieren
Animal.sound ist beispielsweise ein gemeinsames Attribut von Klassen und Instanzen, das als Klasse betrachtet werden kann Attribute und Klassenmethoden.

Wenn eine Instanz das gemeinsame Attribut ändert, werden auch die gemeinsamen Attribute der Klasse und anderer Instanzen entsprechend geändert.

Zusammenfassend ist dies das Konzept und die Verwendung Ich hoffe, dass dieser Artikel für die Javascript-Programmierung hilfreich ist. Weitere verwandte Tutorials finden Sie unter

JavaScript-Video-Tutorial!

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