JavaScript - Penyembusan

Hai daar, para pemrogram yang sedang tumbuh! Hari ini, kita akan memulai perjalanan yang menarik ke dunia penyembusan (encapsulation) di JavaScript. Jangan khawatir jika Anda baru dalam pemrograman - saya akan menjadi panduan ramah Anda, dan kita akan menjelajahi konsep ini bersama, langkah demi langkah. Jadi, siapkan tas virtual Anda, dan mari kita mulai!

Apa Itu Penyembusan?

Bayangkan Anda memiliki sebuah peti harta. Anda tentu tidak mau siapa saja membuka dan mengambil permata berharga Anda, kan? Itu sebenarnya apa yang penyembusan melakukan dalam pemrograman. Itu seperti menempatkan kode Anda di dalam gelembung pelindung, memungkinkan hanya beberapa bagian saja yang dapat diakses dari luar.

Dalam kata yang sederhana, penyembusan adalah penggabungan data dan metode yang bekerja pada data itu dalam satu unit atau objek. Itu adalah cara untuk menyembunyikan detil internal bagaimana suatu objek bekerja dan hanya mengungkapkan apa yang diperlukan.

Mengapa Kita Butuh Penyembusan?

Anda mungkin berpikir, "Mengapa kita butuh hal menarik ini penyembusan?" Well, mari saya ceritakan kecil.

Pada suatu waktu, di negeri kode spaghetti, tinggal seorang pemrogram bernama Bob. Kode Bob terbuka untuk siapa saja yang ingin mengubahnya, dan segera, pemrogram lain mulai campur tangan. Kacau terjadi! Tidak ada yang tahu bagian mana dari kode melakukan apa, dan bug berlipat ganda seperti kelinci.

Ini adalah tempat penyembusan datang untuk menyelamatkan. Itu membantu kita:

1. Perlindungan data dari modifikasi yang tak disengaja
2. Menyembunyikan detil implementasi yang kompleks
3. Membuat kode kita lebih terorganisir dan mudah untuk dipelihara
4. Mengurangi dependensi antara bagian yang berbeda dari kode kita

Cara Yang Berbeda untuk Mencapai Penyembusan di JavaScript

Di JavaScript, kita memiliki beberapa trik di tangan untuk mencapai penyembusan. Mari kita jelajahi mereka satu per satu:

Mencapai Penyembusan Menggunakan penutup Fungsi (Function Closures)

Penutup adalah seperti gelembung magis di JavaScript yang mengingat lingkungan tempat mereka diciptakan. Kita dapat menggunakan mereka untuk membuat variabel dan metode pribadi. Mari kita lihat contoh:

function createBankAccount(initialBalance) {
let balance = initialBalance;

return {
deposit: function(amount) {
balance += amount;
console.log(`Deposit ${amount}. Saldo baru adalah ${balance}`);
},
withdraw: function(amount) {
if (amount <= balance) {
balance -= amount;
console.log(`Tarik ${amount}. Saldo baru adalah ${balance}`);
} else {
console.log("Dana tidak cukup!");
}
},
getBalance: function() {
return balance;
}
};
}

const myAccount = createBankAccount(1000);
myAccount.deposit(500);  // Deposit 500. Saldo baru adalah 1500
myAccount.withdraw(200); // Tarik 200. Saldo baru adalah 1300
console.log(myAccount.getBalance()); // 1300
console.log(myAccount.balance); // undefined

Dalam contoh ini, balance adalah variabel pribadi kita. Itu tidak dapat diakses secara langsung dari luar fungsi createBankAccount. Kita hanya dapat berinteraksi dengannya melalui metode yang kita perlihatkan: deposit, withdraw, dan getBalance. Ini adalah penyembusan dalam aksi!

Mencapai Penyembusan Menggunakan Kelas ES6 dan Variabel Pribadi

Dengan pengenalan kelas ES6, kita mendapatkan cara yang lebih familiar untuk membuat objek dan mencapai penyembusan. Ini adalah bagaimana kita dapat melakukannya:

class BankAccount {
#balance;  // Field pribadi

constructor(initialBalance) {
this.#balance = initialBalance;
}

deposit(amount) {
this.#balance += amount;
console.log(`Deposit ${amount}. Saldo baru adalah ${this.#balance}`);
}

withdraw(amount) {
if (amount <= this.#balance) {
this.#balance -= amount;
console.log(`Tarik ${amount}. Saldo baru adalah ${this.#balance}`);
} else {
console.log("Dana tidak cukup!");
}
}

getBalance() {
return this.#balance;
}
}

const myAccount = new BankAccount(1000);
myAccount.deposit(500);  // Deposit 500. Saldo baru adalah 1500
myAccount.withdraw(200); // Tarik 200. Saldo baru adalah 1300
console.log(myAccount.getBalance()); // 1300
console.log(myAccount.#balance); // SyntaxError: Field '#balance' harus dideklarasikan dalam kelas yang mengelilingi

Dalam contoh ini, kita menggunakan simbol # untuk mendeklarasikan balance sebagai field pribadi. Ini berarti itu hanya dapat diakses dalam kelas BankAccount, bukan dari luar.

Mencapai Penyembusan Menggunakan Getter dan Setter

Getter dan setter adalah metode khusus yang memungkinkan kita mendefinisikan bagaimana properti diakses atau dimodifikasi. Mereka seperti pengawal keamanan untuk properti objek kita. Mari kita lihat mereka dalam aksi:

class Circle {
constructor(radius) {
this._radius = radius;
}

get radius() {
return this._radius;
}

set radius(value) {
if (value <= 0) {
throw new Error("Radius harus positif");
}
this._radius = value;
}

get area() {
return Math.PI * this._radius ** 2;
}
}

const myCircle = new Circle(5);
console.log(myCircle.radius); // 5
console.log(myCircle.area);   // 78.53981633974483

myCircle.radius = 10;
console.log(myCircle.radius); // 10

myCircle.radius = -1; // Error: Radius harus positif

Dalam contoh ini, kita menggunakan getter untuk membaca radius dan setter untuk memodifikasinya. Setter termasuk pemeriksaan untuk memastikan radius selalu positif. Kita juga memiliki getter untuk area yang menghitung luas secara langsung.

Manfaat Penyembusan di JavaScript

Sekarang kita telah melihat bagaimana mencapai penyembusan, mari rangkum manfaatnya:

1. Perlindungan Data: Itu mencegah akses yang tak sah ke internal objek kita.
2. Flexibilitas: Kita dapat mengubah implementasi internal tanpa mempengaruhi kode eksternal yang menggunakan objek kita.
3. Modularitas: Itu membantu dalam membuat unit kode yang mandiri, membuat kode kita lebih modular dan mudah untuk dikelola.
4. Debugging: Dengan membatasi di mana data dapat dimodifikasi, itu mudah untuk menelusuri bug.
5. Abstraksi: Itu memungkinkan kita menyembunyikan detil implementasi yang kompleks dan menyediakan antar muka sederhana untuk menggunakan objek kita.

Tabel Metode

Ini adalah tabel praktis yang menggabungkan metode yang kita diskusikan untuk mencapai penyembusan:

Metode	Deskripsi	Contoh
Penutup Fungsi	Menggunakan penutup untuk membuat variabel pribadi	function createObject() { let privateVar = 0; return { getVar: () => privateVar }; }
Kelas ES6 dengan Field Pribadi	Menggunakan # untuk mendeklarasikan field pribadi dalam kelas	class MyClass { #privateField; constructor() { this.#privateField = 0; } }
Getter dan Setter	Menggunakan metode khusus untuk mengontrol akses ke properti	class MyClass { get prop() { return this._prop; } set prop(value) { this._prop = value; } }

Dan itu adalah dia, teman-teman! Kita telah melakukan perjalanan melalui negeri penyembusan, dari konsep dasarnya ke cara-cara berbeda untuk mengimplementasikannya di JavaScript. Ingat, penyembusan adalah seperti seorang penjaga rahasia yang baik - itu tahu apa yang harus dibagikan dan apa yang harus disembunyikan. Ketika Anda terus melanjutkan petualangan pemrograman Anda, Anda akan menemukan penyembusan menjadi seorang teman yang dapat dipercaya dalam membuat kode yang kuat dan mudah dipelihara.

Tetap berlatih, stay curious, dan selamat coding!

Credits: Image by storyset