Tutorial di array JavaScript - spiegato con esempi per principianti

Durante l'apprendimento di qualsiasi linguaggio di programmazione, ci imbattiamo nell'apprendimento degli array. Gli array sono disponibili quando è necessario archiviare diversi valori in una singola variabile. L'applicazione di array è vista in molti luoghi, come implementare le matrici, le strutture di dati o l'archiviazione dei dati in forma tabulare.

Il concetto di array proveniva dalla disposizione degli oggetti nella vita reale. Il modo in cui organizziamo oggetti nella vita reale, possiamo organizzare i dati nella programmazione. Quindi questo post riguarda l'apprendimento dei concetti di base e di base di array in JavaScript. Ci immerciamo e abbiamo una chiara comprensione di un array, come crearlo e usarlo per assegnare, accedere e modificare i valori.

Cos'è un array?

Un array è un tipo variabile in qualsiasi linguaggio di programmazione utilizzato per archiviare più valori contemporaneamente. Array archivia i dati sotto forma di segmenti, noti anche come elementi dell'array, quindi in parole semplici, un array è una raccolta di elementi.

Di solito li usiamo per archiviare lo stesso tipo di valori o l'elenco degli elementi in un luogo/variabile come il nome degli animali ["Lion", "Bear", "Monkey"] o elenco di studenti ["John", "Bob", "Ivan"".

Tuttavia, possiamo archiviare più tipi di dati in array, come stringhe, numeri interi, array o persino funzioni.

I tipi di array relativi all'implementazione sono divisi in quattro tipi:

• Array omogenei
• Array eterogenei
• Array multidimensionali
• Array frastagliati

Facciamo una breve introduzione di ogni tipo.

Array omogeneo:

L'array in cui gli elementi sono dello stesso tipo di dati è noto come un array omogeneo. Ad esempio, stringa, numeri interi o valori di bool.

var stringarr = ["John", "Bob", "Ivan"];
var intarr = [23, 45, 67];

Array eterogeneo

L'array in cui sono memorizzati i valori di più tipi di dati è noto come array eterogeneo. Per esempio:

var studente = ["John", 25, "maschio"]

Array multidimensionale:

L'array che contiene ulteriori array come elementi in esso è noto come un array multidimensionale. Ad esempio, elenco di studenti:

var studente = [["John", 25, "maschio"], ["Steve", 21, "maschio"], ["Angela", 22, "femmina"]

Array frastagliato:

Jagged è quasi lo stesso di un array multidimensionale ma con una sottile differenza nel numero di elementi nei sotto-array all'interno di un array. L'array multidimensionale in cui i set di dati di array aggiuntivi non sono uniformi.

var studente = [["John"], ["Steve", 21, "maschio"], ["Angela", "femmina"]]

Nota: Useremo la console del browser per dimostrare esempi eseguiti in questo post. Per aprire la console del browser:

• Usa il Tasto F12 in Chrome e altri browser a base di cromo.
• utilizzo Tastiera Ctrl + Shift + K tasti di scelta rapida per mozilla.
• utilizzo Opzione + ⌘ + C tastiera Tasti di scelta rapida in Safari (se non viene visualizzato il menu Developer, quindi apri le preferenze premendo ⌘ +, e in scheda avanzata Controlla "Mostra il menu Sviluppa nella barra dei menu").

Come creare un array?

Poiché JavaScript è un linguaggio di scripting, non dobbiamo prima dichiarare il tipo e assegnare alcuni valori a una variabile. Possiamo scrivere direttamente il nome della variabile senza menzionare il tipo di dati della variabile e assegnare valori ad esso.

Per esempio:

var linges = ["javascript", "python", "java"];

Come assegnare i valori a un array?

Sebbene possiamo assegnare valori a un array durante la creazione dell'array, esiste un altro modo per assegnare valori è assegnare valori a indici specifici. La posizione in cui un articolo è presente in un array è noto come indice.

Per esempio:

var linges = [];
Lingue [0] = "JavaScript";
Lingue [1] = "Python";

Nota: In array, i numeri dell'indice iniziano da "0" (zero):

Come modificare il valore di un elemento array?

Il valore di un elemento presente in un array può essere modificato allo stesso modo in cui possiamo assegnare i suoi valori.

Ad esempio, se vogliamo modificare il valore del primo indice dell'array "lingue", l'affermazione andrebbe così:

Lingue [0] = "TypeScript";

Proprietà e metodi di array integrati:

Il vero vantaggio di JavaScript sono le sue proprietà e metodi integrati per le array. Le proprietà e i metodi dell'array più comuni presenti in JavaScript sono:

vettore.Proprietà di lunghezza:

IL "vettore.lunghezza"La proprietà può essere utilizzata per ottenere il numero di elementi/elementi presenti in un array. Per esempio:

var linges = ["javascript", "python", "java"];
console.registro (lingue.lunghezza);

vettore.Metodo Ordine ():

Questo Vettore.Metodo Ordine () ordina gli elementi presenti in un array in ordine crescente.

Supponiamo che abbiamo una serie di tre linguaggi di programmazione:

var linges = ["javascript", "python", "java"];

E vogliamo risolverli in ordine alfabetico in modo che la funzione di ordinamento vada così:

Let SortedLang = Lingue.ordinare();
console.log (SortedLang);

Nell'output, puoi vedere che l'array è ordinato come desideravamo:

Come accedere agli elementi/elementi di un array?

È possibile accedere ad elementi di array menzionando il numero dell'indice.

Ad esempio, vogliamo accedere al secondo elemento di un array; L'affermazione andrebbe così:

let SecondLanguage = Lingue [1];

Nota: Il numero dell'indice di Array inizia da zero "0":

Come accedere al primo elemento/elemento di un array?

Poiché gli indici dell'array partono da "0,"Quindi possiamo accedere al primo elemento di un array menzionando"0"Nelle parentesi quadrate come mostrato di seguito:

Let FirstLanguage = Lingue [0];

Come accedere all'ultimo elemento/elemento di un array?

Per ottenere l'ultimo elemento di un array, il "vettore.lunghezza"La proprietà arriva in aiuto. Possiamo accedere all'ultimo elemento presente in un array menzionando "vettore.lunghezza -1"Nelle parentesi quadrate come mostrato di seguito:

Let LastLanguage = Lingue [Lingue.lunghezza - 1];

Come eseguire il loop attraverso un array?

Per ottenere tutti gli elementi presenti in un array, il modo migliore è passare attraverso un array. I modi più convenienti ed efficienti sono l'uso:

• Per loop
• Il metodo foreach di Array

Per loop:

Prendere tutti gli elementi usando un loop è il modo più semplice. Basta eseguire il codice indicato di seguito per eseguire il loop attraverso l'intero array e recuperare tutti gli elementi uno per uno:

var linges = ["javascript", "python", "java"];
per (let i = 0; i < languages.length; i++)
const lingua = lingue [i];
console.registro (lingua);

Nel codice sopra, puoi vedere che abbiamo usato le lingue.lunghezza Proprietà nella clausola condizionale di per loop per loop attraverso l'intero array senza conoscere il numero totale di elementi nell'array.

Metodo foreach di Array:

JavaScript Fornisce anche il metodo foreach dell'array per il loop attraverso l'intero array. La sintassi dell'uso del file metodo foreach è come segue:

var linges = ["javascript", "python", "java"];
le lingue.foreach (Onelang);
funzione onelang (lingua)
console.registro (lingua);

La sintassi sopra fornita può essere ridotta usando la funzione di callback inline come indicato di seguito:

le lingue.foreach ((lingua) =>
console.registro (lingua);
)

Array associativi in ​​javascript?

Gli array associativi sono gli array che hanno nominato indici. JavaScript non supporta tali array. Se lo fai, JavaScript lo prenderà come oggetto e i metodi e le proprietà dell'array non si applicheranno ad esso.

Gli array JavaScript sono oggetti:

Sì, il tipo di Array in JavaScript è oggetto. Ecco perché gli array possono contenere diversi tipi di variabili. Gli array possono contenere oggetti, funzioni e persino array all'interno di un array come elemento.

Se usiamo il Typeof Operator su una variabile di array:

var linges = ["javascript", "python", "java"];
console.log (typeof (lingue));

Mostrerà che il tipo di "le lingue"La variabile array è un oggetto.

Tuttavia, ci sono ancora alcune differenze concettuali tra array e oggetti:

Differenza tra array e oggetti:

• In array, gli indici sono indicati dai numeri.
• Mentre, negli oggetti, gli indici possono essere indicati con nomi (numeri o alfabeti).

Quindi, è meglio scegliere il tipo variabile giusto nel posto giusto:

• Usa gli array quando si dispone di un grande elenco di elementi.
• Usa gli oggetti quando è necessario assegnare nomi agli indici.

Ora sorge la domanda, come identificare se una variabile è un oggetto o un array.

Come identificare una variabile di array?

Per identificare, una variabile è un array o no, JavaScript fornisce un Vettore.funzione isArray ().

Per esempio:

var linges = ["javascript", "python", "java"];
console.registro (array.isArray (lingue));

Il codice sopra riporterà vero.

Nota: IL Vettore.funzione isArray () è stato introdotto in Ecmascript 5.

Conclusione

Questo post contiene tutte le conoscenze di base e necessarie richieste per iniziare con gli array in JavaScript. Prima introduciamo quali array sono, quindi abbiamo imparato come creare, assegnare e modificare i valori di un array.

Inoltre, abbiamo imparato alcune proprietà e funzioni di base incorporate di array in JavaScript per diventare più interattive con gli array. Alla fine, abbiamo discusso del tipo di dati e della differenza tra array e oggetti in dettaglio.