Oggetto JavaScript

Oggetti, proprietà e metodi reali dell'oggetto

In vita reale, un'automobile è unoggetto.

Un'automobile ha come pesi e coloriproprietàe ha anche come funzioni di avviamento e arrestofunzione:

oggetto proprietà funzione

car.name = porsche

car.model = 911

car.length = 4499mm

car.color = white

car.start()

car.drive()

car.brake()

car.stop()

Tutti gli automobili hanno lo stessoproprietàin comune, ma i valori delle proprietà variano a seconda dell'auto.

Tutti gli automobili hannofunzionema i metodi vengono eseguiti in momenti diversi.

Oggetto JavaScript

Come hai già imparato, le variabili JavaScript sono contenitori di valori di dati.

Questo codice assegna unvalore singolo(porsche) assegnato alla variabile chiamata carvariabile:

var car = "porsche";

Provatelo personalmente

Un oggetto è anche una variabile. Ma l'oggetto contiene molti valori.

Questo codice assegnavalori multipli(porsche, 911, white) assegnato alla variabile chiamata carvariabile:

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

Provatelo personalmente

I valori sononome:valorein modo ad oggetto (i nomi e i valori sono separati dal segno di colonna):

Gli oggetti JavaScript sono scrittivalori denominaticontenitore.

proprietà dell'oggetto

Nell'oggetto JavaScript i nomi:valori sono chiamatiproprietà.

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

metodo dell'oggetto

L'oggetto può avere anchefunzione.

La funzione è eseguita sull'oggettoazione.

La funzione è eseguitaDefinizione di funzioneè memorizzata come proprietà.

proprietà valore della proprietà
firstName Bill
lastName Gates
age 62
eyeColor blue
fullName function() {return this.firstName + " " + this.lastName;}

La funzione è memorizzata come proprietà.

Esempio

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

parola chiave this

Nella definizione della funzione,this rimanda al "proprietario" della funzione.

Nell'esempio sopra,this Riferisce a "quello che possiede" la funzione fullName Oggetto person.

In altre parole,this.firstName Significa Oggetto thisl'attributo firstName.

Si prega di notare Parola chiave this JSIn questa sezione imparerai di più sulla parola chiave this.

Definizione dell'oggetto

Abbiamo definito (creato) un oggetto JavaScript:

Esempio

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

Provatelo personalmente

Gli spazi e le virgole di riga sono ammessi. La definizione dell'oggetto può attraversare più righe:

Esempio

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

Provatelo personalmente

Accedi alle proprietà degli oggetti

Puoi accedere alle proprietà in due modi:

objectName.propertyName

oppure

objectName["propertyName"]

Esempio 1

person.lastName;

Provatelo personalmente

Esempio 2

person["lastName"];

Provatelo personalmente

Accedi ai metodi degli oggetti

Puoi accedere ai metodi degli oggetti con la seguente sintassi:

objectName.methodName()

Esempio

name = person.fullName();

Provatelo personalmente

SeSenza () Accedendo al metodo fullName, verrà restituitoDefinizione di funzione:

Esempio

name = person.fullName;

Provatelo personalmente

Le funzioni sono in realtà definite come valori di attributo.

Non dichiarare stringhe, numeri e valori booleani come oggetti!

Se si dichiara una variabile JavaScript con la parola chiave "new", questa viene creata come oggetto:

var x = new String();        // Dichiarare x come oggetto Stringo
var y = new Number();        // Dichiarare y come oggetto Numbero
var z = new Boolean();       // Dichiarare z come oggetto Booleano

Evita di utilizzare oggetti di stringa, numerici o logici. Aggiungeranno complessità al codice e ridurranno la velocità di esecuzione.

Imparerai di più sugli oggetti nelle sezioni successive di questo tutorial.

Libri di testo extra

Per ulteriori informazioni su Oggetto JavaScriptPer ulteriori informazioni, leggi il contenuto correlato nel tutorial avanzato JavaScript:

Tecnologia orientata agli oggetti ECMAScript
Questa sezione introduce i termini della tecnologia orientata agli oggetti, i requisiti dei linguaggi orientati agli oggetti e la composizione degli oggetti.
Applicazione degli oggetti ECMAScript
Questa sezione introduce come dichiarare e istanziare oggetti, come riferirsi e smantellare oggetti, e il concetto di binding.
Tipi di oggetti ECMAScript
Questa sezione introduce i tre tipi di oggetti ECMAScript: oggetti locali, oggetti integrati e oggetti host, e fornisce link a manuali di riferimento correlati.
Scope degli oggetti ECMAScript
Questa sezione spiega l'ambito ECMAScript e la parola chiave this.
Definizione di classi o oggetti ECMAScript
Questa sezione spiega in dettaglio i vari modi per creare oggetti o classi ECMAScript.
Modifica degli oggetti ECMAScript
Questa sezione spiega come modificare un oggetto creando nuovi metodi o redefinendo metodi esistenti.