Osoby uzyskujące dostęp do usługi

Istnieją 2 sposoby ustawiania, zmieniania i używania właściwości obiektu: notacja kropki i notacja nawiasowa.

Zapis kropki

Jak widać w niektórych poprzednich przykładach, w zapisie kropkowym znajduje się kropka (.) pomiędzy obiekt i klucz właściwości, do którego uzyskano dostęp:

const myObj = {
    "myProp": "String value."
};

myObj.myProp;
> "String value."

Za pomocą notacji punktowej możesz otwierać, zmieniać i tworzyć nowe usługi za pomocą operatorów przypisań:

const myObj = {};

myObj.myProp = "String value.";

myObj;
> Object { myProp: "String value." }

Łączenie kluczy właściwości za pomocą notacji punktowej pozwala uzyskać dostęp do właściwości które same w sobie są właściwościami obiektu:

const myObj = {
    "myProp": {
            "childProp" : true
    }
};

myObj.myProp.childProp;
> true;

Jednak użycie tej składni, gdy klucz określony w łańcuchu może nie być może powodować błędy. W poniższym przykładzie myMissingProp nie jest właściwości obiektu myObj, więc próba uzyskania dostępu do myObj.myMissingProp w wyniku undefined. Próbuję potem uzyskać dostęp do usługi w witrynie undefined, jakby to obiekt, powoduje błąd:

const myObj = {
    "myProp": {
            "childProp" : true
    }
};

> myObj.myMissingProp
> undefined

myObj.myMissingProp.childProp;
> Uncaught TypeError: myObj.myMissingProp is undefined

Aby rozwiązać ten problem, w ES2020 wprowadziliśmy „opcjonalny operator łączenia łańcuchów”. (?.) aby bezpieczny dostęp do zagnieżdżonych właściwości obiektów.

const myObj = {
    "myProp": {
            "childProp" : true
    }
};

myObj.myMissingProp?.childProp;
> undefined

Klucze, do których uzyskano dostęp przy użyciu notacji kropki, nie są ujęte w cudzysłowy, takie jak ciąg znaków niż literały. Oznacza to, że możesz używać notacji punktowej, aby uzyskiwać dostęp tylko do kluczy właściwości z prawidłowymi identyfikatorami:

const myObj = {
    "1": true,
    "key with spaces": true
};

myObj.1;
> Uncaught SyntaxError: unexpected token: numeric literal

myObj.key with spaces;
> Uncaught SyntaxError: unexpected token: keyword 'with'

Dlatego warto przestrzegać reguł identyfikatorów. podczas określania kluczy właściwości, gdy tylko jest to możliwe. Jeśli nie jest to możliwe w przypadku danego klucza, alternatywna składnia notacji nawiasowej pozwala ustawić klucze obiektu oparte na ciągach znaków, które nie są zgodne z regułami identyfikatorów.

Zapis nawiasu klamrowego

Notacja nawiasowa używa zestawu nawiasów ([]) zawierającego wartość, która określa ciąg (lub symbol) reprezentujący element klucz właściwości.

const myObj = {
    "myProp": "String value."
};

myObj["myProp"];
> "String value."

Ta składnia jest znacznie mniej restrykcyjna i potencjalnie mało restrykcyjna. być mylące, ponieważ wartość w nawiasach jest obliczana jako literał ciągu niezależnie od typu danych. Na przykład tutaj wartości logiczne false i wartości logiczne Wartość liczbowa 10 jest używana do uzyskiwania dostępu do właściwości powiązanych z ciągiem znaków klucze literału "false" i "10" :

const myObj = {
    "false": 25,
    "10" : true,
    "key with spaces": true
};

myObj[false];
> 25

myObj[10];
> true

myObj["key with spaces"];
> true

Zaletą tej składni jest jej elastyczność, która umożliwia stosowanie dynamicznie tworzonych ciągów znaków, aby uzyskać dostęp do właściwości. W poniższym przykładzie użyto liczba losowa pozwalająca wybrać jedną z 3 właściwości obiektu:

const colors = {
    "color1" : "red",
    "color2" : "blue",
    "color3" : "green"
};
const randomNumber = Math.ceil( Math.random() * 3 );

colors[ "color" + randomNumber ];
> "blue"

Podobnie jak w przypadku notacji punktowej, możesz używać notacji nawiasowej, aby zarówno uzyskiwać dostęp, jak i tworzyć nowe przy użyciu operatorów przypisań:

const myObj = {};

myObj[ "myProp" ] = "String value.";

myObj;
> Object { myProp: "String value." }