Objekte in JavaScript

Reale Objekte, Eigenschaften und Methoden

Im realen Leben ist ein AutoObjekt.

Autos haben auch Eigenschaften wie Gewicht und Farbe.Eigenschaftund hat auch Methoden wie Starten und Stoppen.Methode:

Objekt Eigenschaft Methode

car.name = porsche

car.model = 911

car.length = 4499mm

car.color = white

car.start()

car.drive()

car.brake()

car.stop()

Alle Autos habenEigenschaft, aber die Eigenschaftswerte unterscheiden sich von Auto zu Auto.

Alle Autos habenMethodeaber Methoden werden zu verschiedenen Zeitpunkten ausgeführt.

Objekte in JavaScript

Sie haben bereits erfahren, dass JavaScript-Variablen Behälter für Datenwerte sind.

Dieser Code weist einemeinzelner Wert(porsche) wird der Variable car zugewiesenVariable:

var car = "porsche";

Probieren Sie es selbst aus

Objekte sind auch Variablen. Aber Objekte enthalten viele Werte.

Dieser Code weistmehrfache Werte(porsche, 911, white) wird der Variable car zugewiesenVariable:

var car = {type:"porsche", model:"911", color:"white"};

Probieren Sie es selbst aus

Werte werden mitName:Wertdurch das Attributnamen:Werte-Paar geschrieben (der Name und der Wert werden durch ein Semikolon getrennt).

JavaScript-Objekte sindBenannte WerteKontainer.

Objekteigenschaften

In JavaScript-Objekten werden die Bezeichner:Werte-PaareEigenschaft.

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
Eigenschaft Wert der Eigenschaft
firstName Bill
lastName Gates
age 62
eyeColor blue

Objektmethoden

Das Objekt kann auchMethode.

Methode wird auf dem Objekt ausgeführtAktion.

Methode wird mitFunktionsdefinitionwird in einer Eigenschaft gespeichert.

Eigenschaft Wert der Eigenschaft
firstName Bill
lastName Gates
age 62
eyeColor blue
fullName function() {return this.firstName + " " + this.lastName;}

Die Methode wird als Eigenschaft gespeichert.

Beispiel

var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 678,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

this-Schlüsselwort

In der Funktionsdefinitionthis der "Besitzer" der aufgerufenen Funktion.

Im obigen Beispielthis bezieht sich auf "Besitzer" der fullName-Funktion person-Objekt.

Mit anderen Wortenthis.firstName bedeutet this-Objektder firstName-Eigenschaft.

Bitte beachten Sie JS this-SchlüsselIn diesem Kapitel lernen Sie mehr über den this-Schlüssel.

Objektdefinition

Wir haben (erstellen) ein JavaScript-Objekt definiert (geschaffen):

Beispiel

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};

Probieren Sie es selbst aus

Leerzeichen und Zeilenumbrüche sind erlaubt. Die Objektdefinition kann über mehrere Zeilen hinweg gehen:

Beispiel

var person = {
    firstName:"Bill",
    lastName:"Gates",
    age:50,
    eyeColor:"blue"
};

Probieren Sie es selbst aus

Zugriff auf Objekteigenschaften

Sie können Attribute auf zwei Arten ansprechen:

objectName.propertyName

oder

objectName["propertyName"]

Beispiel 1

person.lastName;

Probieren Sie es selbst aus

Beispiel 2

person["lastName"];

Probieren Sie es selbst aus

Zugriff auf Objektmethoden

Sie können auf die Methoden eines Objekts auf zwei Arten zugreifen:

objectName.methodName()

Beispiel

name = person.fullName();

Probieren Sie es selbst aus

Wenn Sieohne () Wenn Sie auf die Methode fullName zugreifen, wird zurückgegebenFunktionsdefinition:

Beispiel

name = person.fullName;

Probieren Sie es selbst aus

Methoden werden tatsächlich als Eigenschaftswerte gespeicherte Funktionsdefinitionen.

Deklarieren Sie keine Strings, Numbers und Boolean-Werte als Objekte!

Wenn Sie JavaScript-Variablen durch das Schlüsselwort "new" deklarieren, wird die Variable als Objekt erstellt:

var x = new String();        // 把 x 声明为 String 对象
var y = new Number();        // 把 y 声明为 Number 对象
var z = new Boolean();       //	把 z 声明为 Boolean 对象

请避免字符串、数值或逻辑对象。他们会增加代码的复杂性并降低执行速度。

Vermeiden Sie Zeichenfolgen, Zahlen oder logische Objekte. Sie erhöhen die Komplexität des Codes und verringern die Ausführungszeit.

Sie werden in den späteren Kapiteln dieses Tutorials mehr über Objekte lernen.

Fachbücher Objekte in JavaScriptFür mehr Informationen darüber:

ECMAScript-Technik der objektorientierten Programmierung
Für mehr Informationen darüber, lesen Sie bitte die entsprechenden Inhalte im fortgeschrittenen JavaScript-Tutorial:
ECMAScript-Anwendung der Objekte
Dieser Abschnitt gibt eine kurze Einführung in die Begriffe der objektorientierten Programmierung, die Anforderungen an objektorienterte Sprachen sowie die Struktur von Objekten.
ECMAScript-Objekttypen
Dieser Abschnitt stellt die drei Arten von ECMAScript-Objekten vor: lokale Objekte, eingebettete Objekte und Host-Objekte, und bietet Links zu den zugehörigen Referenzhandbüchern.
ECMAScript-Objektscope
Dieser Abschnitt erläutert den ECMAScript-Scope sowie den Schlüsselwort 'this'.
ECMAScript-Definition von Klassen oder Objekten
Dieser Abschnitt erläutert detailliert verschiedene Methoden zur Erstellung von ECMAScript-Objekten oder Klassen.
ECMAScript-Änderung von Objekten
Dieser Abschnitt erläutert, wie man Objekte durch Erstellen neuer Methoden oder durch Undefinieren bestehender Methoden ändert.