Pustaka melalui Closure di JavaScript

Seringkali di JavaScript dibuat pustaka, yang merupakan kumpulan fungsi untuk digunakan oleh programmer lain.

Pustaka seperti ini biasanya dibungkus ke dalam modul melalui closure. Hal ini dilakukan agar saat pustaka dihubungkan ke dunia luar, sedikit mungkin fungsi yang muncul.

Biasanya, setiap pustaka berusaha untuk membuat hanya satu variabel di dunia luar - sebuah objek yang berisi fungsi-fungsi pustaka. Sementara di dalam kode pustaka, sebagian fungsi merupakan fungsi utama, dan sebagian lagi adalah fungsi pembantu. Jelas, ke dunia luar kita hanya ingin mengekspor fungsi-fungsi yang diperlukan, tanpa mengotori objek yang diekspor dengan fungsi-fungsi pembantu.

Mari kita lihat sebuah contoh. Misalkan kita memiliki kumpulan fungsi berikut yang ingin kita jadikan sebagai pustaka:

math.jsfunction square(num) {
  return num ** 2;
}
function cube(num) {
  return num ** 3;
}
function avg(arr) {
  return sum(arr, 1) / arr.length;
}
function digitsSum(num) {
  return sum(String(num).split(''));
}

// fungsi pembantu
function sum(arr) {
  let res = 0;
  
  for (let elem of arr) {
    res += +elem;
  }
  
  return res;
}

Mari kita kemas fungsi-fungsi kita dalam bentuk modul:

math.js;(function() {
  function square(num) {
    return num ** 2;
  }
  function cube(num) {
    return num ** 3;
  }
  function avg(arr) {
    return sum(arr, 1) / arr.length;
  }
  function digitsSum(num) {
    return sum(String(num).split(''));
  }
  
  // fungsi pembantu
  function sum(arr) {
    let res = 0;
    
    for (let elem of arr) {
      res += +elem;
    }
    
    return res;
  }
})();

Dan sekarang ekspor semua fungsi, kecuali fungsi pembantu:

math.js;(function() {
  function square(num) {
    return num ** 2;
  }
  function cube(num) {
    return num ** 3;
  }
  function avg(arr) {
    return sum(arr, 1) / arr.length;
  }
  function digitsSum(num) {
    return sum(String(num).split(''));
  }
  
  // fungsi pembantu
  function sum(arr) {
    let res = 0;
    
    for (let elem of arr) {
      res += +elem;
    }
    
    return res;
  }
  
  window.math = {square, cube, avg, digitsSum};
})();

Misalkan kita memiliki halaman HTML index.html:

index.html<html>
  <head>
    <script>
      
    </script>
  </head>
</html>

Mari hubungkan pustaka kita ke dalamnya:

index.html<html>
  <head>
    <script src="math.js"></script>
    <script>
      
    </script>
  </head>
</html>

Mari gunakan fungsi dari pustaka kita:

index.html<html>
  <head>
    <script src="math.js"></script>
    <script>
      alert(math.avg([1, 2, 3]) + math.square());
    </script>
  </head>
</html>

javascriptfunction avg1(arr) {
  return sum(arr, 1) / arr.length;
}

function avg2(arr) {
  return sum(arr, 2) / arr.length;
}

function avg3(arr) {
  return sum(arr, 3) / arr.length;
}

// fungsi pembantu
function sum(arr, pow) {
  let res = 0;
  
  for (let elem of arr) {
    res += elem ** pow;
  }
  
  return res;
}