JavaScript

Modul pembuka: sejarah dan tempat berjalannya JavaScript, mental model eksekusinya, serta penyiapan lingkungan kerja.

1. Apa itu JavaScript?Sejarah singkat JavaScript, tempat ia berjalan di browser dan Node.js, serta posisinya di dunia web.
2. Cara kerja JavaScriptInterpreter, JIT, dan model satu thread dengan event loop sebagai gambaran mental dasar.
3. Penyiapan lingkunganMenyiapkan konsol browser, editor, dan Node.js untuk menulis serta menjalankan JavaScript.

Fondasi bahasa: program pertama, const dan let, tipe data, koersi, operator, string, serta masukan dan keluaran dasar.

1. Program pertamaMenjalankan console.log pertama lewat konsol browser, tag script, dan Node.js.
2. const dan letDeklarasi variabel modern dengan scope blok dan alasan var menjadi sejarah.
3. Tipe dataTipe-tipe dasar JavaScript dan sifat pengetikan dinamisnya.
4. Koersi tipeKonversi tipe otomatis, perbandingan == vs ===, dan nilai truthy/falsy.
5. Operator dan ekspresiOperator aritmetika, logika, ternary, dan pratayang optional chaining.
6. String dan template literalBacktick, interpolasi, dan metode string yang sering dipakai.
7. I/O dasarprompt dan alert di browser serta pembacaan masukan dengan readline di Node.

Mengatur jalannya program dengan percabangan, perulangan, dan iterasi modern atas array, string, dan Map.

1. if/else dan switchPercabangan dengan if, else if, dan switch beserta truthiness dalam praktik.
2. Perulanganfor, while, do-while, break, dan continue untuk pengulangan tugas.
3. for...of dan iterableIterasi modern atas array, string, dan Map dengan protokol iterable.

Fungsi sebagai unit inti JavaScript: deklarasi, arrow function, parameter, fungsi sebagai nilai, dan pola callback.

1. Deklarasi fungsiParameter, nilai balik, dan hoisting pada deklarasi fungsi.
2. Arrow functionSintaks panah, implicit return, dan kapan memakai bentuk yang mana.
3. Parameter default dan restNilai default parameter dan pengumpulan argumen dengan rest.
4. Fungsi adalah nilaiMengoper fungsi sebagai argumen, menyimpannya di variabel dan object.
5. CallbackPola callback sebagai fondasi kode JavaScript tanpa sintaks khusus.

Struktur data harian JavaScript: object literal, destructuring, spread, array mendalam, dan perilaku referensinya.

1. Object literalProperti, metode, dan akses dot vs bracket pada object literal.
2. DestructuringMembongkar object dan array dengan nilai default serta penggantian nama.
3. Spread dan restMenyalin, menggabungkan, dan mengumpulkan nilai dengan tiga titik.
4. Array mendalamPengindeksan, jebakan length, dan array bersarang.
5. Referensi vs nilaiPerilaku penyalinan primitif vs object dan bug mutasi yang menyertainya.
6. Optional chaining dan nullish coalescingAkses properti dalam yang aman dengan ?. dan nilai cadangan dengan ??.

Pengolahan koleksi dengan map, filter, reduce, metode pencarian, serta sort dan pipeline berantai.

1. map dan filterTransformasi dan pemilihan data array tanpa perulangan manual.
2. reduceAkumulasi array menjadi satu nilai dan kapan perulangan biasa lebih jelas.
3. find, some, every, includesMetode pencarian dan pengujian elemen array.
4. sort dan pipeline berantaiFungsi comparator, method chaining, dan pipeline pengolahan data.

Modul kunci jalur ini: scope leksikal, closure, dan pola-pola praktisnya yang menjelaskan banyak perilaku JavaScript.

1. Scope leksikalFungsi bersarang dan rantai scope yang menentukan dari mana variabel dilihat.
2. ClosureFungsi yang mengingat lingkungannya dan gagasan besarnya.
3. Pola closureState privat, factory function, dan riwayat penangkapan variabel dalam perulangan.

Sistem object JavaScript: aturan this, prototype, dan sintaks kelas dengan pewarisan serta fiturnya.

1. Dasar thisAturan call-site yang menentukan nilai this dan kebingungan klasiknya.
2. Arrow function dan thisthis leksikal pada arrow function dan alasan arrow memperbaiki callback.
3. PrototypeMental model delegasi prototipal dan beda __proto__ vs prototype.
4. KelasSintaks class, constructor, dan metode sebagai pemanis di atas prototype.
5. Pewarisanextends dan super serta pertimbangan kapan komposisi lebih unggul.
6. Getter, setter, staticFitur kelas modern, termasuk field privat dengan tanda pagar.

Menangani operasi yang menunggu: event loop, timer, promise, kombinatornya, async/await, dan fetch.

1. Event loopCall stack, task queue, dan diagram event loop sebagai mental model inti.
2. TimersetTimeout dan setInterval serta alasan JavaScript tidak pernah tidur.
3. PromiseStatus promise dan penanganannya dengan then, catch, dan finally.
4. Kombinator PromisePromise.all, allSettled, race, dan any untuk menggabungkan banyak promise.
5. async/awaitKode asinkron yang tampak berurutan dan penanganan error dengan try/catch.
6. FetchPermintaan HTTP GET dan POST, penanganan JSON, serta pemeriksaan status.

Menghidupkan halaman web: pohon DOM, manipulasi elemen, event, form, penyimpanan klien, dan keamanannya.

1. Pohon DOMdocument.querySelector dan penelusuran node pada pohon DOM.
2. Memanipulasi kontentextContent, keamanan innerHTML, serta pengaturan style dan class.
3. Membuat elemencreateElement, append, dan membangun UI dari data.
4. EventaddEventListener, objek event, bubbling, dan event delegation.
5. Form dan validasiMembaca input, preventDefault, dan validasi langsung pada form.
6. Web StoragelocalStorage dan sessionStorage untuk state yang bertahan setelah reload.
7. Pengenalan IndexedDBBasis data sisi klien untuk menyimpan data dalam jumlah besar secara offline.
8. Petunjuk XSS pada DOMBahaya innerHTML dan dasar Content Security Policy.

Perkakas pengembangan modern: modul ES, npm, linting, formatting, dan pengenalan bundler.

1. Modul ESimport dan export serta scope modul ES.
2. Esensial npmpackage.json, dependencies, dan npm script dalam alur kerja harian.
3. Linting dan formattingESLint dan Prettier untuk kode yang konsisten.
4. Pengenalan bundlerVite, alasan bundling ada, dan dev server.

Penanganan error, debugging, tur sintaks modern, Map, Set, symbol, JSON mendalam, serta Intl dan Unicode.

1. Penanganan errortry/catch/finally, kelas Error kustom, dan jalur error asinkron.
2. DebuggingPanel Sources DevTools, breakpoint, dan konsol di luar log.
3. Tur sintaks modernNullish coalescing mendalam, logical assignment, dan structuredClone.
4. Map, Set, symbolStruktur data Map dan Set serta tipe symbol melampaui object polos.
5. JSON mendalamstringify dan parse, reviver, serta jebakan umum JSON.
6. Intl dan UnicodeFormat dan perbandingan yang mengikuti locale untuk aplikasi global.

Praktik profesional: pengujian otomatis, esensial Node.js, pola asinkron berskala besar, dan organisasi kode.

1. PengujianDasar Vitest/Jest dan unit test untuk fungsi JavaScript.
2. Esensial Node.jsProcess, fs, dan membangun skrip CLI dengan Node.js.
3. Pola asinkron pada skala besarBatas konkurensi serta fetch berurutan vs paralel.
4. Organisasi kodeModul kecil, fungsi murni, dan pemisahan tanggung jawab.
5. Posisi frameworkReact, Vue, dan Svelte dipetakan ke fondasi yang dibangun dalam jalur ini.

Proyek penutup: merencanakan dan membangun aplikasi catatan browser dengan seluruh bekal jalur ini.

1. Perencanaan proyekDaftar fitur, arsitektur, dan pilihan API untuk proyek aplikasi catatan.
2. ImplementasiMembangun aplikasi catatan dengan modul, asinkron, dan pengujian.