‫Jonas: Come promesso,
‫ora utilizzeremo emettitori e ascoltatori di eventi in pratica
‫e iniziamo creando un nuovo file qui.
‫Quindi eventi. js e chiudi questo.
‫Quindi, per utilizzare gli eventi del nodo
‫incorporati, è necessario richiedere il modulo
‫degli eventi
‫e da questo richiederemo una classe EventEmitter.
‫Quindi, EventEmitter, questo è il nome
‫standard per il risultato della richiesta di questo modulo eventi.
‫Quindi di nuovo questo è un modulo nodo integrato, ok?
‫E ora per creare
‫un nuovo emettitore, creiamo semplicemente un'istanza
‫fondamentalmente della classe che abbiamo appena importato.
‫Quindi molto semplice
‫myEmitter è un nuovo EventEmitter.
‫Quindi EventEmitter proprio come questo.
‫Quindi ricorda dall'ultimo video che
‫EventEmitters può emettere eventi con nome e
‫possiamo quindi iscriverci a questi
‫eventi, quindi sostanzialmente
‫ascoltarli e quindi reagire di conseguenza, ok?
‫Quindi è un po' come impostare
‫un EventListener su un elemento stupido, ad esempio,
‫per fare clic su un pulsante, e
‫sono sicuro che l'hai
‫già fatto prima, quando lavori con JavaScript sul lato client, giusto?
‫Quindi il nostro emettitore
‫alla fine emetterà un evento denominato, ok?
‫Quindi sistemiamolo
‫e facciamo semplicemente finta
‫di costruire un negozio online o qualcosa del genere, ok?
‫Quindi possiamo dire myEmitter. emit(), e
‫poi possiamo creare qualsiasi nome di evento che vogliamo, ok?
‫Quindi vogliamo emettere un evento chiamato newSale, ok?
‫E usando l'esempio del clic
‫su un pulsante che
‫ho usato prima, questa emissione qui è come se stessimo facendo
‫clic sul pulsante, quindi ora dobbiamo impostare questi ascoltatori, ok?
‫E fammi effettivamente farlo
‫prima qui, quindi di nuovo usiamo il nostro oggetto myEmitter.
‫Inserisci che usiamo il metodo on, ok?
‫Quindi su newSale e poi la funzione di callback,
‫che verrà eseguita non appena l'evento viene emesso.
‫Quindi, come al solito, passiamo semplicemente alla console.
‫"C'è stata una nuova vendita! "Va
‫bene, e aggiungiamone un altro.
‫Quindi ricorda che ho detto
‫prima che una delle cose belle di questi emettitori di eventi è
‫che possiamo effettivamente
‫impostare più ascoltatori per lo stesso evento.
‫Quindi facciamolo
‫qui, e così di
‫nuovo, ovviamente, stiamo ascoltando l'evento
‫newSale, (digitando) e poi
‫registriamo solo qualcos'altro.
‫Non importa qui.
‫Quindi '"Nome cliente:', ad esempio 'Jonas''.
‫Quindi, proviamo questo, cancelliamo quello
‫di prima e usiamo il
‫nodo e
‫poi gli eventi. js.
‫Quindi, c'era una vendita e il nome del cliente: Jonas,
‫e quindi vedi già che sta funzionando.
‫Quindi, fantastico, quindi questo è lo schema dell'osservatore, ricordi?
‫Dove questo qui è l'oggetto che emette gli eventi, e poi questi
‫due qui,
‫quindi questo su e questo su,
‫questi sono gli osservatori.
‫Osservano l'emettitore
‫e aspettano che emetta l'evento newSale.
‫E, naturalmente, il nostro emettitore potrebbe anche emettere altri eventi.
‫Come un nuovo cliente o un nuovo ordine o
‫qualcosa del genere, e poi potremmo aggiungere ascoltatori anche per quello, ok?
‫Ora un'altra cosa che
‫volevo mostrarti è che possiamo persino passare
‫argomenti a
‫EventListener passandoli come argomento aggiuntivo nell'emettitore, qui.
‫Quindi diciamo che passa nove, quindi in questo
‫caso solo un numero,
‫e poi abbiamo un ascoltatore che vuole usarlo.
‫(digitando) Quindi myEmitter,
‫(digitando) newSale, e
‫quindi ora questa funzione
‫di
‫callback può accettare un argomento, quindi
‫chiamiamola stock.
‫Quindi fondamentalmente la quantità di articoli
‫rimasti dal prodotto che stiamo vendendo qui.
‫Usiamo una stringa modello.
‫Ora ci sono
‫articoli in stock rimasti in
‫magazzino.
‫Quindi, se eseguiamo questo ora, dovremmo vedere
‫che ora ci sono nove elementi rimasti in
‫magazzino perché abbiamo emesso questo evento fondamentalmente
‫con un nove, e
‫l'ascoltatore può quindi prendere questo valore
‫qui come argomento delle loro funzioni di callback.
‫Quindi questa variabile stock qui in questo caso.
‫Quindi, se lo esegui
‫di nuovo, qui Ci sono nove articoli rimasti in magazzino.
‫Quindi, perfetto, e vedrai che questi tre
‫log qui appaiono esattamente nello stesso ordine in
‫cui sono dichiarati nel codice, ok?
‫E quindi questo è il comportamento normale.
‫Se abbiamo più ascoltatori per lo stesso evento,
‫verranno eseguiti in modo sincrono.
‫Quindi uno dopo l'altro nell'ordine in
‫cui erano nel codice.
‫Quindi questo piccolo esempio funziona già
‫perfettamente, ma se dovessi usare questo modello nella
‫vita reale, allora è una buona pratica creare
‫una nuova classe che erediterà effettivamente dal nodo EventEmitter.
‫Quindi, qualcosa del genere.
‫(digitazione) Quindi diciamo che
‫la classe Sales estende EventEmitter, e questa è
‫la sintassi ES6 o ES2015 per l'ereditarietà della classe.
‫E ancora, spero che tu
‫abbia familiarità con ES6 nel momento in cui stai seguendo questo corso, ok?
‫Quindi, in termini meccanici, EventEmitter è una classe, quindi quella
‫che abbiamo importato dagli eventi nella
‫nostra classe
‫di vendita, è la nuova
‫classe che stiamo creando
‫e che eredita tutto dalla classe EventEmitter, ok?
‫Quindi in ES6 ogni classe ottiene un costruttore che
‫è una funzione
‫che viene eseguita non appena creiamo un nuovo oggetto da una classe, ok?
‫E quello che dobbiamo fare qui è
‫chiamare super, ed è
‫qualcosa che dobbiamo sempre fare quando estendiamo un'altra superclasse, ok?
‫Quindi questa è
‫la classe genitore, e questa è
‫la superclasse, e eseguendo
‫super, otteniamo quindi l'accesso a tutti i metodi della classe genitore.
‫Quindi, di nuovo, EventEmitter in questo caso, ok?
‫E quindi ora quello che dobbiamo fare
‫è effettivamente spostare questo in
‫basso, (facendo clic) e
‫quindi ora il mio emettitore è un nuovo Sales, ok?
‫E quindi ora funzionerà esattamente allo stesso modo,
‫e infatti, eccoci qui, e in
‫realtà questo meccanismo che ti ho appena mostrato qui.
‫Quindi fondamentalmente estendere la classe EventEmitter è esattamente il
‫modo in cui i diversi
‫moduli del nodo, come HTTP, file system e molti altri moduli principali
‫del nodo implementano gli eventi internamente, ok?
‫Quindi tutti in
‫realtà ereditano dalla classe EventEmitter.
‫Ok, e con questo piccolo
‫esempio funzionante, proviamo ora un'altra cosa.
‫Quindi, dal momento che stavo parlando solo ora
‫del modulo HTTP, lascia che ti
‫dimostri che è completamente basato sugli eventi, ok?
‫Quindi abbiamo questa parte funzionante.
‫Creiamo un paio di commenti qui, qualcosa,
‫e poi creiamo un altro esempio quaggiù, va bene?
‫E quello che
‫faremo è fondamentalmente creare un piccolo
‫server web, e poi ascoltare effettivamente l'evento che emette, ok?
‫Quindi, quassù dobbiamo importare il modulo
‫HTTP, (digitando) E
‫poi quaggiù possiamo usarlo.
‫Quindi stiamo creando un
‫server e ora lo farò in modo
‫un po' diverso da come lo abbiamo fatto nel primo incrocio, ok?
‫Ma in realtà funziona esattamente allo stesso modo.
‫Quindi tutto ciò che farò qui è ora http. createserver e proprio così,
‫e ora
‫quello che farò è
‫fondamentalmente ascoltare diversi eventi che
‫il server emetterà.
‫Quindi, per questo, di nuovo, sto usando on,
‫e quindi se vedi . ovunque in un progetto
‫nodo, beh, allora sai già che
‫stai ascoltando o che il codice sta ascoltando un evento, ok?
‫E quindi quello che
‫stiamo ascoltando qui è l'evento di richiesta, ok?
‫E così ora funziona esattamente come
‫prima, abbiamo una
‫funzione di callback che ottiene l'accesso alla richiesta e alla risposta.
‫Quindi niente di te a questo
‫punto abbiamo fatto esattamente questo nel progetto node farm, ok?
‫Quindi, consolati. log
‫(digitando) "richiesta ricevuta"
‫e poi inviamo anche qualcosa indietro.
‫(digitando) Proprio lo
‫stesso testo in realtà, ok?
‫E, naturalmente, possiamo ascoltare più
‫volte lo stesso evento.
‫(clic) Quindi diciamo
‫qui "Un'altra richiesta" usando alcune emoji
‫qui solo per farlo risaltare un po' di più, e
‫non appare.
‫Cosa sta succedendo qui?
‫Ah, ci siamo.
‫Quindi, ascoltando una
‫richiesta, e possiamo anche ascoltare l'evento vicino.
‫Quindi, server in chiusura, e questo è
‫l'evento che
‫viene generato quando il server, come puoi immaginare, si chiude.
‫(digitando) Ok, questo
‫è ascoltare gli eventi, e ora,
‫ricorda, dobbiamo
‫anche avviare effettivamente il server.
‫Quindi, avviamo il server
‫utilizzando server. ascolta, passa
‫nella porta, l'indirizzo che è di nuovo localhost per
‫noi in questo caso, punto
‫uno, e poi, la nostra funzione di callback che è
‫opzionale ma includiamola di nuovo qui.
‫(digitando) "In attesa di
‫richieste... "Allora,
‫iniziamo effettivamente questo, e
‫vediamo In attesa di richiesta... e l'applicazione non si chiude, e ora
‫sai perché non si chiude, giusto?
‫È così perché il ciclo degli eventi è ancora in
‫attesa di I/O in ingresso, giusto?
‫Quindi questo è quello che abbiamo imparato nelle lezioni del ciclo di eventi, ok?
‫Ora facciamo effettivamente una richiesta sulla porta 8.000 su questo URL.
‫(cliccando) (digitando) Ed
‫eccoci qui.
‫Quindi, vediamo Richiesta ricevuta.
‫Quindi funziona perché non appena c'è una nuova
‫richiesta, il server emette automaticamente l'oggetto della richiesta, ok?
‫E possiamo vedere che qui, ovviamente, e qui nella console,
‫vediamo la nostra stringa di
‫richiesta ricevuta.
‫In realtà volevo prenderne un altro qui.
‫Quindi, possiamo, ovviamente, inviare solo una risposta.
‫Quindi qui dovrei avere un'altra console. log invece.
‫Quindi lascia, esci da questo, riavvialo,
‫ricarica e, sì, così ora riceviamo la richiesta ricevuta,
‫che
‫proviene da questo primo EventListener e
‫un'altra richiesta da questo secondo EventListener.
‫Una cosa che probabilmente stai notando è che ognuno di questi qui in
‫realtà è registrato due volte.
‫Ciò significa che il server sta effettivamente emettendo anche
‫l'evento di richiesta due volte.
‫Quindi vediamo perché è così.
‫(digitando)
‫Quindi consolatevi. registro, richiesta. URL.
‫Quindi, ora possiamo
‫accedere all'URL della richiesta.
‫(cliccando) Chiudiamo
‫qui.
‫Eseguilo di nuovo,
‫ricarica e quindi
‫ne abbiamo
‫uno per l'URL di root e poi uno per la favicon. ico Quindi i browser cercano automaticamente di
‫richiedere una favicon
‫per ogni sito web, ok?
‫Ecco perché ognuno di questi è apparso due volte, ok?
‫Quindi, vedi che non sempre dobbiamo effettivamente emettere
‫anche eventi.
‫Questo è di più quando proviamo a usare EventEmitter da soli.
‫Quindi, in pratica, quando proviamo a utilizzare i nostri eventi
‫personalizzati nelle nostre applicazioni.
‫In questo caso, ovviamente, dobbiamo emettere noi
‫stessi gli
‫eventi, ma se stiamo usando un modulo di nodo
‫integrato, allora queste funzioni lì dentro molte volte emetteranno
‫i propri eventi e tutto ciò che dobbiamo
‫fare è ascoltare loro.
‫Quindi è esattamente quello che abbiamo fatto qui,
‫e con questo, penso, ora sai tutto ciò che
‫devi sapere sugli
‫eventi e sei pronto per venire con me al prossimo video.