Eloquent JavaScript: Pengantar Modern tentang Pemrograman

📚 Ringkasan Konten

Panduan komprehensif tentang pemrograman modern menggunakan JavaScript. Kursus ini mencakup prinsip dasar pemrograman, spesifikasi bahasa JavaScript, integrasi dengan peramban web, serta pengembangan sisi server dengan Node.js, termasuk lima aplikasi proyek dunia nyata.

Perjalanan mendalam dan elegan ke inti dari pemrograman JavaScript.

Penulis: Marijn Haverbeke

Ucapan Terima Kasih: Didukung oleh 454 pendukung finansial; ilustrasi oleh Wasif Hyder, Max Xiantu, Margarita Martínez, José Menor, Jim Tierney, Dyle MacGregor, Jeff Avallone, Thomas Palef, dan Antonio Perdomo Pastor.

🎯 Tujuan Pembelajaran

1. Mendefinisikan apa itu program dan menjelaskan berbagai tingkat abstraksi dalam bahasa komputer.
2. Menggunakan angka JavaScript dan operator aritmetika untuk menghasilkan nilai.
3. Mendeklarasikan dan memperbarui variabel sambil mematuhi konvensi penamaan dan batasan kata kunci yang dipesan.
4. Menerapkan alur kontrol yang kuat menggunakan do loop, for loop, dan pernyataan switch sambil menjaga kode bersih melalui indentasi dan komentar.
5. Mendefinisikan dan memanggil fungsi menggunakan berbagai notasi, menangani parameter, argumen opsional, dan lingkup leksikal bersarang.
6. Menerapkan konsep fungsional canggih seperti rekursi, closure, dan stack panggilan untuk memecahkan teka-teki algoritmik kompleks.
7. Menggunakan metode khusus objek dan array untuk mengelola struktur data dan string yang kompleks.
8. Menerapkan fungsi tingkat tinggi (filter, map, reduce) untuk mengabstraksi logika dan menggabungkan transformasi data.
9. Menavigasi dan memanipulasi rantai prototipe untuk membuat instance objek terstruktur, dapat digunakan kembali, dan antarmuka polimorfik.
10. Menerapkan antarmuka polimorfik untuk menangani visualisasi data kompleks (tabel).

🔹 Pelajaran 1: Dasar-Dasar JavaScript dan Struktur Program

Gambaran Umum: Pelajaran ini memperkenalkan konsep dasar pemrograman menggunakan JavaScript, bergerak dari definisi filosofis sebuah program hingga mekanisme praktis kode. Siswa akan mengeksplorasi bagaimana data direpresentasikan melalui tipe dan bit, bagaimana memanipulasi nilai menggunakan operator, serta bagaimana menyusun program menggunakan variabel, ekspresi, dan pernyataan. Pelajaran juga membahas perilaku unik JavaScript, seperti konversi tipe otomatis dan evaluasi short-circuit.

Hasil Pembelajaran:

• Mendefinisikan apa itu program dan menjelaskan berbagai tingkat abstraksi dalam bahasa komputer.
• Menggunakan angka JavaScript dan operator aritmetika untuk menghasilkan nilai.
• Mendeklarasikan dan memperbarui variabel sambil mematuhi konvensi penamaan dan batasan kata kunci yang dipesan.

🔹 Pelajaran 2: Fungsi dan Struktur Data Kompleks

Gambaran Umum: Pelajaran ini mengeksplorasi blok bangunan penting dari pemrograman terstruktur, dengan fokus pada alur kontrol lanjutan, teknik pemrograman fungsional, dan organisasi data kompleks. Siswa akan menguasai cara mengemas logika dalam fungsi, mengelola visibilitas variabel melalui lingkup dan closure, serta memanipulasi objek yang dapat diubah untuk menganalisis data dunia nyata seperti korelasi statistik.

Hasil Pembelajaran:

• Menerapkan alur kontrol yang kuat menggunakan do loop, for loop, dan pernyataan switch sambil menjaga kode bersih melalui indentasi dan komentar.
• Mendefinisikan dan memanggil fungsi menggunakan berbagai notasi, menangani parameter, argumen opsional, dan lingkup leksikal bersarang.
• Menerapkan konsep fungsional canggih seperti rekursi, closure, dan stack panggilan untuk memecahkan teka-teki algoritmik kompleks.

🔹 Pelajaran 3: Fungsi Tingkat Tinggi dan Prototipe

Gambaran Umum: Pelajaran ini mengeksplorasi transisi dari manipulasi data dasar ke pola lanjutan fungsional dan berbasis objek dalam JavaScript. Ini mencakup penyimpanan data yang efisien menggunakan Map dan objek global, kekuatan fungsi tingkat tinggi untuk mengabstraksi tindakan (filtering, transformasi, dan ringkasan), serta mekanisme dasar sistem objek JavaScript, termasuk prototipe, konstruktor, dan polimorfisme.

Hasil Pembelajaran:

• Menggunakan metode khusus objek dan array untuk mengelola struktur data dan string yang kompleks.
• Menerapkan fungsi tingkat tinggi (filter, map, reduce) untuk mengabstraksi logika dan menggabungkan transformasi data.
• Menavigasi dan memanipulasi rantai prototipe untuk membuat instance objek terstruktur, dapat digunakan kembali, dan antarmuka polimorfik.

🔹 Pelajaran 4: Pemrograman Berorientasi Objek dan Manajemen Kesalahan

Gambaran Umum: Pelajaran ini mengeksplorasi pola lanjutan berorientasi objek dalam JavaScript, dengan fokus pada polimorfisme melalui antarmuka tata letak tabel dan desain ekosistem simulasi ("Electronic Life"). Pelajaran beralih ke keandalan perangkat lunak dengan membahas "Mode Ketat", teknik debugging, serta pentingnya pengujian terstruktur untuk mengurangi kesalahan umum programmer.

Hasil Pembelajaran:

• Menerapkan antarmuka polimorfik untuk menangani visualisasi data kompleks (tabel).
• Membandingkan pewarisan dan komposisi untuk membangun struktur objek yang dapat diperluas.
• Mengelola konteks eksekusi (this) dalam fungsi tingkat tinggi dan metode objek.

🔹 Pelajaran 5: Pencocokan Pola dan Modularisasi

Gambaran Umum: Pelajaran ini membahas dua persyaratan modern pemrograman: memproses data string kompleks dan mengorganisasi kode menjadi struktur yang dapat dipertahankan. Siswa akan belajar menggunakan Ekspresi Reguler untuk menggambarkan dan memanipulasi pola teks, diikuti dengan eksplorasi modularisasi untuk mengisolasi kode, mengelola namespace, dan memfasilitasi penggunaan kembali.

Hasil Pembelajaran:

• Membangun dan menguji ekspresi reguler menggunakan notasi literal dan konstruktor.
• Menerapkan teknik pencocokan pola lanjutan termasuk pengelompokan, backtracking, dan pengulangan non-greedy.
• Menerapkan prinsip desain modular untuk mencegah pencemaran namespace dan memisahkan komponen program.

🔹 Pelajaran 6: Desain Bahasa dan Lingkungan Web

Gambaran Umum: Pelajaran ini mengeksplorasi transisi dari desain perangkat lunak terstruktur ke pembuatan bahasa pemrograman khusus bernama "Egg". Ia juga menghubungkan konsep-konsep ini ke lingkungan Web, menjelaskan bagaimana jaringan, HTML, dan Model Objek Dokumen (DOM) menciptakan antarmuka yang dapat diprogram bagi peramban. Siswa akan belajar mengelola kompleksitas kode melalui modularitas dan memanipulasi dokumen web langsung menggunakan JavaScript.

Hasil Pembelajaran:

• Menerapkan sistem modul yang kuat menggunakan fungsi define dan mengelola dependensi kompleks.
• Membangun parser dan evaluator fungsional untuk bahasa domain khusus, termasuk dukungan skoping dan fungsi.
• Menjelaskan arsitektur Web, termasuk TCP/IP, struktur HTML, dan implikasi keamanan dari sandbox browser.

🔹 Pelajaran 7: Event dan Platform Interaktif

Gambaran Umum: Pelajaran ini mengeksplorasi sinergi antara manipulasi DOM, gaya CSS, dan penanganan event kompleks untuk menciptakan pengalaman web interaktif dan game. Siswa akan belajar mengendalikan tata letak dan animasi, mengelola sifat asinkron dari input pengguna, mengoptimalkan kinerja melalui teknik waktu, serta merancang game platform berbasis grid menggunakan prinsip berorientasi objek.

Hasil Pembelajaran:

• Memanipulasi Tata Letak dan Gaya DOM: Gunakan JavaScript untuk membaca dimensi elemen, menerapkan gaya cascade, dan menganimasikan elemen menggunakan posisi CSS dan trigonometri.
• Menguasai Penjadwalan Event: Terapkan penanganan event lanjutan termasuk kendali propagasi, mencegah tindakan default, dan mengelola event khusus (keyboard, mouse, scroll, dan fokus).
• Mengoptimalkan Eksekusi Skrip: Terapkan web worker untuk pemrosesan latar belakang dan gunakan debouncing/throttling untuk mengelola event frekuensi tinggi.

🔹 Pelajaran 8: Grafis Canvas dan Protokol Jaringan

Gambaran Umum: Pelajaran ini mengeksplorasi transisi dari rendering game berbasis DOM ke API HTML5 Canvas yang berkinerja tinggi, sekaligus mekanisme dasar fisika platformer 2D. Siswa akan belajar menerapkan logika game kompleks termasuk gravitasi dan deteksi tabrakan sambil menguasai teknik menggambar imperatif. Selain itu, pelajaran memperkenalkan protokol HTTP dan objek XMLHttpRequest untuk menangani komunikasi antar klien-server.

Hasil Pembelajaran:

• Menerapkan deteksi tabrakan berbasis grid dan gerakan yang dipengaruhi gravitasi dalam lingkungan game.
• Menggunakan API HTML5 Canvas untuk merender jalur, kurva, gambar, dan sprite sheet animasi.
• Menerapkan transformasi koordinat (skala, rotasi, flip) dan mengelola status konteks menggunakan save dan restore.

🔹 Pelajaran 9: Formulir Lanjutan dan Aplikasi Persisten

Gambaran Umum: Pelajaran ini mengeksplorasi teknik pengembangan web lanjutan, dengan fokus pada komunikasi asinkron melalui XMLHttpRequest dan Promises, interaksi mendalam dengan bidang formulir HTML, serta persistensi data sisi klien. Siswa akan belajar mengelola permintaan jaringan dengan header khusus dan menangani kesalahan dalam aliran asinkron dengan membangun aplikasi catatan lukisan modular dan alat catatan persisten.

Hasil Pembelajaran:

• Mengonfigurasi dan mengeksekusi permintaan jaringan asinkron menggunakan XMLHttpRequest dan chaining berbasis Promise.
• Memanipulasi perilaku formulir kompleks, termasuk manajemen fokus, menonaktifkan bidang, dan penanganan file.
• Menerapkan penyimpanan data sisi klien menggunakan localStorage dan sessionStorage untuk mempertahankan status aplikasi.

🔹 Pelajaran 10: Pengembangan Sisi Server dengan Node.js

Gambaran Umum: Pelajaran ini menghubungkan antara interaktivitas sisi klien tingkat lanjut dan logika sisi server. Siswa pertama kali menguasai alat manipulasi canvas yang kompleks dan keterbatasan keamanan browser sebelum beralih ke lingkungan Node.js untuk membangun server file asinkron dan aplikasi web real-time menggunakan polling panjang dan routing RESTful.

Hasil Pembelajaran:

• Menerapkan alat menggambar lanjutan (Line, Erase, Spray Paint, Flood Fill) dan mengelola keamanan canvas (Tainting).
• Menjalankan skrip sisi server menggunakan Node.js, mengelola dependensi melalui NPM dan menangani I/O asinkron dengan callback dan promises.
• Membangun server HTTP fungsional yang mampu melakukan manipulasi file, pemrosesan permintaan JSON, dan pembaruan real-time melalui long-polling.