Cara bermain Closure Celengan
- Baca instruksi level. Nama fungsi yang harus kamu tulis, misalnya
buatCelengan, disebut di sana. - Ubah kode di editor. Buku uji di sebelahnya menjalankan beberapa baris yang memakai fungsimu dan menampilkan hasil tiap baris.
- Baris bertanda ✓ sudah sesuai. Baris bertanda ✗ menunjukkan hasilmu dan hasil yang seharusnya.
- Tekan Cek jawaban atau Ctrl + Enter kalau semua baris sudah ✓.
- Kalau buntu, buka Petunjuk. Petunjuk pertama mengarahkan, petunjuk terakhir hampir menjawab.
- Level yang sudah selesai tetap tercentang saat kamu kembali dengan browser yang sama.
Yang kamu pelajari
- Level 1
Fungsi yang mengembalikan fungsi
Fungsi dalam tetap bisa membaca parameter fungsi luarnya, walaupun fungsi luarnya sudah selesai.
- Level 2
Fungsi pabrik
Variabel yang dibuat di dalam pabrik dibuat baru di tiap panggilan, jadi tiap celengan punya hitungannya sendiri.
- Level 3
Umur variabel
Variabel di dalam fungsi setor dibuat ulang di tiap setoran. Saldo harus tinggal satu tingkat di luarnya.
- Level 4
Beberapa method, satu closure
Semua method yang ditulis di dalam pabrik yang sama membaca variabel yang sama.
- Level 5
Variabel privat
Properti objek bisa ditulis dari luar, variabel di closure tidak. Method juga tidak bergantung pada
this. - Level 6
Referensi yang bocor
Mengembalikan array dari closure memberi akses ke array itu sendiri. Kembalikan salinannya.
- Level 7
let vs var di loop
letmembuat variabel baru di tiap putaran,varhanya satu untuk seluruh loop. - Level 8
once
Fungsi pembungkus yang mengingat apakah fungsi aslinya sudah pernah jalan.
- Level 9
Memoize
Menyimpan hasil per argumen di
Mapmilik closure supaya hitungan yang sama tidak diulang. - Level 10
State di closure
Penanda seperti
pecahmengubah perilaku method berikutnya tanpa bisa disentuh dari luar.
Closure menyimpan variabel, bukan nilai
Fungsi yang dibuat di dalam fungsi lain membawa akses ke variabel di sekitarnya. Yang dibawa adalah variabelnya, bukan salinan nilainya, jadi setor dan lihat yang dibuat di buatCelengan yang sama melihat saldo yang sama, dan perubahan dari setor langsung terlihat di lihat.
Itu juga sebabnya loop dengan var membuat semua tombol menyebut nomor 4: semua fungsi membawa satu variabel i yang sama, dan nilainya sudah 4 saat tombol dipanggil. Dengan let, tiap putaran punya variabel i sendiri.
Tanya jawab
Apakah harus daftar akun untuk bermain?
Tidak. Semua level bisa dimainkan tanpa akun. Kemajuanmu disimpan di browser yang kamu pakai, jadi akan hilang kalau data browser dihapus.
Di mana kodeku dijalankan?
Di Web Worker di dalam iframe terpisah, bukan di halaman ini. Kodemu tidak bisa membaca cookie atau data Mahir, dan perulangan yang tidak berhenti dihentikan setelah 1 detik.
Bagaimana game ini tahu saldoku privat?
Buku uji mencoba menulis c.saldo = 999999 lalu memanggil c.lihat(). Kalau saldo disimpan di properti objek, hasilnya ikut berubah. Kalau disimpan di variabel closure, hasilnya tetap.
Bolehkah memakai class dengan field #privat?
Boleh, asal method-nya tetap jalan saat dilepas dari objeknya (lihat pertanyaan berikutnya). Yang dicek adalah perilaku celengannya, bukan cara menulisnya, dan field #saldo juga tidak bisa diubah dari luar. Game ini memakai closure karena polanya muncul di banyak tempat lain, seperti event handler, hook React, dan fungsi once atau debounce.
Kenapa method yang memakai this gagal di level 5?
Buku uji juga memakai const { setor } = c lalu memanggil setor(100). Method yang dilepas dari objeknya kehilangan this. Method yang membaca variabel closure tetap jalan.