Free Press

Egy objektum tulajdonságainak elérése

Egy objektum tulajdonságaihoz kétféleképpen lehet hozzáférni:

• Dot Notation
• Bracket Notation

A leggyakrabban a pontjelölést használják. Az alábbiakban mindegyikbe belemerülünk, és felfedezünk néhány különbséget.

Pont jelölés

Lássuk először a pont jelölést. Nézzük meg az alábbi példát:

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

Felhívom a figyelmet az ötödik sorra, ahol pontjelölést használunk: let sound = obj.cat;. Ez egy példa a pontjelölésre. Egy objektum tulajdonságait úgy érheti el, hogy megadja az objektum nevét, amelyet egy pont (pont) követ, majd a tulajdonság neve következik. Ez a szintaxis: objectName.propertyName;.

A pontjelöléssel való munka során a tulajdonságazonosítók csak alfanumerikusak lehetnek (valamint _ és $). A tulajdonságok nem kezdődhetnek számmal.

A pontjelölés sokkal könnyebben olvasható, mint a zárójeles jelölés, ezért gyakrabban használják. Van azonban egy második módja is egy objektum tulajdonságainak elérésének, amivel érdemes tisztában lenned. Ezt hívják zárójeles jelölésnek.

Zárójeles jelölés

Itt egy példa a zárójeles jelölésre:

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

Még egyszer hívjuk fel a figyelmet az ötödik sorra: let sound = obj;. Egy objektum tulajdonságait úgy érhetjük el, hogy megadjuk az objektum nevét, amelyet a tulajdonság neve követ zárójelben. Íme a szintaxis: objectName.

A zárójeles jelöléssel valószínűleg már találkoztál, amikor tömbökkel dolgoztál. Az alábbi példában a arr második elemét fogjuk elérni a szintaxis használatával: arrayName

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

De a zárójeles jelölés akkor is hasznos, amikor objektumokkal dolgozunk.

A zárójeles jelölésnél a tulajdonságazonosítóknak csak karakterláncnak kell lenniük. Bármilyen karaktert tartalmazhatnak, beleértve a szóközöket is. Változók is használhatók, amennyiben a változó egy karakterlánccá oldódik fel.

Ez azt jelenti, hogy kevesebb korlátozás van a zárójeles jelöléssel való munka során. Most már használhatunk szóközöket a karakterláncainkban, és még számokkal is kezdhetjük a karakterláncokat.

A legfontosabb talán az, hogy most már használhatunk változókat egy objektum tulajdonságainak elérésére. Fontos, hogy a használt változó egy Stringre hivatkozik.

Nézzük meg ezt a változó példát. Elsőre kissé zavaros lehet, úgyhogy legyünk elnézőek:

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

A fenti példa hasonló egy korábbi, már látott példához. A fő különbség az, hogy most zárójeles jelölést használunk egy változó átadásához. Vigyázzunk, úgy tűnhet, mintha a dog tulajdonságot keresnénk a obj-ben, de ez nem teljesen helyes. A dog egy változó, amelynek értéke 'cat'. Mivel zárójeleket használunk, a string értékét adjuk át, és a 'cat' tulajdonságot keressük – obj. Így a meow kerül a konzolra.

Az alábbiakban megpróbáljuk ugyanezt, de pontjelöléssel:

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

Rögtön az elején észre kell vennünk, hogy woof-et kapunk vissza. Ez nagyon különbözik a másik példától, és ez azért van, mert pontjelöléssel nem használhatunk változókat. A obj.dog keresésének megkísérlése valójában csak a 'dog' string értékét keresi az objektumunkon belül, ahelyett, hogy a változó értékét használná. Így a obj.dog woof-t adja vissza.

Recap

A pont- és zárójeles jelölés között van néhány fontos különbség:

Pontjelölés:

• A tulajdonságazonosítók csak alfanumerikusak lehetnek (és _ és $)
• A tulajdonságazonosítók nem kezdődhetnek számmal.
• A tulajdonságazonosítók nem tartalmazhatnak változókat.
• OK – obj.prop_1, obj.prop$
• Nem OK – obj.1prop, obj.prop name

Bracket jelölés:

• A tulajdonságazonosítóknak Stringnek vagy egy Stringre hivatkozó változónak kell lenniük.
• Számokkal kezdődő változók, szóközök és karakterláncok használata rendben van
• OK – obj, obj

Köszönjük az olvasást! Ha készen állsz arra, hogy végre megtanulj webfejlesztést, nézd meg a The Ultimate Guide to Learning Full Stack Web Development 6 hónap alatt című könyvet, 30 dollárért. Ha csak a JavaScript készségeidet szeretnéd fejleszteni, nézd meg: A Beginners Guide to Advanced JavaScript

Heti 4 cikket teszek közzé a webfejlesztésről. Kérjük, fontolja meg, hogy megadja az e-mail címét itt, ha szeretne felkerülni a hetente egyszeri e-mail listámra, vagy kövessen a Twitteren.