‫Jonas: Seperti yang dijanjikan, sekarang
‫kita akan menggunakan event emitter dan listener dalam praktiknya, dan
‫kita mulai dengan membuat file baru di sini.
‫Jadi acara. js dan tutup yang ini.
‫Jadi untuk menggunakan event node bawaan,
‫kita perlu membutuhkan modul event, dan
‫dari
‫situ kita akan membutuhkan kelas EventEmitter.
‫Jadi, EventEmitter, ini adalah semacam
‫nama standar untuk hasil dari membutuhkan modul event ini.
‫Jadi sekali lagi ini adalah modul node bawaan, oke?
‫Dan sekarang untuk membuat emitor
‫baru, kita cukup membuat sebuah instance pada
‫dasarnya dari kelas yang baru saja kita impor.
‫Jadi sangat
‫sederhana myEmitter adalah EventEmitter baru.
‫Jadi EventEmitter seperti ini.
‫Jadi ingat dari video terakhir
‫bahwa EventEmitters dapat memancarkan peristiwa bernama, dan kita
‫kemudian dapat berlangganan peristiwa ini, jadi
‫pada dasarnya dengarkan
‫mereka, lalu bereaksi sesuai dengan itu, oke?
‫Jadi ini seperti menyiapkan EventListener
‫pada elemen bodoh, misalnya, untuk mengklik
‫tombol, dan saya yakin Anda
‫pernah melakukannya sebelumnya,
‫saat bekerja dengan JavaScript di sisi klien, bukan?
‫Jadi emitor kita pada
‫akhirnya akan memancarkan peristiwa bernama, oke?
‫Jadi mari
‫kita atur itu, dan
‫anggap saja kita sedang membangun toko online atau semacamnya, oke?
‫Jadi kita bisa mengatakan myEmitter. emit(), dan kemudian
‫kita dapat membuat nama acara apa pun yang kita inginkan, oke?
‫Jadi kami ingin mengeluarkan acara yang disebut newSale, oke?
‫Dan menggunakan contoh mengklik
‫tombol yang saya
‫gunakan sebelumnya, pancaran ini di sini seolah-olah kita mengklik
‫tombol, dan sekarang kita harus menyiapkan pendengar ini, oke?
‫Dan biarkan saya melakukannya
‫sebelum di sini, dan sekali lagi kita menggunakan objek myEmitter kita.
‫Masukkan bahwa kita menggunakan metode on, oke?
‫Jadi pada newSale dan kemudian fungsi panggilan balik ,
‫yang akan dieksekusi segera setelah acara dipancarkan.
‫Jadi seperti biasanya, mari kita langsung ke konsol.
‫"Ada penjualan baru! "Oke, dan
‫mari kita tambahkan satu lagi.
‫Jadi ingat bahwa saya katakan
‫sebelumnya bahwa salah satu hal yang baik tentang pemancar acara ini adalah bahwa
‫kita benar-benar dapat
‫menyiapkan beberapa pendengar untuk acara yang sama.
‫Jadi mari
‫kita lakukan itu di sini,
‫dan sekali lagi, tentu saja, kita
‫mendengarkan acara newSale, (mengetik) dan kemudian
‫mencatat sesuatu yang lain.
‫Tidak terlalu penting di sini.
‫Jadi '"Nama pelanggan:', misalnya 'Jonas"'.
‫Jadi, mari kita uji ini,
‫hapus yang sebelumnya, dan
‫kita menggunakan
‫node, lalu event. js.
‫Jadi, Ada penjualan dan nama Pelanggan: Jonas, dan
‫Anda sudah melihat bahwa itu berfungsi.
‫Jadi, bagus, jadi ini pola pengamat, ingat?
‫Di mana yang ini di sini adalah objek yang memancarkan peristiwa, dan
‫kemudian dua
‫ini di sini, jadi ini dan
‫ini, ini adalah pengamat.
‫Mereka mengamati
‫emitor dan menunggu sampai memancarkan event newSale.
‫Dan, tentu saja, emitor kita juga bisa memancarkan peristiwa lain.
‫Seperti pelanggan baru atau pesanan baru atau semacamnya, dan
‫kami kemudian dapat menambahkan pendengar untuk yang itu juga, oke?
‫Sekarang hal lain yang ingin
‫saya tunjukkan kepada Anda adalah bahwa kita bahkan dapat
‫meneruskan argumen ke EventListener
‫dengan meneruskannya sebagai argumen tambahan di emitor, di sini.
‫Jadi katakanlah itu melewati sembilan, jadi dalam hal
‫ini hanya sebuah angka,
‫dan kami kemudian memiliki pendengar yang ingin menggunakannya.
‫(mengetik) Jadi myEmitter,
‫(mengetik) newSale, dan
‫sekarang fungsi panggilan
‫balik
‫ini dapat mengambil argumen, jadi sebut
‫saja stok.
‫Jadi pada dasarnya jumlah barang yang
‫tersisa dari produk yang kami jual di sini.
‫Mari kita gunakan string template.
‫Sekarang ada stok
‫barang yang tersisa di
‫stok.
‫Jadi, jika kita menjalankan ini sekarang, kita
‫akan melihat Sekarang ada sembilan item yang tersisa
‫di stok karena kami mengeluarkan acara ini
‫pada dasarnya dengan sembilan, dan
‫pendengar kemudian dapat mengambil nilai ini
‫di sini sebagai argumen dari fungsi panggilan balik mereka.
‫Jadi variabel saham ini di sini dalam hal ini.
‫Jadi jika Anda menjalankan ini
‫lagi, maka di sini Ada sembilan item yang tersisa di saham.
‫Jadi, sempurna, dan Anda melihat bahwa ketiga
‫log ini muncul dalam urutan yang sama persis
‫dengan yang dideklarasikan dalam kode, oke?
‫Dan itulah perilaku normalnya.
‫Jika kita memiliki beberapa pendengar untuk acara yang sama,
‫maka mereka akan berjalan secara sinkron.
‫Jadi satu demi satu dalam urutan bahwa
‫mereka berada dalam kode.
‫Jadi contoh kecil ini sudah bekerja
‫dengan sempurna, tetapi jika Anda menggunakan pola ini
‫dalam kehidupan nyata, maka itu adalah praktik terbaik untuk
‫membuat kelas baru yang sebenarnya akan mewarisi dari node EventEmitter.
‫Jadi, sesuatu seperti ini.
‫(mengetik) Jadi katakanlah
‫kelas Sales memperluas EventEmitter, dan itu adalah
‫sintaks ES6 atau ES2015 untuk pewarisan kelas.
‫Dan sekali lagi, saya harap
‫Anda sudah familiar dengan ES6 pada saat Anda mengambil kursus ini, oke?
‫Jadi dalam istilah hafalan, EventEmitter adalah sebuah kelas, jadi yang
‫kami impor dari acara ke
‫kelas penjualan
‫kami, adalah kelas baru
‫yang kami buat, dan
‫yang mewarisi semuanya dari kelas EventEmitter, oke?
‫Kemudian di ES6 setiap kelas mendapat konstruktor
‫yang merupakan fungsi
‫yang dijalankan segera setelah kita membuat objek baru dari kelas, oke?
‫Dan yang perlu kita lakukan di sini adalah
‫memanggil super, dan itu adalah
‫sesuatu yang selalu harus kita lakukan ketika kita memperluas superclass lain, oke?
‫Jadi ini
‫adalah kelas induknya, dan ini adalah
‫kelas supernya, dan dengan
‫menjalankan super, kita kemudian mendapatkan akses ke semua metode kelas induk.
‫Jadi, sekali lagi, EventEmitter dalam hal ini, oke?
‫Dan sekarang yang harus kita
‫lakukan adalah benar-benar memindahkan
‫yang ini, (mengklik)
‫dan sekarang emitor saya adalah Penjualan baru, oke?
‫Jadi sekarang ini akan bekerja sama persis,
‫dan memang, ini dia, dan
‫sebenarnya mekanisme yang baru saja saya tunjukkan di sini.
‫Jadi pada dasarnya memperluas kelas EventEmitter adalah persis
‫bagaimana modul simpul yang
‫berbeda, seperti HTTP, sistem file, dan banyak modul inti simpul
‫lainnya mengimplementasikan peristiwa secara internal, oke?
‫Jadi semuanya benar-benar
‫mewarisi dari kelas EventEmitter.
‫Oke, dan dengan contoh kecil ini
‫berhasil, sekarang mari kita coba hal lain.
‫Jadi, karena saya baru saja berbicara tentang modul
‫HTTP, izinkan saya menunjukkan kepada
‫Anda bahwa itu sepenuhnya didasarkan pada peristiwa, oke?
‫Jadi kita memiliki bagian ini bekerja.
‫Mari kita buat beberapa komentar di sini,
‫sesuatu, dan kemudian buat contoh lain di sini, oke?
‫Dan yang akan
‫kita lakukan pada dasarnya adalah membuat
‫server web kecil, dan kemudian benar-benar mendengarkan acara yang dipancarkannya, oke?
‫Jadi, di sini kita perlu mengimpor modul HTTP,
‫(mengetik) Dan kemudian
‫di sini kita bisa menggunakannya.
‫Jadi kita sedang
‫membuat server, dan sekarang saya akan
‫melakukannya sedikit berbeda dari yang kita lakukan di persimpangan pertama, oke?
‫Tapi itu sebenarnya bekerja dengan cara yang sama persis.
‫Jadi yang akan saya lakukan di sini sekarang adalah http. createserver dan seperti ini,
‫dan sekarang
‫yang akan saya lakukan
‫adalah mendengarkan berbagai event yang akan
‫dipancarkan oleh server.
‫Jadi untuk itu, sekali lagi, saya menggunakan,
‫dan jika Anda melihat . di mana saja dalam
‫proyek simpul, maka Anda sudah tahu
‫bahwa Anda sedang mendengarkan, atau bahwa kodenya sedang mendengarkan suatu acara, oke?
‫Jadi yang kita
‫dengarkan di sini adalah acara permintaan, oke?
‫Dan sekarang ini berfungsi sama seperti
‫sebelumnya kami memiliki
‫fungsi panggilan balik yang mendapatkan akses ke permintaan dan respons.
‫Jadi tidak ada yang Anda lakukan
‫saat ini kami melakukan hal itu di proyek node farm, oke?
‫Jadi, konsol. log
‫(mengetik) "permintaan diterima" dan
‫kemudian mari kita juga mengirim sesuatu kembali.
‫(mengetik) Hanya teks
‫yang sama sebenarnya, oke?
‫Dan, tentu saja, kita dapat mendengarkan
‫beberapa kali acara yang sama.
‫(mengklik) Jadi katakan saja
‫di sini "Permintaan lain" menggunakan beberapa
‫emoji di sini hanya untuk membuatnya sedikit lebih menonjol, dan itu
‫tidak muncul.
‫Apa yang terjadi di sini?
‫Ah, ini dia.
‫Jadi, mendengarkan permintaan,
‫dan kami juga dapat mendengarkan acara dekat.
‫Jadi, server ditutup, dan itu adalah
‫peristiwa yang
‫dipicu ketika server, seperti yang dapat Anda bayangkan, ditutup.
‫(mengetik) Oke, jadi
‫itu mendengarkan acara, dan sekarang,
‫ingat, kita
‫juga harus benar-benar memulai server.
‫Jadi, dan kami memulai server
‫dengan menggunakan server. dengarkan, berikan
‫port, alamat yang merupakan localhost lagi untuk kami
‫dalam hal ini, poin
‫satu, dan kemudian, fungsi panggilan balik kami yang opsional tetapi
‫mari kita sertakan di sini lagi.
‫(mengetik) "Menunggu
‫permintaan... "Jadi,
‫mari kita mulai ini,
‫dan kita lihat Menunggu permintaan... dan aplikasi tidak mati, dan sekarang Anda
‫tahu mengapa tidak mati, kan?
‫Itu karena loop acara masih menunggu
‫I/O yang masuk, kan?
‫Jadi itulah yang kami pelajari di acara loop lectures, oke?
‫Sekarang mari kita lakukan permintaan pada port 8.000 pada URL ini.
‫(mengklik) (mengetik) Dan
‫ini dia.
‫Jadi, kita melihat Permintaan diterima.
‫Jadi ini berhasil karena begitu ada permintaan
‫baru, server secara otomatis mengeluarkan objek permintaan, oke?
‫Dan kita dapat melihatnya di sini tentu saja, dan di sini di
‫konsol, kita melihat string Permintaan
‫yang diterima.
‫Saya sebenarnya ingin mendapatkan satu lagi di sini.
‫Jadi, tentu saja, kami hanya dapat mengirim satu tanggapan.
‫Jadi di sini saya harus memiliki konsol lain. log sebagai gantinya.
‫Jadi biarkan, keluar dari ini, mulai
‫lagi, muat ulang, dan, ya, jadi sekarang kita menerima
‫Permintaan,
‫yang berasal dari EventListener pertama ini, dan
‫permintaan lain dari EventListener kedua ini.
‫Satu hal yang mungkin Anda perhatikan adalah bahwa masing-masing di sini
‫sebenarnya dicatat dua kali.
‫Jadi itu berarti server sebenarnya memancarkan acara
‫permintaan dua kali juga.
‫Jadi mari kita lihat mengapa demikian.
‫(mengetik)
‫Jadi konsol. log, permintaan. url.
‫Jadi dengan itu, kita sekarang
‫bisa mendapatkan akses ke URL permintaan.
‫(mengklik) Mari kita berhenti
‫di sini.
‫Jalankan lagi, muat
‫ulang, dan kami
‫memiliki
‫satu untuk URL root, dan satu lagi untuk favicon. ico Jadi browser secara otomatis mencoba
‫meminta favicon
‫untuk setiap situs web, oke?
‫Jadi itulah mengapa masing-masing muncul dua kali sebenarnya, oke?
‫Jadi, Anda lihat bahwa tidak selalu kita harus benar-benar
‫juga memancarkan peristiwa.
‫Itu lebih ketika kita mencoba menggunakan EventEmitter kita sendiri.
‫Jadi pada dasarnya, ketika kami mencoba menggunakan acara khusus
‫kami di aplikasi kami.
‫Dalam hal ini, tentu saja, kita harus
‫memancarkan peristiwa
‫itu sendiri, tetapi jika kita menggunakan modul simpul
‫bawaan, maka fungsi-fungsi ini di sana akan berkali-kali
‫memancarkan peristiwanya sendiri, dan yang harus kita
‫lakukan hanyalah mendengarkan mereka.
‫Jadi itulah tepatnya yang kami lakukan di sini,
‫dan dengan itu, saya pikir, Anda sekarang tahu semua yang
‫perlu Anda ketahui
‫tentang acara, dan siap untuk ikut dengan saya ke video berikutnya.