Heim > Web-Frontend > js-Tutorial > JavaScript erstellt Objekte

JavaScript erstellt Objekte

不言
Freigeben: 2018-04-10 16:48:50
Original
1410 Leute haben es durchsucht

Der in diesem Artikel mit Ihnen geteilte Inhalt befasst sich mit der Erstellung von Objekten in JavaScript, die einen bestimmten Referenzwert haben. Freunde in Not können sich darauf beziehen.

Rufen Sie den Konstruktor des Systems auf.

Erstellen Sie am meisten Der einfache Weg besteht darin, wie folgt eine Instanz von Object zu erstellen:

    // 1. 调用系统的构造函数
    var person = new Object();

    // 添加属性
    person.name = "小李";
    person.age = 22;
    person.sex = "F";

    // 添加方法
    person.eat = function () {
        console.log("我喜欢吃油炸榴莲.")
    };

    person.play = function () {
        console.log("我喜欢玩电子游戏.")
    };

    person.introduce = function () {
        console.log("我叫" + this.name + ", 今年" + this.age + "岁.");
    };    
    
    person.introduce();        // 输出:我叫小李, 今年22岁.
Nach dem Login kopieren

Der obige Code erstellt ein Objekt mit dem Namen „object“ und fügt ihm drei Eigenschaften und drei Methoden hinzu.

Objektliteral

Obwohl der Objektkonstruktor und das Objektliteral zum Erstellen eines einzelnen Objekts verwendet werden können, wird beim Erstellen eines Objekts auf diese Weise viel wiederholter Code generiert. Also begannen die Leute, das Fabrikmuster zu verwenden. Wie folgt:

function createPerson(name, age, sex) {
    var object = new Object();
    person.name = "小李";
    person.age = 22;
    person.sex = "F";
    person.introduce = function () {
        console.log("我叫" + this.name + ", 今年" + this.age + "岁.");
    };
    
    return person;
}

var person0 = createPerson("小苏", "21", "M");
var person1 = createPerson("铁子", "27", "M");
Nach dem Login kopieren

Die Funktion createPerson() kann ein Person-Objekt erstellen, das alle Informationen basierend auf den akzeptierten Parametern enthält. Diese Funktion kann unbegrenzt oft aufgerufen werden und gibt jedes Mal ein Objekt zurück, das drei Eigenschaften und eine Methode enthält. Obwohl das Factory-Muster das Problem einer großen Codeduplizierung löst, die durch die Erstellung mehrerer ähnlicher Objekte verursacht wird, löst es nicht das Problem der Objektidentifizierung, also der Frage, wie man den Typ eines Objekts erkennt. Mit der Entwicklung von JavaScript ist ein weiteres neues Muster entstanden, nämlich das Konstruktormuster.

Konstruktormuster

Konstruktoren in ECMAScript können Objekte bestimmter Typen erstellen. Native Konstruktoren wie Object-Objekte und Array-Objekte erscheinen zur Laufzeit automatisch in der Ausführungsumgebung. Darüber hinaus können wir den Konstruktor auch anpassen, um den Typ und die Methode des Objekts anzupassen. Das vorherige Beispiel könnte beispielsweise mit dem automatischen Konstruktor wie folgt umgeschrieben werden:

function Person(name, age, sex) {
    this.name = name;
    this.age  = age;
    this.sex  = sex;
    
    this.introduce = function () {
        console.log("我叫" + this.name + ", 今年" + this.age + "岁.");
    };
}

var person0 = createPerson("小苏", "21", "M");
var person1 = createPerson("铁子", "27", "M");
Nach dem Login kopieren

In diesem Beispiel ersetzt die Funktion Person() die Funktion createPerson(). Wir haben festgestellt, dass der Code in der Funktion Person() die folgenden Ähnlichkeiten mit der Funktion createPerson() aufweist:

  • erstellt das Objekt nicht explizit;

    Die Eigenschaften und Methoden werden diesem Objekt direkt zugewiesen
  • Es gibt keine Return-Anweisung.
  • Außerdem sollten Sie beachten, dass der Funktionsname mit dem Großbuchstaben P beginnt. Konventionell sollten Konstruktoren immer mit einem Großbuchstaben beginnen, und Nicht-Konstruktoren sollten immer mit einem Kleinbuchstaben beginnen.
  • Um eine neue Instanz von Person zu erstellen, muss der Operator
verwendet werden. Der Aufruf des Konstruktors auf diese Weise durchläuft tatsächlich vier Prozesse:


new

Erstellen eines neuen Objekts
  1. Konvertieren der Funktion des Konstruktors Die Domäne ist dem neuen Objekt zugewiesen (dies zeigt also auf dieses neue Objekt);
  2. führt den Code im Konstruktor aus;
  3. gibt dieses neue Objekt zurück .
  4. Verwandte Empfehlungen:


ausführliche Erklärung zum Erstellen eines lokalen Servers mit node.js

Mehrere JS-Kreationen teilen sich die Art und Weise von Objekten

Detaillierte Erklärung zum Erstellen von Szeneninstanzen mit three.js

Das obige ist der detaillierte Inhalt vonJavaScript erstellt Objekte. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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