Ten post wyjaśni różnicę między mapą a obiektem w JavaScript.
Jak zdefiniować obiekt w JavaScript?
W języku JavaScript obiekt jest zbiorem właściwości, z których każda ma parę klucz-wartość. „ klucz ' jest ' nazwa ” i „ wartość ” to „wartość” w stosunku do klucza. Obiekty mogą reprezentować rzeczywiste obiekty, takie jak samochód, osoba lub konto bankowe. Mogą również przedstawiać bardziej abstrakcyjne obiekty, takie jak matematyczny punkt w przestrzeni, kolor lub data.
Składnia
Obiekt można utworzyć za pomocą dosłownej notacji obiektu {} nawiasów lub konstruktora obiektu. Używając zapisu dosłownego lub nawiasów, użyj poniższej składni:
konst obiekt = {
klucz : wartość,
klucz : wartość
}
Tworzenie obiektu za pomocą konstruktora Object lub „ nowy ”, użyj następującej składni:
konst obiekt = nowy Obiekt ( ) ;
obiekt. klucz = wartość ;
Notatka: Należy pamiętać, że klucze lub nazwy właściwości obiektów muszą być łańcuchami.
Przykład 1: Utwórz obiekt przy użyciu notacji literalnej w JavaScript
W poniższym przykładzie utworzymy obiekt o nazwie „ stdObject ” używając notacji literalnej lub nawiasów:
var stdObject = {
nazwa : 'Jan' ,
wiek : 18 ,
rolka nr : 25 ,
standard : 9
}
Wydrukuj obiekt na konsoli:
konsola. dziennik ( stdObject ) ;Wyjście
Przykład 2: Utwórz obiekt za pomocą konstruktora obiektów w JavaScript
Tutaj utworzymy obiekt za pomocą konstruktora obiektów wykorzystującego „ nowy słowo kluczowe:
konst stdObject = nowy Obiekt ( ) ;Teraz dodaj właściwości (klucz-wartość) obiektów, używając notacji kropka(.):
stdObject. nazwa = 'pierdolić' ;stdObject. wiek = 19 ;
stdObject. rolka nr = piętnaście ;
stdObject. standard = 10 ;
Na koniec wyświetl obiekt na konsoli za pomocą „ log.konsoli() ' metoda:
konsola. dziennik ( stdObject ) ;Wyjście
Jak zdefiniować mapę w JavaScript?
W JavaScript „ Mapa ” to struktura danych, która przechowuje pary klucz-wartość, podobnie jak obiekt. Umożliwia kojarzenie danych z kluczami i późniejsze pobieranie danych za pomocą kluczy. Mapy mogą być wykorzystywane do implementowania słowników, tablic skrótów i innych struktur danych, które odwzorowują klucze na wartości.
Składnia
Aby zainicjować mapę, użyj następującej składni:
konst mapa = nowy Mapa ( [[ 'klucz' , 'wartość' ] ,
[ 'klucz' , 'wartość' ]
] ) ;
Możesz także utworzyć Mapę za pomocą konstruktora Map lub operatora new i ustawić wartości za pomocą „ ustawić() ' metoda:
konst mapa = nowy Mapa ( ) ;mapa. ustawić ( 'klucz' , 'wartość' ) ;
Przykład: Utwórz mapę w JavaScript
W podanym przykładzie utworzymy mapę przy użyciu obu składni.
Utwórz mapę przy użyciu metody inicjalizacji. Tutaj ustawimy klucze jako łańcuch, podczas gdy ty możesz ustawić klucze na mapie dowolnego typu:
konst mapStd = nowaMapa ( [[ 'nazwa' , 'Jan' ] ,
[ 'wiek' , 18 ] ,
[ „rollno” , 25 ] ,
[ 'standard' , 9 ] ,
] ) ;
Lub utwórz mapę, wywołując konstruktor mapy lub nowe słowo kluczowe/operator:
konst mapStd = nowy Mapa ( ) ;Ustaw wartości w Mapie w parze klucz-wartość za pomocą „ ustawić() ' metoda:
mapStd. ustawić ( 'nazwa' , 'Jan' ) ;mapStd. ustawić ( 'wiek' , 18 ) ;
mapStd. ustawić ( „rollno” , 25 ) ;
mapStd. ustawić ( 'standard' , 9 ) ;
Aby wydrukować mapę na konsoli, użyj opcji „ wpisy() ” metoda z „ za-z ' pętla:
Do ( konst [ kluczowa wartość ] mapyStd. wpisy ( ) ) {konsola. dziennik ( `$ { klucz } : $ { wartość } ` ) ;
}
Aby uzyskać dostęp do wartości określonego klucza/właściwości, użyj „ Dostawać() ' metoda:
konsola. dziennik ( „Rolka” + mapStd. Dostawać ( 'nazwa' ) + ' Jest ' + mapStd. Dostawać ( „rollno” ) ) ;Dane wyjściowe wskazują wszystkie właściwości mapy i wartość określonej właściwości:
Mapa kontra obiekt w JavaScript
Podstawowa różnica między mapą a obiektem jest następująca:
| Mapa | Obiekt |
| Został wprowadzony w ECMAScript 6 w 2015 roku. | JavaScript wprowadził typ danych Object w swojej pierwszej wersji (ECMAScript 1) wydanej w 1997 roku. |
| Mapa umożliwia klucze dowolnego typu danych (np. obiekty, funkcje, liczby itp.). | Klucze obiektów muszą być łańcuchami. |
| Dostęp do właściwości mapy można uzyskać za pomocą metody get(). | Dostęp do właściwości obiektu można uzyskać za pomocą notacji kropkowej lub notacji nawiasów kwadratowych. |
| Map ma wbudowaną właściwość size, która zwraca liczbę par klucz-wartość | Obiekt nie posiada tej cechy. |
| Mapa jest iterowalna. Umożliwia zapętlenie wszystkich par klucz-wartość przy użyciu wbudowanych metod, takich jak forEach(), keys(), values() i wpisy(). | Obiekt nie jest iterowalny. Istnieje potrzeba użycia pętli „for-in” lub metody Object.entries() do iteracji par klucz-wartość. |
| Mapa zamówiona. | Obiekt jest nieuporządkowany. |
Podczas pracy z małymi zestawami danych różnica w wydajności między mapami a obiektami jest pomijalna, ale podczas pracy z większymi zestawami danych mapy mogą działać szybciej, ponieważ są zoptymalizowane pod kątem wydajności.
Kiedy mapa preferuje obiekty w JavaScript?
Jeśli potrzebujesz przechowywać pary klucz-wartość w uporządkowanej formie lub wartość jako klucz może być dowolnym typem danych, takim jak liczby, obiekty lub symbole, użyj „ Mapa ' struktura danych. Obiekty będą używane, gdy będziesz potrzebować użyć ciągów znaków jako kluczy i gdy nie będziesz potrzebować żadnych funkcji Map. Różnica w wydajności między mapami a obiektami jest pomijalna podczas pracy z małymi zestawami danych, ale podczas pracy z większymi zestawami danych mapy mogą działać szybciej, ponieważ są zoptymalizowane pod kątem wydajności.
Wniosek
Map i Object są używane do przechowywania danych jako par klucz-wartość w JavaScript, ale mają pewne różnice. Mapa jest bardziej wydajną i elastyczną strukturą danych niż obiekt i jest preferowanym wyborem, gdy trzeba przechowywać pary klucz-wartość, które należy uporządkować, mieć klucze różnych typów danych lub właściwość rozmiaru. W tym poście wyjaśniono różnicę między mapą a obiektem w JavaScript.