Questo post spiegherà la differenza tra Mappa e Oggetto in JavaScript.
Come definire un oggetto in JavaScript?
In JavaScript, un oggetto è una raccolta di proprietà, ciascuna con una coppia chiave-valore. IL ' chiave ' è il ' nome ”, e un “ valore ” è il “valore” rispetto alla chiave. Gli oggetti possono rappresentare oggetti del mondo reale, come un'auto, una persona o un conto bancario. Possono anche rappresentare oggetti più astratti, come un punto matematico nello spazio, un colore o una data.
Sintassi
Un oggetto può essere creato utilizzando la notazione letterale dell'oggetto {} parentesi o il costruttore Object. Utilizzando la notazione letterale o le parentesi, utilizzare la sintassi seguente:
cost oggetto = {
chiave : valore,
chiave : valore
}
Creazione di un oggetto utilizzando il costruttore Object o il ' nuovo ” parola chiave, utilizzare la seguente sintassi:
cost oggetto = nuovo Oggetto ( ) ;
oggetto. chiave = valore ;
Nota: Tenere presente che le chiavi oi nomi delle proprietà dell'oggetto devono essere una stringa.
Esempio 1: creare un oggetto utilizzando la notazione letterale in JavaScript
Nell'esempio seguente, creeremo un oggetto chiamato ' stdObject ” utilizzando la notazione letterale o le parentesi:
var oggetto standard = {
nome : 'John' ,
età : 18 ,
rollno : 25 ,
standard : 9
}
Stampa l'oggetto sulla console:
consolare. tronco d'albero ( stdObject ) ;Produzione
Esempio 2: creare un oggetto utilizzando Object Constructor in JavaScript
Qui, creeremo un oggetto usando il costruttore di oggetti utilizzando il ' nuovo ' parola chiave:
cost stdObject = nuovo Oggetto ( ) ;Ora, aggiungi le proprietà (valore-chiave) degli oggetti usando la notazione punto (.):
stdObject. nome = 'Fanculo' ;stdObject. età = 19 ;
stdObject. rollno = quindici ;
stdObject. standard = 10 ;
Infine, visualizza l'oggetto sulla console utilizzando il ' console.log() ' metodo:
consolare. tronco d'albero ( stdObject ) ;Produzione
Come definire la mappa in JavaScript?
In JavaScript, un ' Carta geografica ' è una struttura dati che contiene coppie chiave-valore simili a un oggetto. Ti consente di associare i dati alle chiavi e recuperare i dati in un secondo momento utilizzando le chiavi. Le mappe possono essere utilizzate per implementare dizionari, tabelle hash e altre strutture di dati che associano le chiavi ai valori.
Sintassi
Per inizializzare una mappa utilizzare la seguente sintassi:
cost carta geografica = nuovo Carta geografica ( [[ 'chiave' , 'valore' ] ,
[ 'chiave' , 'valore' ]
] ) ;
Puoi anche creare una mappa utilizzando il costruttore di mappe o utilizzando l'operatore new e impostare i valori utilizzando il ' impostato() ' metodo:
cost carta geografica = nuovo Carta geografica ( ) ;carta geografica. impostato ( 'chiave' , 'valore' ) ;
Esempio: creare una mappa in JavaScript
Nell'esempio fornito, creeremo una mappa utilizzando entrambe le sintassi.
Creare una mappa utilizzando il metodo di inizializzazione. Qui, imposteremo le chiavi come una stringa mentre puoi impostare le chiavi in una mappa in qualsiasi tipo:
cost mappaStd = newMap ( [[ 'nome' , 'John' ] ,
[ 'età' , 18 ] ,
[ 'rollno' , 25 ] ,
[ 'standard' , 9 ] ,
] ) ;
Oppure crea una mappa chiamando il costruttore della mappa o la nuova parola chiave/operatore:
cost mappaStd = nuovo Carta geografica ( ) ;Imposta i valori in Map in una coppia chiave-valore utilizzando ' impostato() ' metodo:
mappaStd. impostato ( 'nome' , 'John' ) ;mappaStd. impostato ( 'età' , 18 ) ;
mappaStd. impostato ( 'rollno' , 25 ) ;
mappaStd. impostato ( 'standard' , 9 ) ;
Per stampare la mappa sulla console, utilizzare il ' inserimenti() ” metodo con il “ per-di ' ciclo continuo:
per ( cost [ chiave, valore ] della mappaStd. inserimenti ( ) ) {consolare. tronco d'albero ( `$ { chiave } : $ { valore } ` ) ;
}
Oppure per accedere al valore di qualsiasi chiave/proprietà specifica, utilizzare il ' Ottenere() ' metodo:
consolare. tronco d'albero ( 'Il rollo di' + mappaStd. Ottenere ( 'nome' ) + ' È ' + mappaStd. Ottenere ( 'rollno' ) ) ;L'output indica tutte le proprietà della mappa e il valore della proprietà specifica:
Mappa vs oggetto in JavaScript
La differenza principale tra Mappa e Oggetto è la seguente:
| Carta geografica | Oggetto |
| È stato introdotto in ECMAScript 6 nel 2015. | JavaScript ha introdotto il tipo di dati Object nella sua prima versione (ECMAScript 1) rilasciata nel 1997. |
| Map consente chiavi di qualsiasi tipo di dati (ad es. oggetti, funzioni, numeri, ecc.). | Le chiavi dell'oggetto devono essere stringhe. |
| È possibile accedere alle proprietà di una mappa utilizzando il metodo get(). | È possibile accedere alle proprietà dell'oggetto utilizzando la notazione punto o parentesi quadra. |
| Map ha una proprietà size incorporata per restituire il numero di coppie chiave-valore | L'oggetto non ha questa caratteristica. |
| La mappa è iterabile. Consente di scorrere tutte le coppie chiave-valore utilizzando alcuni metodi integrati come forEach(), keys(), values() e entries(). | L'oggetto non è iterabile. È necessario utilizzare i cicli 'for-in' o il metodo Object.entries() per l'iterazione delle coppie chiave-valore. |
| La mappa è ordinata. | L'oggetto non è ordinato. |
Quando lavori con set di dati di piccole dimensioni, la differenza di prestazioni tra Mappe e oggetti è trascurabile, ma quando lavori con set di dati più grandi, le mappe possono essere più veloci in quanto sono ottimizzate per le prestazioni.
Quando la mappa preferisce gli oggetti in JavaScript?
Quando è necessario archiviare coppie chiave-valore in una forma ordinata o il valore come chiave deve essere di qualsiasi tipo di dati, ad esempio numeri, oggetti o simboli, utilizzare ' Carta geografica ' struttura dati. Gli oggetti verranno utilizzati quando è necessario utilizzare stringhe come chiavi e quando non è necessaria alcuna delle funzionalità di Maps. La differenza di prestazioni tra Mappe e oggetti è trascurabile quando si lavora con set di dati di piccole dimensioni, ma quando si lavora con set di dati più grandi, le Mappe possono essere più veloci poiché sono ottimizzate per le prestazioni.
Conclusione
Map e Object sono entrambi utilizzati per archiviare i dati come coppie chiave-valore in JavaScript, ma presentano alcune differenze. Map è una struttura dati più potente e flessibile rispetto a Object ed è la scelta preferita quando è necessario archiviare coppie chiave-valore che devono essere ordinate, avere chiavi di tipi di dati diversi o avere una proprietà size. Questo post ha spiegato la differenza tra Mappa e Oggetto in JavaScript.