Dieser Artikel stellt Ihnen die Analyse der Kapselung in der objektorientierten JS-Programmierung vor. Er hat einen gewissen Referenzwert. Ich hoffe, er wird für Sie hilfreich sein.
Die uns bekannten objektorientierten Sprachen wie C++ und Java haben alle das Konzept von Klassen. Beispielsweise stellt Student den Typ des Schülers dar und stellt keinen bestimmten Schüler dar, und die Instanz ist ein bestimmtes Objekt, das auf diesem Typ basiert, z. B. zhangsan, lisi Das von der Klasse generierte Objekt verkörpert den Prozess der abstrakten Vorlage zur Konkretheit namens klassenbasierte objektorientierte Methode , während JavaScript nicht über das Konzept einer Klasse verfügt, ist die objektorientierte Methode, die auf dem Prototyp basiert (obwohl Es6 class hinzugefügt hat). , was im Wesentlichen eine Kapselung der Prototyp-Methode ist). Zusammenfassend sind die folgenden zwei Punkte:
Beim klassenbasierten objektorientierten Ansatz werden Objekte durch Klassen generiert.
Beim prototypbasierten objektorientierten Ansatz werden Objekte mithilfe von Konstruktoren und Prototypen konstruiert.
Das erste Merkmal der objektorientierten Sprache ist zweifellos die Kapselung. In JS besteht der Prozess der Kapselung darin, einige Eigenschaften und Methoden in Objekte zu „verpacken“. Methoden oder wie man Objekte erstellt (im Folgenden werden wir über die Erstellung von Objekten sprechen)? Das Folgende wird Schritt für Schritt erklärt:
Objektliteral--> Prototyp-Konstruktor--> 🎜>
Objektliteral
var person = {
name: "leon",
age: "20",
greeting: function() {
alert('Hi!');
}
}Object
var person = new Object();
person.name = "leon";
person.age = "20";
person.greeting = function() {
alert('Hi!');
};function createPerson(name, age) {
var person = new Object();
person.name = name;
person.age = age;
person.greeting = function() {
alert('Hi!');
};
}
var person1 = createPerson("leon", "20");function Person(name, age) {
this.name = name;
this.age = age;
this.greeting = function() {
alert('Hi!');
};
// return this;
}
var person1 = new Person("leon", "20");
var person2 = new Person("jack", "21");newEine Instanz durchläuft vier Schritte durch den Konstruktor: new
im Konstruktor an das neue Objekt
Fügen Sie Eigenschaften und Methoden zum neuen Objekt hinzu; > Gibt ein neues Objekt zurück (die JS-Engine fügt standardmäßig this hinzu).
Die über den Konstruktor erstellten Objekte verfügen über ein
-Attribut, das einen Zeiger auf den Konstruktor selbst darstellt, sodass der Typ des Objekts erkannt werden kann. :alert(person1.constructor === Person) //true alert(person1 instanceof Person) // true
alert(person1.greeting == person2.greeting) //false
return this; ist im selben Konstruktor definiert, aber Funktionen mit demselben Namen auf verschiedenen Instanzen sind nicht gleich, was bedeutet, dass die beiden dasselbe haben Name Der Speicherplatz der Funktion ist inkonsistent, das heißt, die Methode im Konstruktor muss bei jeder Instanz neu erstellt werden. Dies ist offensichtlich nicht kosteneffektiv. Vorteile: Löst das Problem der Erstellung ähnlicher Objekte und kann Objekttypen erkennen. constructor
greeting()
Schließlich haben wir über das Prototypmuster gesprochen. Jeder Konstruktor in JS hat ein
-Attribut. Dieses Attribut ist ein Zeiger, der auf das Prototypobjekt zeigt. Dieses Prototypobjekt enthält die Eigenschaften und Methoden, die von allen Instanzen dieses Konstruktors gemeinsam genutzt werden. Es gibt ein-Attribut, und das
des Prototypobjekts zeigt auf den entsprechenden Konstruktor.使用原型，就意味着我们可以把希望实例共享的属性和方法放到原型对象中去，而不是放在构造函数中，这样每一次通过构造函数new一个实例，原型对象中定义的方法都不会重新创建一次。来看下面的例子：
function Person() {
}
Person.prototype.name = "leon";
Person.prototype.age = "20";
Person.prototype.greeting = function() {
alert('Hi!');
};
var person1 = new Person();
var person2 = new Person();
alert(person1.name); //"leon"
alert(person2.name); //"leon"
alert(person1.greeting == person2.greeting); //true优点：与单纯使用构造函数不一样，原型对象中的方法不会在实例中重新创建一次，节约内存。
缺点：使用空构造函数，实例 person1 和 person2 的 name都一样了，我们显然不希望所有实例属性方法都一样，它们还是要有自己独有的属性方法。
解决办法：构造函数+原型模式组合使用。
另外 JS 中还定义了一些与原型相关的属性，这里罗列一下：
Object.getPrototypeOf()，取得实例的原型对象。
Object.getPrototypeOf(person1);
isPrototypeOf()，判断是不是一个实例的原型对象。
Person.prototype.isPrototypeOf(person1);
hasOwnProperty()，检测一个属性是否存在于实例中
person1.hasOwnProperty("name");in，判断一个属性是否存在于实例和原型中。
"name" in person1;
最后一种方式就是组合使用构造函数和原型模式，构造函数用于定义实例属性，而共享属性和方法定义在原型对象中。这样每个实例都有自己独有的属性，同时又有对共享方法的引用，节省内存。
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype = {
constructor: Person,
nationality: "China",
greeting: function() {
alert(this.name);
}
}
var person1 = new Person("leon", "20");
var person2 = new Person("jack", "21");
alert(person1.greeting == person2.greeting) //true上面代码中用对象字面量的形式重写了原型对象，这样相当于创建了一个新的对象，那么它的constructor属性就会指向Object，这里为了让它继续指向构造函数，显示的写上了constructor: Person
这种构造函数与原型模式混成的模式，是目前在 JS 中使用最为广泛的一种创建对象的方法。
相关文章推荐：
Das obige ist der detaillierte Inhalt vonAnalyse der Kapselung in der objektorientierten JS-Programmierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
