Akademi JavaScript · Pelajaran

Pemboleh Ubah Peribadi dengan Penutupan

Sembunyikan keadaan di sebalik skop fungsi.

Pelajaran 2 daripada 413 langkah

Pemboleh Ubah Peribadi dengan Penutupan ialah pelajaran Akademi JavaScript percuma di CoddyKit. Ini ialah pelajaran 2 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Akademi JavaScript, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Akademi JavaScript merangkumi sejumlah 4 pelajaran.

Privasi Melalui Penutupan

JavaScript sudah lama tidak mempunyai cara terbina dalam untuk menjadikan medan objek peribadi. Penutupan menyediakan satu cara: pemboleh ubah di dalam fungsi tidak kelihatan dari luar, tetapi masih boleh diakses oleh fungsi yang ditakrifkan di dalamnya.

function secretBox() {
  let secret = "hidden";
  return {
    reveal: () => secret
  };
}
const box = secretBox();
console.log(box.reveal()); // "hidden"
console.log(box.secret);   // undefined

Pembilang Dengan Keadaan Peribadi

Contoh yang lazim: pembilang yang nilainya tidak boleh diusik secara langsung. Hanya kaedah yang dipulangkan boleh mengubahnya.

function makeCounter() {
  let count = 0;
  return {
    increment: () => ++count,
    value: () => count
  };
}
const c = makeCounter();
c.increment();
c.increment();
console.log(c.value()); // 2

Keadaan Tidak Boleh Disentuh

Tiada cara untuk mencapai count dari luar. Percubaan untuk membacanya memulangkan undefined; anda mesti melalui kaedah yang tersedia.

function makeCounter() {
  let count = 0;
  return { inc: () => ++count, get: () => count };
}
const c = makeCounter();
c.count = 100;        // creates an unrelated property
console.log(c.get()); // 0 - real count untouched

Menguatkuasakan Peraturan

Oleh sebab akses berlaku melalui kaedah, anda boleh menguatkuasakan invarian, seperti tidak membenarkan baki menjadi negatif.

function account(start) {
  let balance = start;
  return {
    withdraw: (n) => {
      if (n > balance) return "insufficient";
      balance -= n;
      return balance;
    },
    balance: () => balance
  };
}
const a = account(100);
console.log(a.withdraw(150)); // "insufficient"
console.log(a.withdraw(40));  // 60

Pelbagai Medan Peribadi

Satu penutupan boleh melindungi beberapa pemboleh ubah serentak. Semuanya tersembunyi dan hanya dikongsi antara kaedah yang dipulangkan.

function user(name) {
  let logins = 0;
  let lastSeen = null;
  return {
    login: () => { logins++; lastSeen = "now"; },
    stats: () => ({ name, logins, lastSeen })
  };
}
const u = user("Ada");
u.login();
console.log(u.stats()); // { name: "Ada", logins: 1, lastSeen: "now" }

Fungsi Bantuan Peribadi

Bukan data sahaja; anda juga boleh menyembunyikan fungsi dalaman. Hanya kaedah yang anda dedahkan menjadi awam.

function temperature() {
  let celsius = 0;
  const toF = (c) => c * 9 / 5 + 32; // private
  return {
    set: (c) => { celsius = c; },
    fahrenheit: () => toF(celsius)
  };
}
const t = temperature();
t.set(100);
console.log(t.fahrenheit()); // 212

Instans Berasingan

Setiap panggilan kepada kilang mencipta keadaan peribadi yang berasingan, jadi instans tidak pernah mengganggu satu sama lain.

function makeCounter() {
  let n = 0;
  return { inc: () => ++n };
}
const a = makeCounter();
const b = makeCounter();
console.log(a.inc(), a.inc()); // 1 2
console.log(b.inc());          // 1

Pendedahan Baca Sahaja

Dedahkan pengambil tanpa penetap untuk menjadikan nilai baca sahaja dari luar, sambil membolehkannya diubah dari dalam.

function timer() {
  let ticks = 0;
  setupInternally();
  function setupInternally() { ticks = 3; }
  return { ticks: () => ticks };
}
const t = timer();
console.log(t.ticks()); // 3 - no way to set it outside

Perbandingan: Medan Kelas

JavaScript moden turut menyokong medan kelas #private. Penutupan masih berguna untuk fungsi kilang dan apabila anda mahukan privasi tanpa kelas.

class Counter {
  #count = 0;
  inc() { return ++this.#count; }
}
const c = new Counter();
console.log(c.inc()); // 1

Sebab Ia Berfungsi

Kaedah yang dipulangkan ialah penutupan atas pemboleh ubah luar. Fungsi luar telah dipulangkan, tetapi skopnya terus hidup kerana penutupan itu masih merujuk kepadanya.

Cache Memoisasi

Keadaan peribadi sangat berguna untuk cache. Objek cache kekal tersembunyi dan berterusan antara panggilan.

function memoSquare() {
  const cache = {};
  return (n) => {
    if (cache[n] === undefined) cache[n] = n * n;
    return cache[n];
  };
}
const sq = memoSquare();
console.log(sq(4)); // 16
console.log(sq(4)); // 16 (cached)

Semakan Pantas

Pemboleh ubah peribadi dengan penutupan.

Jawab dalam pelajaran interaktif

Imbas Kembali

Penutupan mewujudkan privasi: pemboleh ubah di dalam kilang tidak boleh dicapai dari luar, tetapi dikongsi antara kaedah yang dipulangkan. Ini membolehkan pembilang yang tidak boleh diusik, baki dengan invarian, fungsi bantuan tersembunyi dan cache. Setiap panggilan kilang menghasilkan keadaan yang berasingan. Medan kelas moden #private ialah pilihan lain, tetapi penutupan amat sesuai untuk kod bergaya kilang.

Percuma untuk bermula

Pelajari JavaScript dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus: 59
Pelajaran: 200

Mula belajar secara percuma Lihat kursus penuh

Soalan Lazim

Adakah pelajaran “Pemboleh Ubah Peribadi dengan Penutupan” percuma?

Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Akademi JavaScript, termasuk “Pemboleh Ubah Peribadi dengan Penutupan”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Akademi JavaScript merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Pemboleh Ubah Peribadi dengan Penutupan”?

Sembunyikan keadaan di sebalik skop fungsi. Anda berlatih Akademi JavaScript menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Akademi JavaScript?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Akademi JavaScript di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 2 daripada 4.

Berapa lamakah pelajaran “Pemboleh Ubah Peribadi dengan Penutupan” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Akademi JavaScript ini?

Ya. Setiap pelajaran Akademi JavaScript menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

Cara Penutupan Menangkap Keadaan
Pemboleh Ubah Peribadi dengan Penutupan
Corak Modul (IIFE)
Fungsi Kilang

← Kembali ke Akademi JavaScript