Free Press

Accedere alle proprietà di un oggetto

Ci sono due modi per accedere alle proprietà di un oggetto:

• Dot Notation
• Bracket Notation

Dot notation è usata più frequentemente. Di seguito ci immergeremo in ognuna di esse e scopriremo alcune delle differenze.

Notazione a punti

Guardiamo prima la notazione a punti. Considerate questo esempio qui sotto:

let obj = {
cat: 'meow',
dog: 'woof'
};let sound = obj.cat;console.log(sound);
// meow

Voglio portare la vostra attenzione sulla quinta linea dove stiamo usando la notazione per punti: let sound = obj.cat;. Questo è un esempio di notazione per punti. Potete accedere alle proprietà di un oggetto specificando il nome dell’oggetto, seguito da un punto (period) seguito dal nome della proprietà. Questa è la sintassi: objectName.propertyName;.

Quando si lavora con la dot notation, gli identificativi delle proprietà possono essere solo alfanumerici (e _ e $). Le proprietà non possono iniziare con un numero.

La notazione a punti è molto più facile da leggere di quella a parentesi ed è quindi usata più spesso. Tuttavia, c’è un secondo modo per accedere alle proprietà di un oggetto che dovreste conoscere. Si chiama notazione a parentesi.

Notazione a parentesi

Ecco un esempio di notazione a parentesi:

let obj = {
cat: 'meow',
dog: 'woof'
};let sound = obj;console.log(sound);
// meow

Ancora una volta, attirate la vostra attenzione sulla quinta linea: let sound = obj;. Potete accedere alle proprietà di un oggetto specificando il nome dell’oggetto seguito dal nome della proprietà tra parentesi. Ecco la sintassi: objectName.

Hai probabilmente visto la notazione tra parentesi quando lavori con gli array. Nell’esempio seguente accediamo al secondo elemento del nostro arr usando la sintassi: arrayName

let arr = ;let letter = arr;console.log(letter);
// b

Ma la notazione tra parentesi è utile anche quando si lavora con gli oggetti.

Quando si lavora con la notazione tra parentesi, gli identificatori di proprietà devono essere solo una stringa. Possono includere qualsiasi carattere, inclusi gli spazi. Anche le variabili possono essere usate, purché la variabile si risolva in una stringa.

Questo significa che ci sono meno limitazioni quando si lavora con la notazione a parentesi. Ora possiamo avere spazi nelle nostre stringhe, e possiamo anche iniziare le stringhe con dei numeri.

Forse la cosa più importante è che ora possiamo usare le variabili per accedere alle proprietà di un oggetto. È importante che la variabile che state usando faccia riferimento a una stringa.

Date un’occhiata a questo esempio di variabile. Potrebbe essere un po’ confuso all’inizio, quindi abbiate pazienza:

let obj = {
cat: 'meow',
dog: 'woof'
};let dog = 'cat';
let sound = obj;console.log(sound);
// meow

L’esempio qui sopra è simile a un esempio precedente che abbiamo già visto. La differenza principale è che ora stiamo usando la notazione a parentesi per passare una variabile. Attenzione, potrebbe sembrare che stiamo cercando la proprietà dog nel nostro obj, ma non è del tutto corretto. dog è una variabile con un valore di 'cat'. Poiché stiamo usando le parentesi, il valore della stringa viene passato e cerchiamo la proprietà 'cat' – obj. Così, meow viene registrato nella console.

Di seguito, proveremo a fare la stessa cosa, ma con la notazione per punti:

let obj = {
cat: 'meow',
dog: 'woof'
};let dog = 'cat';
let sound = obj.dog;console.log(sound);
// woof

Da subito dovreste notare che stiamo ottenendo woof. Questo è molto diverso dall’altro esempio ed è perché non possiamo usare le variabili con la notazione per punti. Tentare di cercare obj.dog in realtà cercherà solo il valore della stringa 'dog' all’interno del nostro oggetto invece di usare il valore della variabile. Così, obj.dog restituisce woof.

Recap

Ci sono alcune importanti differenze tra la notazione per punti e quella per parentesi:

Notazione per punti:

• Gli identificatori di proprietà possono essere solo alfanumerici (e _ e $)
• Gli identificatori di proprietà non possono iniziare con un numero.
• Gli identificatori di proprietà non possono contenere variabili.
• OK – obj.prop_1, obj.prop$
• Non OK – obj.1prop, obj.prop name

Notazione Bracket:

• Gli identificatori di proprietà devono essere una stringa o una variabile che fa riferimento a una stringa.
• Va bene usare variabili, spazi e stringhe che iniziano con numeri
• OK – obj, obj

Grazie per aver letto! Se sei pronto ad imparare finalmente lo sviluppo web, controlla The Ultimate Guide to Learning Full Stack Web Development in 6 mesi, per 30 dollari. Se stai solo cercando di migliorare le tue abilità JavaScript, controlla: A Beginners Guide to Advanced JavaScript

Pubblico 4 articoli sullo sviluppo web ogni settimana. Considera di inserire la tua email qui se vuoi essere aggiunto alla mia lista di email una volta alla settimana, o seguimi su Twitter.