JavaScript Objects

Echte objecten, eigenschappen en methoden in het leven

In het echte leven is een autoObject.

Auto's hebben zoals gewicht en kleurEigenschapen hebben ook zoals start en stopMethode:

Object Eigenschap Methode

car.name = porsche

car.model = 911

car.length = 4499mm

car.color = white

car.start()

car.drive()

car.brake()

car.stop()

Alle auto's hebben dezelfdeEigenschapmaar de waarde van de eigenschap verschilt van auto tot auto.

Alle auto's hebben dezelfdeMethodemaar methoden worden op verschillende tijden uitgevoerd.

JavaScript Objects

U heeft al geleerd dat JavaScript-variabelen containers voor datawaarden zijn.

Dit stuk code stelt eenenkele waarde(porsche) toegewezen aan de variabele carVariabele:

var car = "porsche";

Probeer het zelf

Objecten zijn ook variabelen. Maar objecten bevatten veel waarden.

Dit stuk code steltmeerdere waarden(porsche, 911, white) toegewezen aan de variabele carVariabele:

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

Probeer het zelf

Waarden wordenNaam:waardemet komma gescheiden (naam en waarde worden gescheiden door een dubbele punt).

JavaScript-objecten zijnGenoemde waardecontainer.

Objecteigenschap

Naam:waarde paren in JavaScript-objecten wordenEigenschap.

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

Objectmethode

Het object kan ookMethode.

Methoden worden uitgevoerd op het object.actie.

Methoden wordenFunctie-definitiewordt opgeslagen in eigenschappen.

Eigenschap Waarde van eigenschap
firstName Bill
lastName Gates
age 62
eyeColor blue
fullName function() {return this.firstName + " " + this.lastName;}

De methode wordt als eigenschap opgeslagen.

Voorbeeld

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

this-sleutelwoord

In de functie-definitiethis het "eigenaar" van de functie verwijst naar.

in het bovenstaande voorbeeldthis verwijst naar "het bezit" van de fullName-functie person-object.

Kortomthis.firstName betekent this-objectvan de firstName-eigenschap.

Voer uit JS this-sleutelwoordIn dit hoofdstuk leer je meer over de this-sleutelwoord.

Objectdefinitie

We hebben (creëerden) een JavaScript-object gedefinieerd:

Voorbeeld

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

Probeer het zelf

Spaties en regeleinden zijn toegestaan. Een objectdefinitie kan over meerdere regels lopen:

Voorbeeld

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

Probeer het zelf

Bereik de objecteigenschap

Je kunt op twee manieren eigenschappen bereiken:

objectName.propertyName

of

objectName["propertyName"]

Voorbeeld 1

person.lastName;

Probeer het zelf

Voorbeeld 2

person["lastName"];

Probeer het zelf

Bereik de objectmethode

Je kunt de objectmethode bereiken met de volgende syntaxis:

objectName.methodName()

Voorbeeld

name = person.fullName();

Probeer het zelf

Als jezonder () Als je de fullName-methode bezoekt, wordt hetFunctie-definitie:

Voorbeeld

name = person.fullName;

Probeer het zelf

Methoden worden eigenlijk opgeslagen als functie-definities in de vorm van eigenschapswaarden.

Meld geen strings, cijfers en booleans aan als objecten!

Als je JavaScript variabelen declareert met het keyword "new", wordt deze als object gecreëerd:

var x = new String();        // Declaraar x als String object
var y = new Number();        // Declaraar y als Number object
var z = new Boolean();       // Declaraar z als Boolean object

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

Voorkom strings, getallen of logische objecten. Ze zullen de complexiteit van de code verhogen en de uitvoersnelheid verlagen.

Je zult in latere hoofdstukken van deze handleiding meer over objecten leren.

boeken JavaScript ObjectsVoor meer informatie over

ECMAScript object-georienteerde technologie
Voor meer informatie over de kennis, lees het gerelateerde deel in de JavaScript-geavanceerde handleiding:
ECMAScript object-toepassing
Deze sectie biedt een korte introductie van de termen van object-georienteerde technologie, de vereisten van object-georienteerde talen en de samenstelling van objecten.
ECMAScript objecttypen
Deze sectie introduceert de drie typen van ECMAScript: lokale objecten, ingebouwde objecten en hostobjecten, en biedt links naar relevante referentiehandboeken.
ECMAScript object-scope
Deze sectie legt uit ECMAScript-scope en het this-kleintje.
ECMAScript definieert klassen of objecten
Deze sectie legt in detail uit hoe ECMAScript-objecten of klassen kunnen worden gemaakt.
ECMAScript objecten wijzigen
Deze sectie legt uit hoe objecten kunnen worden gewijzigd door nieuwe methoden te maken of bestaande methoden opnieuw te definiëren.