Trascrizione: (click per espandere)

salve a tutti in questo video parlerò
della array
gli array javascript sono un oggetto un
po particolare perché invece di avere le
proprietà con identificate da un nome
alle proprietà identificate da un numero
un numero che è chiamato indice e che da
sé che parte sempre con lo zero quindi
elemento il primo elemento a indice 0 il
secondo elemento è indice 1 e così via
andiamo a vedere subito come si crea un
array si può usare la keyword let o const
al array quadrate ecco questo è la array più
semplice che si può creare si chiama
arai letterale quando lo si crea in
questa maniera
c'è un'altra maniera per creare un array
che usando keyword new and l'oggetto al
array
però vi sconsiglio di usare questa
procedura e per tutta una serie di
motivi quindi che non sto qui a spiegare
per non dilungarmi troppo noi vedremo
solo la maniera di creare array in questa
maniera se voglio vedere quanti elementi
ci sono dentro al mio array devo solo
andarlo a visualizzare con la proprietà
length eccolo qui che sarà zero perché al
momento non ho elementi se ci butto
dentro qualche elemento come stringa
posso metterci dentro il numero possono
metterci dentro un valore booleano
possono metterci dentro una funzione
posso metterci dentro un oggetto posso
metterci dentro un altro array
come vedete separo gli elementi usando
una virgola e adesso a o sei elementi
dentro e qui o sei elementi o sei
elementi è il primo elemento è indice 0
il secondo elemento è indice 1 elemento
indice ii e via così quindi come potete
notare il sesto elemento a indici 5
ricordate sempre che
l'ultimo elemento della array ha una unità
in meno della proprietà length quindi se
io la proprietà length che mi da sei vuol
dire che l'ultimo elemento è indice 5 è
una cosa che ci servira' fra qualche
minuto
io vi ho detto che array è un oggetto
quindi se vado a visualizzare il suo
typeof array avrò oggetto però come
faccio a distinguere una array da un
oggetto normale si usa ci sono due
metodi si usa un altro operatore che vi
avevo già accennato è instanceof e mi
ritorna a lui questo operatore mi dice
questo array il mio a array è un'istanza
dell'oggetto array built in di
javascript se ritorna true vuol dire che
una array adesso probabilmente non vi darà
molto senso cosa vuol dire istanza per
il momento vi basta capire che è che il
mio array deriva diciamo deriva dall
oggetto array built in
c'è un'altra maniera per vedere se è una
array
usiamo il metodo is array dell'oggetto
array e in dentro metto il mio array e
se ritorno true ho a che fare con un con una
array allora adesso io qui ho sei
elementi se io voglio aggiungere un
nuovo elemento
prima lo aggiungo array con le
parentesi quadrate vado a dire voglio
inserire nell'indie all'indice per
esempio all'indice vogliamo
sovrascrivere l'indice 0 all'indice 0
voglio inserire invece di scrivere
questa stringa voglio inserire un numero
se io vado a vedere cosa ciò
l'indice 0
mi ritroverò il numero quindi per
accedere gli elementi dell'array bisogna
specificare
loro indice tra le parentesi quadrate per
c'è una cosa acquistare attenti adesso
se io a questa array
vado ad aggiungerci un elemento però
invece di aggiungerlo a uno degli
elementi che ne dal presente lo metto
per esempio all'indice 10 e poi vado a
fare il suo output vado a vedere il suo
output avrò ancora il 34 perfetto
il problema è che adesso se io vado a
vedere la sua lunghezza
il mio array misura 11 elementi anche se
effettivamente ce ne sono sette perché
io ho creato dei buchi dentro al mio a
array o degli spazi vuoti dentro il mio
array cosa assolutamente da evitare
perché alcune funzioni dedicati alla array
potrebbero lavorare in maniera anomala e
in comunque ci sarebbe un problema di
performance del codice e quindi vi
sconsiglio assolutamente di di provocare
buchi dentro alla array come faccio a
buttare dentro inserire un elemento
dentro la array per inserirlo alla fine ci
sono due metodi crea un nuovo array
perché su questo lo rovinato array uno
e metto dentro numeri giusto per fare
veloce perché questo è un corso e un
video lungo qui ho una array uno con
quattro elementi
adesso se io voglio aggiungere un
elemento alla fine prima primo metodo è
a array uno length e ci mette dentro il 1000
mille se adesso
a fare il printing di a raiuno alla
elemento dall'indice 4 è trovato console log
array perché mi manca la y no array uno
a quest'ora ecco quanto questo ne ho
fatti tutti sbagliati
eccolo allora praticamente inserendo a
array.length qui la array length mi ritorna a
quattro perché io quattro elementi e 4 è
anche il primo indice buono come
all'ultima posizione perché questo qua
in posizione 3 perché abbiamo detto che
parla 0 1 2 e 3
quindi il prossimo indice per il
prossimo elemento sarebbe l'indice 4
posso usare array.length e e posso
inserire questo alla fine c'è un'altra
maniera per inserire un elemento alla
fine ed è usando la array push a array 1
funzione push e dentro ci metto dentro
l'elemento che voglio posso metterci
2000 se adesso io vado a fare output
del quinto indice avrò 2000 possono
anche andare a vedere la sua lunghezza e
ho sei elementi
se io voglio mettere un un elemento
all'inizio della array si usa array unshift
è qui dentro ci metto magari una stringa
inizio ok adesso se io voglio vedere
cosa è successo
se vado a vedere l'indice zero perché
l'ho messo dentro all'inizio avrò
all'indice 0 iniziale e 7 elementi come
faccio eliminare e
elementi dalla array ci sono e allora se
li voglio eliminare dalla fine userò a
array 1 il metodo pop
il metodo pop b elimina un elemento alla
fine
volendo potrei anche salvarmi
ultimo lo chiamo volendo il metodo pop
li elimina un elemento dalla fine e se
io lo salvo dentro una variabile posso
anche sapere che elemento era l'ultimo
quindi adesso io se vado a vedere la
lunghezza avrò avrò sei ancora e posso
anche andare a vedere cosa c'era nel
ultimo elemento avrò 2000 quindi
l'elemento 2000 è stato eliminato dal
mio array se io voglio eliminare
elementi dall'inizio del mio array userò
il metodo shift ecco qui anche questo
volendo posso salvarlo dentro alla una
variabile per sapere che elemento è e se
adesso io vado a fare l'output del mio
della mia lunghezza avrò cinque allora
per un discorso di performance
soprattutto se si hanno array molto
lunghi con centinaia di elementi è
sempre meglio aggiungere o di eliminare
elementi dalla fine della array perché
aggiungendo ed eliminando all'inizio
della array javascript è costretto a
spostare gli indici di tutti gli
elementi e con array molto lunghi
questo può provocare qualche
rallentamento sovrascrivere un elemento
ve l'ho già detto se io uso per esempio
al array uno
adesso all'indice 0 cosa ciò
all'indice zero come perso il conto
ciò il numero uno adesso io se voglio
sovrascrivere quello quelle
quell'elemento li specifico sempre
l'indice e li metto dentro una stringa
ecco qui adesso se vado a vedere alla
array zero cosa ciò ho una stringa
azzerare arrayi da azzerare è
facilissimo gli si mette dentro una array
vuoto se adesso io vado a vedere la sua
lunghezza
ora ho una array azzerato ciclare
un array allora ciclare si usa
specificamente per cicli che vedremo in
un altro con un altro video
però io adesso sto usando la parola
ciclare perché vi farò vedere una
funzione degli array che funziona come
un ciclo cioè passerò rassegna tutti gli
elementi della array e per ogni elemento
farò un output però questo elemento può
essere usato per fare determinate cose a
seconda di quello che dovete
eseguire adesso io creo nuova array
lo chiamo nuovo e ci metto dentro altro
numeri tre numeri così tanto per fare
veloce e questo nuovo array abbiamo
detto usa il funzione for each e che in
inglese significa per ogni 1 e ci metto dentro una
funzione dove cerco l'elemento e
l'indice blocco di codice e cosa vado a
fare vado a vedere il loro output e
allora elemento elementi eccomi qua
praticamente e questa è una maniera di
concatenare stringhe valori di variabili
usa né senza usare back tick che si usano
gli operatori di concatenazione ve l'avevo
già detto questo il risultato quindi io
vado a passare in rassegna tutti gli
elementi elemento 2 all'indice 0
elemento 45 l'indice 1 elemento 67
all'indice 2 concatenare degli array se
io voglio unire due array per esempio
array 1 che dentro a 34 e 56 e poi ciò a
array 2 che dentro a 67 89
se io adesso voglio unire i due array
posso fare in due maniere let
3 posso creare un nuovo array i usare e a
array 1 e la funzione concat e dentro
questa funzione ci metto dentro il
secondo array c'è adesso io vado a
vedere output
del terzo della array tre eccomi qua tutto
i due array uniti in un terzo array
altra maniera per vedere questo è questa
è usato l'operatore spread l'operatore
spread è stato introdotto con l'ecmascript 6
quindi se andate a usare queste
operatori in vecchi browser non vi
funzionerà
andiamo a vedere uno si usa la funzione
push operatore spread e è rappresentato
da tre puntini messo così e poi due se
adesso io vado a fare l'out put della
array uno mi troverò lo stesso array che
il 3 praticamente l'operatore spread che
significa spalmare e mi scompatta array
nei suoi elementi e me li mette dentro
usando il metodo push dentro alla array
uno a rimuovere elementi aggiungerne
altri o il metodo splice qui parleremo
del metodo splice un metodo splice per
rimuovere elementi da dall'interno della
array ad esempio sia una array con cinque
elementi e voglio eliminare l'elemento
il terzo elemento posso eliminarlo senza
creare il famoso buco che vi dicevo
prima vediamo subito come funziona
allora
beh posso usare questo a array 1 cioè
quattro elementi si allora se io voglio
eliminare dalla rarray 1 l'elemento 56 e
anche il 67 facciamo eliminiamo questi
due elementi 50 67 allora a array 1 il
metodo funzione splice allora io voglio
cominciare eliminare l'elemento
all'indice 1 quindi mi metterò elemento
indice 1 che è da dove il parto a eliminare
gli elementi e quanti elementi voglio
eliminare voglio eliminare due elementi
se adesso io vado a fare l'output 1
eccolo qui 34 e 89 quindi io ho
eliminato a partire dall'elemento
all'indice 1 2 elementi
posso fare anche che posso aggiungere un
elemento all'interno
quindi se adesso io sempre quel metodo
splice posso dire io voglio inserire
sempre quel metodo splice voglio
inserire all'indice 1 cioè a partire
dall'inizio e uno non voglio cancellare
nessun elemento quindi metto 0 e poi ci
voglio inserire dentro stringa 1
mettiamo anche due stringhe a
2
se adesso io vado a vedere come è
composto il mio array nuovo eccolo qui
praticamente io sono andato a inserire
dentro a partire dall'indice 1 non ho
cancellato nessun elemento o solo
aggiunto due elementi
eccolo qui possono posso fare anche
combinazioni posso eliminare elementi e
aggiunge nello stesso tempo basta solo
specificare qui in maniera diversa come
si ordinano gli array posso
ordinare una array che è composto da
parole che sarebbero stringhe quindi
mettiamo un po a caso
ma può poi mettiamo canestro e poi
mettiamo mondo ecco se io voglio
metterli in ordine alfabetico come posso
fare uso console.log
vado subito printarlo
uso la funzione sort eccomi qui e
questo me l'ha messo in ordine
alfabetico
non posso fare la stessa cosa per i
numeri metterli in ordine a crescente o
decrescente perché la funzione sort
andrebbe a convertirmi i numeri stringa
e poi cercherebbe di mettere in ordine
provocando cose che è meglio non vedere
quindi come come funziona se io ho una
array di numeri
numeri come in questo caso quindi 3 poi
metto un 8 poi metto 1 poi metto 5
andiamo a vedere come funziona e io se
voglio metterli in ordine
anzi vado subito a fare la output allora
non si usa sempre la funzione sort però
al suo interno si mette una funziona
altra funzione function a cui si mette
parametri argomenti di parametri e poi
si mette il blocco return a meno b
eccolo qui e ce l'ho in ordine crescente
se voglio fare in ordine decrescente
metto b meno a e ce l'ho in ordine
decrescente array multidimensionali array
multidimensionali significa nessuno a
array al cui interno hanno altri array
vediamo al array multidimensionale lo
chiamiamo multi allora ciò la array padre
chiamiamolo con come primo elemento a un
altro array il primo elemento può essere
non so vediamo tipo un indirizzo via
roma e numero 45 poi secondo elemento è
un altro array metto corso impero un
monopoly
numero 67 terzo elemento posso mettere
un altro array allora abbiamo detto
largo augusto numero 12 ecco creato una
array con altri array interni come faccio
io andare a vedere l'elemento corso
impero per esempio
allora io vado a fare la printing allora
è la array e multi allo moltissimo allora
io voglio andare a vedere il primo
elemento
il primo elemento quindi è l'elemento
all'indice 0 del secondo elemento della
array più grande e quindi elemento
all'indice 1 quindi io qui specifico
prima l'indice nella array più grande e
abbiamo detto indice 1 e poi quadrate
ancora indice 0
eccolo qua corso impero se avessi voluto
andare a vedere per esempio il 12 qui in
fondo
allora io indice due perché è il terzo
elemento della array grande e secondo
elemento della array interno quindi indice
1 eccolo qui c'è il 12 e adesso
l'esercizio per voi esercizio per voi ho
creato questo piccolo esercizio
allora io vi do 2 array con due nomi di
mai uomini e nomi di donne e voglio che
voi uniate questi due array lì
mettiate in ordine alfabetico e poi
sostituite alcuni nomi con altri nomi in
maniera da formare questa array finale
l'ho messo su 2 righe che così riusciti a
vederlo tutto quando quindi voglio che
alla fine ci sia la output di questo a
array andrea lara linda luca nicola serena
e stefano mettete in pausa al mio tre e
poi quando siete pronti e rimettete in
play 1 2 e 3
eccoci qui andiamo a risolvere il
piccolo esercizio
allora abbiamo detto prima bisogna unire
i due elementi e chiamerò un nuovo array
persone e metterò uomini con la funzione
concat donne
ecco qui poi andrò a metterlo in ordine
alfabetico quindi persone e metto sort
ok se adesso intanto per vedere a che
punto sono vado a vedere su output e
metto persone
eccomi qui intanto io c'ho questo array
unito e in ordine alfabetico ci sarebbe
una maniera più veloce per scrivere meno
di fare queste due operazioni ed è
concatenando le funzioni in questa
maniera
come vedete il risultato non cambia
javascript comincia da qui
prima concatena i due array e poi li
mette in ordine alfabetico
adesso io voglio andrea lara qui ce li
ho quindi vanno bene voglio sostituire
marco maria e marta con due nuovi
elementi in linda e luca quindi come
abbiamo visto prima si usa il metodo
splice quindi persone splice allora
abbiamo detto che voglio sostituire
marco quindi è questo qui è il numero e
all'indice numero due
quindi si comincia dall indice 2
si prosegue per tre elementi 123 quindi
metto tra e voglio inserire due nuovi
elementi
linda e luca eccoli qui se adesso
vado a vedere il suo output ecco qua
andrea lara linda luca nicola serena e
stefano con questo è tutto
ci sentiamo alla prossima ciao