Mam obiekt JavaScript, który wygląda mniej więcej tak:
var myTextOptions = {
'cartoon': {
comic: 'Calvin & Hobbes',
published: '1993'
},
'character names': {
kid: 'Calvin',
tiger: 'Hobbes'
}
}
Mam dostęp do właściwości cartoon
łatwego używania myTextOptions.cartoon.comic
lub czegokolwiek. Jednak nie udało mi się uzyskać właściwej składni dostępu kid
. Próbowałem następujących rzeczy bez powodzenia:
myTextOptions.character names.kid
myTextOptions."character names".kid
myTextOptions.character\ names.kid
myTextOptions.'character names'.kid
myTextOptions.["character names"].kid
myTextOptions.character%20names.kid
javascript
object
julio
źródło
źródło
Odpowiedzi:
Użyj „notacji nawiasowej” w skryptach ECMA:
Możesz używać tej notacji w dowolny sposób, czytając i pisząc.
Więcej informacji znajdziesz tutaj:
źródło
myTextOptions.["character names"].kid
- aby uzupełnić to pytanie, zastanawiałem się, dlaczego to nie działa?dot notation
jednocześnie. Musi istnieć tylko jedna dyrektywa akcesora.Dostęp do właściwości obiektów JavaScript można również uzyskać lub ustawić za pomocą notacji nawiasów (więcej szczegółów można znaleźć w metodach dostępu do właściwości ). Obiekty są czasami nazywane tablicami asocjacyjnymi, ponieważ każda właściwość jest powiązana z wartością ciągu, za pomocą której można uzyskać do niej dostęp. Na przykład można uzyskać dostęp do właściwości obiektu myCar w następujący sposób:
Aby uzyskać więcej informacji, przeczytaj artykuł Praca z obiektami JS .
Więc w twoim przypadku tak jest
myTextOptions['character names'].kid;
źródło
Możemy to również zrobić poprzez -
myTextOptions[ 'character names' ]['kid']
;Jest to przydatne, gdy mamy kolejne klawisze, które składają się ze spacji.
źródło
Pozwólcie, że podzielę się tutaj moim rozwiązaniem. Używam VueJs ze skryptem typu.
Otrzymałem następujące json, aby przeanalizować i wyświetlić w interfejsie użytkownika
Utworzyłem następujący model ingerujący w Typescript
Nazwałem API jako:
Używany w JSX, jak:
To samo może działać również w React i Angular.
źródło
użyj tego kodu
myTextOptions.["character names"]["kid"];
źródło