‫Jonas: Como se prometió,
‫ahora usaremos emisores de eventos y oyentes en la
‫práctica, y comenzaremos creando un nuevo archivo aquí.
‫Entonces eventos. js y cierre este.
‫Entonces, para usar los eventos de nodo integrados,
‫necesitamos requerir el módulo de eventos, y
‫a partir
‫de eso vamos a requerir una clase EventEmitter.
‫Entonces, EventEmitter, este es el nombre
‫estándar para el resultado de requerir este módulo de eventos.
‫Entonces, nuevamente, este es un módulo de nodo integrado, ¿de acuerdo?
‫Y ahora, para crear
‫un nuevo emisor, simplemente creamos una instancia
‫básicamente de la clase que acabamos de importar.
‫Muy simple
‫myEmitter es un nuevo EventEmitter.
‫Entonces EventEmitter así.
‫Entonces, recuerde del último video que
‫EventEmitters puede emitir eventos con nombre, y luego
‫podemos suscribirnos a estos eventos, así
‫que básicamente escúchelos
‫y luego reaccione en consecuencia, ¿de acuerdo?
‫Entonces, es un poco como configurar un
‫EventListener en un elemento tonto, por ejemplo, para hacer
‫clic en un botón, y estoy seguro de
‫que lo ha hecho
‫antes, cuando trabaja con JavaScript en el lado del cliente, ¿verdad?
‫Entonces nuestro emisor eventualmente
‫emitirá un evento con nombre, ¿de acuerdo?
‫Así que
‫configurémoslo, y simplemente finjamos que
‫estamos construyendo una tienda en línea o algo así, ¿de acuerdo?
‫Entonces podemos decir myEmitter. emit (), y
‫luego podemos inventar cualquier nombre de evento que queramos, ¿de acuerdo?
‫Entonces queremos emitir un evento llamado newSale, ¿de acuerdo?
‫Y usando el ejemplo de hacer
‫clic en un botón
‫que usé antes, esta emisión aquí es como si estuviéramos haciendo clic
‫en el botón, y ahora tenemos que configurar estos oyentes, ¿de acuerdo?
‫Y déjame hacer eso
‫antes aquí, y de nuevo usamos nuestro objeto myEmitter.
‫Ingrese que usamos el método on, ¿de acuerdo?
‫Entonces, en newSale y luego en la función de devolución de llamada,
‫que se ejecutará tan pronto como se emita el evento.
‫Entonces, como de costumbre, vayamos simplemente a la consola.
‫"¡Hubo una nueva venta! "Está
‫bien, y agreguemos otro.
‫Así que recuerde que dije antes
‫que una de las cosas buenas de estos emisores de eventos es que
‫en realidad podemos
‫configurar múltiples oyentes para el mismo evento.
‫Así que
‫hagamos eso aquí, y
‫nuevamente, por supuesto, estamos escuchando
‫el evento newSale, (escribiendo) y
‫luego registramos algo más.
‫Realmente no importa aquí.
‫Entonces '"Nombre del cliente:', por ejemplo 'Jonas"'.
‫Entonces, probemos esto, borremos el
‫anterior y usamos el
‫nodo, y
‫luego los eventos. js.
‫Entonces, hubo una venta y un nombre de cliente:
‫Jonas, y ya ves que está funcionando.
‫Entonces, genial, este es el patrón del observador, ¿recuerdas?
‫Donde este aquí es el objeto que emite los eventos, y luego estos
‫dos aquí,
‫así que esto sigue y esto
‫sigue, estos son los observadores.
‫Observan el emisor
‫y esperan hasta que emita el evento newSale.
‫Y, por supuesto, nuestro emisor también podría emitir otros eventos.
‫Como un nuevo cliente o un nuevo pedido o
‫algo así, y luego podríamos agregar oyentes para ese también, ¿de acuerdo?
‫Ahora, otra cosa que
‫quería mostrarles es que incluso podemos pasar argumentos
‫al EventListener pasándolos
‫como un argumento adicional en el emisor, aquí.
‫Entonces, digamos que pasa nueve, en este caso
‫solo un número, y
‫luego tenemos un oyente que quiere usar eso.
‫(escribiendo) Entonces myEmitter,
‫(escribiendo) newSale, y ahora
‫esta función de devolución
‫de
‫llamada puede tomar un argumento, así
‫que llamémoslo stock.
‫Básicamente, la cantidad de artículos
‫que quedan del producto que vendemos aquí.
‫Usemos una cadena de plantilla.
‫Ahora hay artículos
‫en stock que quedan en
‫stock.
‫Entonces, si ejecutamos esto ahora, deberíamos ver
‫que ahora quedan nueve elementos en stock porque
‫emitimos este evento básicamente con un nueve,
‫y el oyente puede
‫recoger este valor aquí como un
‫argumento de sus funciones de devolución de llamada.
‫Entonces, esta variable de valores aquí en este caso.
‫Entonces, si ejecuta
‫esto nuevamente, aquí quedan nueve artículos en stock.
‫Entonces, perfecto, y verá que estos tres registros
‫aquí aparecen exactamente en el mismo orden en que
‫están declarados en el código, ¿de acuerdo?
‫Y ese es el comportamiento normal.
‫Si tenemos varios oyentes para el mismo
‫evento, se ejecutarán sincrónicamente.
‫Entonces uno tras otro en el orden en
‫que estaban en el código.
‫Entonces, este pequeño ejemplo ya funciona
‫perfectamente, pero si usara este patrón en la
‫vida real, entonces es una mejor práctica crear
‫una nueva clase que realmente heredará del nodo EventEmitter.
‫Entonces, algo como esto.
‫(escribiendo) Digamos que la
‫clase Sales extiende EventEmitter, y esa es la
‫sintaxis ES6 o ES2015 para la herencia de clases.
‫Y nuevamente, espero que esté
‫familiarizado con ES6 al momento de tomar este curso, ¿de acuerdo?
‫Entonces, en términos de memoria, EventEmitter es una clase, por lo que
‫la que importamos de eventos a
‫nuestra clase de
‫ventas es la nueva clase
‫que estamos creando y que
‫hereda todo de la clase EventEmitter, ¿de acuerdo?
‫Luego, en ES6, cada clase obtiene un constructor que es
‫una función que se
‫ejecuta tan pronto como creamos un nuevo objeto a partir de una clase, ¿de acuerdo?
‫Y lo que tenemos que hacer aquí es
‫llamar super, y eso es
‫algo que siempre tenemos que hacer cuando ampliamos otra superclase, ¿de acuerdo?
‫Así que esta
‫es la clase principal, y esta es
‫la superclase, y al
‫ejecutar super, obtenemos acceso a todos los métodos de la clase principal.
‫Entonces, nuevamente, EventEmitter en este caso, ¿de acuerdo?
‫Y ahora lo que tenemos que
‫hacer es mover este hacia
‫abajo, (hacer clic)
‫y ahora mi emisor es un nuevo Sales, ¿de acuerdo?
‫Y ahora funcionará exactamente igual, y de
‫hecho, aquí vamos, y en
‫realidad este mecanismo que les acabo de mostrar aquí.
‫Entonces, básicamente, extender la clase EventEmitter es exactamente cómo
‫los diferentes módulos de
‫nodo, como HTTP, el sistema de archivos y muchos otros módulos centrales
‫de nodo implementan eventos internamente, ¿de acuerdo?
‫Entonces, todos ellos realmente
‫heredan de la clase EventEmitter.
‫Bien, y con este pequeño
‫ejemplo funcionando, ahora probemos otra cosa.
‫Entonces, dado que acababa de hablar sobre
‫el módulo HTTP, permítanme demostrarles
‫que se basa completamente en eventos, ¿de acuerdo?
‫Entonces tenemos esta parte funcionando.
‫Creemos un par de comentarios aquí, algo,
‫y luego creemos otro ejemplo aquí, ¿de acuerdo?
‫Y lo que vamos
‫a hacer es básicamente crear un
‫pequeño servidor web y luego escuchar el evento que emite, ¿de acuerdo?
‫Entonces, aquí arriba necesitamos importar el módulo
‫HTTP, (escribiendo) Y
‫luego aquí abajo podemos usarlo.
‫Así que estamos creando
‫un servidor, y ahora lo haré un
‫poco diferente a como lo hicimos en la primera intersección, ¿de acuerdo?
‫Pero en realidad funciona exactamente de la misma manera.
‫Así que todo lo que voy a hacer aquí ahora es http. createerver y así, y
‫ahora lo
‫que voy a hacer
‫es básicamente escuchar los diferentes eventos
‫que emitirá el servidor.
‫Entonces, para eso, de nuevo, estoy usando
‫on, y si ven. en cualquier lugar de
‫un proyecto de nodo, bueno, entonces ya
‫sabe que está escuchando, o que el código está escuchando un evento, ¿de acuerdo?
‫Entonces, el que estamos
‫escuchando aquí es el evento de solicitud, ¿de acuerdo?
‫Y ahora funciona igual que antes, tenemos
‫una función de
‫devolución de llamada que obtiene acceso a la solicitud y la respuesta.
‫Entonces, nada de lo que hiciste en este
‫punto, hicimos exactamente eso en el proyecto de la granja de nodos, ¿de acuerdo?
‫Entonces, consola. log
‫(escribiendo) "solicitud recibida"
‫y luego también enviemos algo.
‫(escribiendo) En realidad,
‫es el mismo texto, ¿de acuerdo?
‫Y, por supuesto, podemos escuchar varias
‫veces el mismo evento.
‫(haciendo clic) Así que
‫digamos aquí "Otra solicitud" usando algunos
‫emoji aquí solo para hacer que resalte un poco más, y
‫no aparecerá.
‫¿Que está pasando aqui?
‫Ah, aquí vamos.
‫Entonces, escuchando una solicitud,
‫y también podemos escuchar el evento de cierre.
‫Entonces, servidor en cierre, y ese es el
‫evento que
‫se dispara cuando el servidor, como puede imaginar, se cierra.
‫(escribiendo) Bien, eso
‫es escuchar los eventos, y ahora,
‫recuerde, también
‫tenemos que iniciar el servidor.
‫Entonces, iniciamos el servidor
‫usando server. escuche, pase
‫en el puerto, la dirección que es localhost nuevamente
‫para nosotros en este caso,
‫el punto uno, y luego, nuestra función de devolución de llamada
‫que es opcional pero incluyémosla aquí nuevamente.
‫(escribiendo) "Esperando solicitudes
‫... "Entonces,
‫comencemos con esto,
‫y vemos Esperando solicitud ... y la aplicación no se cierra, y ahora
‫sabes por qué no se cierra, ¿verdad?
‫Es así porque el bucle de eventos todavía está
‫esperando E / S entrantes, ¿verdad?
‫Entonces eso es lo que aprendimos en las conferencias de eventos, ¿de acuerdo?
‫Ahora hagamos una solicitud en el puerto 8,000 en esta URL.
‫(clic) (escribiendo) Y
‫aquí vamos.
‫Entonces, vemos Solicitud recibida.
‫Entonces esto funciona porque tan pronto como hay una nueva
‫solicitud, el servidor emite automáticamente el objeto de solicitud, ¿de acuerdo?
‫Y podemos ver eso aquí, por supuesto, y aquí en la
‫consola, vemos nuestra cadena de
‫Solicitud recibida.
‫De hecho, quería conseguir otro aquí.
‫Entonces, por supuesto, solo podemos enviar una respuesta.
‫Entonces aquí debería tener otra consola. log en su lugar.
‫Entonces, salga de esto, vuelva a
‫iniciarlo, vuelva a cargar y, sí, ahora recibimos la Solicitud
‫recibida,
‫que es de este primer EventListener, y
‫otra solicitud de este segundo EventListener.
‫Una cosa que probablemente esté notando es que cada uno de estos
‫aquí se registra dos veces.
‫Eso significa que el servidor también está emitiendo el
‫evento de solicitud dos veces.
‫Así que veamos por qué es así.
‫(escribiendo)
‫Entonces consola. registro, solicitud. url.
‫Entonces, con eso, ahora podemos obtener
‫acceso a la URL de la solicitud.
‫(haciendo clic) Salgamos
‫de aquí.
‫Ejecútelo nuevamente, vuelva
‫a cargar, y
‫así tenemos
‫uno para la URL raíz y luego uno para el favicon. ico Entonces, los navegadores automáticamente intentan solicitar
‫un favicon para
‫cada sitio web, ¿de acuerdo?
‫Entonces, es por eso que cada uno de estos apareció dos veces en realidad, ¿de acuerdo?
‫Entonces, ves que no siempre tenemos que emitir
‫también eventos.
‫Eso es más cuando intentamos usar EventEmitter por nuestra cuenta.
‫Básicamente, cuando intentamos utilizar nuestros eventos personalizados
‫en nuestras aplicaciones.
‫En este caso, por supuesto, tenemos que emitir
‫los eventos
‫nosotros mismos, pero si estamos usando un módulo de
‫nodo integrado, entonces estas funciones allí muchas veces emitirán
‫sus propios eventos, y todo lo que tenemos
‫que hacer es escuchar ellos.
‫Así que eso es exactamente lo que hicimos
‫aquí, y con eso, creo que ahora sabes todo lo
‫que necesitas saber
‫sobre los eventos y estás listo para acompañarme al siguiente video.