JavaScript-Grundlagenobjekte

JavaScript-Grundlagenobjekte

1. Gegenstand

1.1 Was ist ein Objekt?

In JavaScript ist ein Objekt eine ungeordnete Sammlung verwandter Eigenschaften und Methoden. Alles ist ein Objekt, z. B. Zeichenfolgen, Zahlen, Arrays, Funktionen usw.

Objekte bestehen aus Eigenschaften und Methoden

  • Attribut: Die Eigenschaften eines Objekts, dargestellt durch Attribute im Objekt
  • Methode: Das Verhalten von Dingen, dargestellt durch Methoden in Objekten

1.2 Warum brauchen wir Objekte?

Zum Speichern eines Werts verwenden Sie eine Variable, zum Speichern einer Reihe von Werten verwenden Sie ein Array. Was wäre, wenn Sie die vollständigen Informationen einer Person speichern möchten?

So können Sie beispielsweise die persönlichen Daten von Zhang San in einem Array speichern:

var arr = ['Neu','Neu',123,156];

Es ist klarer, die persönlichen Daten von Zhang San in Form eines Objekts zu speichern.

2. Drei Möglichkeiten zum Erstellen von Objekten

2.1 Erstellen von Objekten mit Objektliteralen {}

Objektliteral: { } enthält die Eigenschaften und Methoden des (Objekts), das dieses bestimmte Ding ausdrückt.

    <Skript>
        //Verwenden Sie Objektliterale, um Objekte zu erstellen {}
        var obj = {}; //Erstellt ein leeres Objekt var obj = {
            uname: 'Name',
            Alter: 18,
            Geschlecht: 'männlich',
            sayhi: Funktion () {
                console.log('hallo');
            }
        };
        //(1) Die darin enthaltenen Eigenschaften bzw. Methoden liegen in Form von Schlüssel-Wert-Paaren vor: Schlüsseleigenschaftsname: Werteigenschaftswert //(2) Mehrere Eigenschaften oder Methoden werden durch Kommas getrennt //(3) Auf die Methode folgt eine anonyme Funktion //2. Verwenden von Objekten //(1) Um die Eigenschaften eines Objekts aufzurufen, verwenden wir die Methode object.property name console.log(obj.uname);
        //(2) Rufen Sie das Attribut Objektname ['Attributname'] des Objekts auf.
        console.log(Objekt['Alter']);
        //(3) Rufe die Methode des Objekts auf Objektname.Methodenname obj.sayhi();
    </Skript>

2.2 Erstellen eines Objekts mit new Object

  // //Verwenden Sie „new Object“, um ein Objekt zu erstellen. var obj = new Object(); //Erstellen Sie ein leeres Objekt. obj.uname = '张三';
        obj.Alter = 18;
        obj.sex = "männlich";
        obj.sayhi = Funktion () {
            console.log('hallo~');
        }
        console.log(obj['uname']);
        konsole.log(Objekt.Geschlecht);
        obj.sayhi();
        //(1) Wir verwenden das Gleichheitszeichen = Zuweisungsmethode um Objekteigenschaften und -methoden hinzuzufügen //(2) Verwenden Sie ; zwischen jeder Eigenschaft und Methode bis zum Ende //Case var Object = new Object();
        Objekt.uname = "Naruto";
        Objekt.Geschlecht = "männlich";
        Objekt.Alter = 19;
        Objekt.Fähigkeit = Funktion () {
            console.log('Schattenklontechnik');
        }
        console.log(Objekt.uname);
        Objekt.Fähigkeit();

2.3 Erstellen von Objekten mit Konstruktoren

 //Warum müssen wir einen Konstruktor verwenden? //Weil unsere ersten beiden Methoden zum Erstellen von Objekten jeweils nur ein Objekt erstellen können. //Da wir jeweils ein Objekt erstellen, sind viele der Eigenschaften und Methoden darin gleich. Verwenden Sie Funktionen, um Code wiederzuverwenden. Diese Funktion wird als Konstruktor bezeichnet. //Der Konstruktor kapselt das Objekt. //Der Konstruktor abstrahiert einige der gleichen Eigenschaften und Methoden in unserem Objekt und kapselt sie in der Funktion.

Konstruktor : Eine spezielle Funktion, die hauptsächlich zum Initialisieren von Objekten verwendet wird, d. h. zum Zuweisen von Anfangswerten zu Objektelementvariablen. Sie wird immer mit dem neuen Operator verwendet. Wir können einige allgemeine Eigenschaften und Methoden im Objekt abstrahieren und sie in diese Funktion kapseln.

    <Skript>
 
        //Verwende den Konstruktor um ein Objekt zu erstellen //Konstruktorsyntax // function constructor name() {
        // diese.Eigenschaft = Wert;
        // diese.Methode = Funktion() {}
        // }
        // neuer Konstruktorname();
 
        Funktion Star(Name, Alter, Geschlecht) {
            dieser.name = uname;
            dieses.Alter = Alter;
            dies.Geschlecht = Geschlecht;
            this.sing = Funktion (Lied) {
                console.log(Lied);
            }
        }
        var ldh = new Star('Andy Lau', 18, 'Männlich'); //Der Funktionsaufruf gibt ein Objekt zurück console.log(typeof ldh);
        Konsole.log(ldh.name);
        console.log(ldh['Geschlecht']);
        ldh.sing('Eisregen');
        var zxy = new Star('Jacky Cheung', 36, 'Männlich');
        Konsole.log(zxy.name);
        console.log(zxy['Geschlecht']);
        zxy.sing('Li Xianglan');
            //1. Der erste Buchstabe des Konstruktornamens sollte groß geschrieben werden //2. Unser Konstruktor kann Ergebnisse ohne return zurückgeben //3. Wir müssen new verwenden, um den Konstruktor aufzurufen
            //4. Wir müssen nur die neue Srart()-Funktion aufrufen, um ein Objekt zu erstellen. //5. Unseren Eigenschaften und Methoden muss dieses vorangestellt werden.
   </Skript>

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalten auf 123WORDPRESS.COM mehr Aufmerksamkeit schenken können!

Das könnte Sie auch interessieren:
  • Eine detaillierte Einführung in primitive Werte und Wrapper-Objekte in JavaScript
  • Analyse von JavaScript-Grundwerten und Objektreferenzbeispielen
  • Einführung in integrierte JavaScript-Objekte
  • Detaillierte Erläuterung der Konvertierung von JavaScript-Objekten in primitive Werte

<<:  Grundlegende Operationen an unsichtbaren Spalten in MySQL 8.0

>>:  Der Effekt eines dynamischen CSS-Farbverlaufsrahmens, der um den Inhaltsbereich rotiert (Beispielcode)

Artikel empfehlen

Unterschiede zwischen MySQL MyISAM und InnoDB

Der Unterschied: 1. InnoDB unterstützt Transaktio...

Zusammenfassung einiger gängiger Methoden von JavaScript-Arrays

Inhaltsverzeichnis 1. Einleitung 2. filter() 3. K...

WEB Standard-Webseitenstruktur

Ob es sich nun um das Hintergrundbild oder die Tex...

Grundlegende Verwendung der Funktion find_in_set in MySQL

Vorwort Dies ist eine neue Funktion, die ich kürz...

Detaillierte Erläuterung der Komponentenentwicklung des Vue-Dropdown-Menüs

In diesem Artikelbeispiel wird der spezifische Co...

Probleme und Lösungen für MYSQL5.7.17-Verbindungsfehler unter MAC

Das Problem, dass MYSQL5.7.17 unter MAC keine Ver...

3D-Tunneleffekt implementiert durch CSS3

Der erzielte EffektImplementierungscode html <...

CSS3 ändert den Bildlaufleistenstil des Browsers

Hinweis: Diese Methode ist nur auf WebKit-basiert...

MySQL-Update-Fall Update-Feldwert ist keine feste Operation

Wenn bei der Verarbeitung von Batch-Updates besti...