Kodeloka- Kodeloka
- Kelas JavaScript
- Materi
Materi tertulis · 22 modul
Materi JavaScript
Kelas JavaScript berbahasa Indonesia: 22 modul tentang tipe dan operator, closure, objek dan class, event loop, Promise dan async/await, fetch, DOM, modul ES, keamanan, dan pengujian.
1 · Fondasi
- 1. Pengantar JavaScript Modern, Tipe Data, dan OperatorMemahami peran mesin JavaScript (JIT), deklarasi variabel const dan let, tujuh tipe data primitif versus objek referensi, jebakan konversi tipe implisit, serta operator…
- 2. Alur Kontrol, Perulangan Modern, dan Fungsi Kelas SatuMengendalikan alur eksekusi dengan if/else, guard clauses, dan perulangan for...of, serta memahami fungsi sebagai warga kelas satu (first-class citizens), perbedaan…
- 3. Lexical Scope, Temporal Dead Zone (TDZ), dan ClosureMemahami aturan visibilitas variabel melalui lexical scoping, mengapa let dan const memiliki Temporal Dead Zone, serta bagaimana fungsi mempertahankan akses ke…
2 · Objek & Data
- 4. Objek dan Array Modern: Destructuring, Immutability (ES2023+), dan Object.groupByMengolah struktur data objek dan array secara bersih menggunakan destructuring, operator spread, penyalinan mendalam structuredClone(), transformasi deklaratif (map…
- 5. Prototipe, Sintaks class, Field Privat (#), dan Pewarisan (extends)Memahami bagaimana pewarisan prototipe (prototypal inheritance) bekerja di balik layar, merancang cetak biru objek dengan sintaks class, menyembunyikan data internal…
- 6. Koleksi Berbasis Kunci: Map, Set (Metode Himpunan Baru), WeakMap, dan SymbolMemilih struktur data yang tepat antara Map vs Object dan Set vs Array, memanfaatkan metode operasi himpunan Set terbaru (union, intersection, difference), mencegah…
- 7. Penanganan Galat (Error Handling), Custom Error, dan Error causeMembangun aplikasi yang tangguh menghadapi kegagalan menggunakan try...catch...finally, memahami jenis-jenis Error bawaan, merancang Custom Error Class, serta merangkai…
- 8. Ekspresi Reguler (RegExp) Modern, Named Capture Groups, dan Pencegahan ReDoSMemvalidasi, mencari, dan mengekstrak pola teks kompleks menggunakan RegExp modern (flag g, i, u, v), Named Capture Groups (?<nama>...), metode matchAll() dan…
- 9. Penanganan Tanggal, Zona Waktu, Intl API, dan Pengantar TemporalMengelola waktu dengan aman menggunakan format ISO 8601 (UTC), memformat tanggal, mata uang Rupiah, selisih waktu relatif ("3 hari yang lalu"), dan daftar kalimat secara…
3 · Asinkron & Iterasi
- 10. Event Loop, Antrean Microtask, Promise, dan async / awaitMembedah bagaimana JavaScript yang single-threaded menangani ribuan operasi asinkron tanpa membeku melalui mekanisme Event Loop (Call Stack, Task Queue vs Microtask…
- 11. Protokol Iterator, Fungsi Generator (function* / yield), dan for await...ofMemahami bagaimana perulangan for...of bekerja di balik layar melalui protokol Iterable/Iterator, menghasilkan deret data malas (lazy evaluation) yang hemat memori…
- 12. Fetch API, Pengolahan JSON, URLSearchParams, dan AbortControllerMengambil dan mengirim data melalui HTTP menggunakan fetch(), memahami mengapa response.ok wajib diperiksa secara eksplisit, menyusun parameter URL dengan…
4 · DOM & Peramban
- 13. Manipulasi DOM yang Aman, Siklus Event, dan Event DelegationMemilih dan memodifikasi elemen DOM menggunakan API modern (querySelector, classList, dataset, createElement, replaceChildren), memahami perambatan event (bubbling &…
- 14. Mengamati Perubahan DOM & Layar secara Efisien: IntersectionObserver, ResizeObserver, dan MutationObserverMenggantikan penyadapan event scroll dan resize yang membebani CPU dengan tiga Observer API modern peramban: IntersectionObserver (visibilitas elemen di layar)…
- 15. Penyimpanan Data di Peramban: localStorage, sessionStorage, dan IndexedDBMenyimpan state aplikasi di sisi klien menggunakan Web Storage API (localStorage dan sessionStorage), membungkus serialisasi JSON dengan aman, menyinkronkan data…
- 16. Modul ES (import / export), Dynamic import(), dan Import MapsMemecah kode aplikasi besar menjadi berkas-berkas modular yang terisolasi menggunakan standar ES Modules (export, import), memuat fitur berat sesuai kebutuhan dengan…
5 · Biner, Worker & Offline
- 17. Komputasi Latar Belakang (Web Workers), WebSocket, dan Server-Sent Events (SSE)Menjaga antarmuka tetap responsif (INP rendah) dengan memindahkan komputasi CPU berat ke utas latar belakang menggunakan Web Workers, serta membangun fitur waktu nyata…
- 18. Membangun Elemen Kustom Mandiri dengan Web Components (customElements & Shadow DOM)Menciptakan tag HTML kustom milik sendiri (seperti <lencana-status> atau <kartu-kode>) menggunakan standar Custom Elements API (customElements.define), mengelola metode…
6 · Keamanan & Kualitas
- 19. Keamanan Front-End: Pencegahan DOM-Based XSS, CORS, dan Content Security Policy (CSP)Melindungi pengguna aplikasi web dari serangan DOM-based Cross-Site Scripting (XSS) dengan menghindari sink berbahaya (innerHTML, eval, URL javascript:), memahami…
- 20. Pengujian Otomatis JavaScript dengan node:test dan node:assertMembangun jaring pengaman kualitas perangkat lunak dengan menulis Unit Test dan Integration Test menggunakan test runner bawaan node:test dan node:assert/strict, pola…
- 21. Manajemen Memori, Garbage Collection, Pencegahan Memory Leak, dan Profiling di DevToolsMemahami bagaimana Garbage Collector JavaScript membebaskan memori berdasarkan keterjangkauan (reachability), mengenali dan memperbaiki 4 sumber kebocoran memori (memory…