Rumah > hujung hadapan web > tutorial js > Analisis kes aplikasi penutupan bahagian hadapan: Apakah senario aplikasi lazimnya?

Analisis kes aplikasi penutupan bahagian hadapan: Apakah senario aplikasi lazimnya?

WBOY
Lepaskan: 2024-01-13 12:05:07
asal
985 orang telah melayarinya

Analisis kes aplikasi penutupan bahagian hadapan: Apakah senario aplikasi lazimnya?

Analisis kes aplikasi bagi penutupan bahagian hadapan: Dalam situasi apakah ia biasanya berlaku?

Dalam pembangunan bahagian hadapan, penutupan (Closure) adalah konsep yang sangat berkuasa dan biasa digunakan. Ia adalah fungsi khas yang boleh mengakses pembolehubah di luar fungsi, dan pembolehubah ini akan sentiasa dikekalkan dalam ingatan. Aplikasi penutupan boleh membantu kami menyelesaikan beberapa masalah biasa, seperti penswastaan ​​data, storan berubah-ubah, dsb. Jadi, dalam situasi apakah penutupan berlaku? Perkara berikut akan dianalisis melalui contoh kod tertentu.

  1. Penswastaan ​​data

Penutupan boleh membantu kami menswastakan data, mengelakkan penyalahgunaan pembolehubah global dan meningkatkan kebolehselenggaraan dan keselamatan kod. Berikut ialah contoh:

function createCounter() {
  let count = 0; // 私有变量

  function increment() {
    count++;
    console.log(count);
  }

  function decrement() {
    count--;
    console.log(count);
  }

  return {
    increment: increment,
    decrement: decrement
  };
}

let counter = createCounter();
counter.increment(); // 输出:1
counter.decrement(); // 输出:0
Salin selepas log masuk

Dalam contoh ini, kami mencipta kaunter menggunakan penutupan. Logik pembilang dirangkumkan di dalam fungsi dan diakses dengan mengembalikan objek yang mengandungi fungsi kenaikan dan penurunan. Oleh kerana pembolehubah count dirangkumkan di dalam penutupan, ia tidak boleh diakses terus dari luar, memastikan penswastaan ​​pembolehubah. count变量被封装在闭包内部,外部无法直接访问,确保了变量的私有化。

  1. 记忆化计算

闭包还可以帮助我们实现记忆化计算,提高代码的执行效率。记忆化是一种将计算结果缓存起来,以便下次用到相同输入时,可以直接返回缓存的结果,避免重复计算的过程。以下是一个斐波那契数列的例子:

function memoize(f) {
  let cache = {};

  return function (n) {
    if (cache[n] !== undefined) {
      return cache[n];
    }

    let result = f(n);
    cache[n] = result;
    return result;
  };
}

let fibonacci = memoize(function (n) {
  if (n === 0 || n === 1) {
    return n;
  }
  return fibonacci(n - 1) + fibonacci(n - 2);
});

console.log(fibonacci(5)); // 输出:5
Salin selepas log masuk

在这个例子中,我们使用闭包创建了一个记忆化函数memoizememoize接受一个函数f作为参数,并返回一个新的函数。新函数首先检查计算结果是否已经被缓存,如果有,则直接返回缓存结果;如果没有,则通过调用函数f

    Pengiraan memori
    1. Penutupan juga boleh membantu kami melaksanakan pengiraan memori dan meningkatkan kecekapan pelaksanaan kod. Memoisasi ialah proses caching hasil pengiraan supaya pada kali berikutnya input yang sama digunakan, hasil cache boleh dikembalikan terus untuk mengelakkan pengiraan berulang. Berikut ialah contoh jujukan Fibonacci:
    var module = (function () {
      var privateVariable = 10;
    
      function privateFunction() {
        console.log('私有函数执行');
      }
    
      return {
        publicVariable: 20,
        publicFunction: function () {
          console.log('公共函数执行');
          privateVariable++;
          privateFunction();
        }
      };
    })();
    
    console.log(module.publicVariable); // 输出:20
    module.publicFunction(); // 输出:公共函数执行 私有函数执行
    Salin selepas log masuk

    Dalam contoh ini, kami menggunakan penutupan untuk mencipta fungsi memoize memoize. memoize menerima fungsi f sebagai parameter dan mengembalikan fungsi baharu. Fungsi baharu mula-mula menyemak sama ada hasil pengiraan telah dicache. Jika ya, ia mengembalikan hasil cache secara langsung jika tidak, ia mengira hasilnya dengan memanggil fungsi f dan menyimpan hasilnya. Dengan cara ini, jika input yang sama ditemui dalam panggilan berikutnya, hasil cache boleh dikembalikan secara langsung, mengelakkan pengiraan berulang.

    Pembangunan modular

    Penutupan juga boleh membantu kami melaksanakan pembangunan modular, menyusun kod mengikut fungsi dan meningkatkan kebolehselenggaraan dan kebolehgunaan semula kod. Berikut ialah contoh modularisasi mudah:

    rrreee🎜 Dalam contoh ini, kami mencipta modul menggunakan penutupan. Pembolehubah dan fungsi di dalam modul dirangkumkan di dalam penutupan dan tidak boleh diakses terus dari luar, dengan itu mencapai tujuan penyembunyian maklumat dan pengkapsulan fungsi. Pada masa yang sama, dengan mengembalikan objek yang mengandungi pembolehubah awam dan fungsi awam, kami boleh mengakses dan menggunakan ahli awam ini secara luaran. 🎜🎜Ringkasan: 🎜🎜Penutupan mempunyai pelbagai aplikasi dalam pembangunan bahagian hadapan. Selain penswastaan ​​data, pengkomputeran yang dihafal dan pembangunan modular dalam contoh di atas, penutupan juga boleh digunakan dalam pemprosesan acara, pengaturcaraan tak segerak dan senario lain. Dengan menggunakan penutupan dengan betul, kami boleh mengatur dan mengurus kod dengan lebih baik, meningkatkan kebolehbacaan dan kebolehselenggaraan kod, dan juga meningkatkan prestasi kod. Oleh itu, memahami dan menguasai aplikasi penutupan adalah kemahiran penting untuk setiap pembangun bahagian hadapan. 🎜

    Atas ialah kandungan terperinci Analisis kes aplikasi penutupan bahagian hadapan: Apakah senario aplikasi lazimnya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan