Property Accessor didalam Object Class Javascript
Melalui objek class kita juga dapat mengubah nilai properti seperti ini:
- class Car {
- constructor(manufacture, color) {
- this.manufacture = manufacture;
- this.color = color;
- this.enginesActive = false;
- }
- }
- const johnCar = new Car("Honda", "Red");
- console.log(`Warna mobil: ${johnCar.color}`); // output -> Warna Mobil: Red
- johnCar.color = "White"; // Mengubah nilai properti color menjadi white
- console.log(`Warna mobil: ${johnCar.color}`); // output -> Warna Mobil: White
Dengan class kita juga dapat mengimplementasi getter/setter sebuah properti menjadi sebuah method seperti ini:
- class Car {
- constructor(manufacture, color) {
- this.manufacture = manufacture;
- this._color = color;
- this.enginesActive = false;
- }
- get color() {
- return `Warna mobile ${this._color}`;
- }
- set color(value) {
- console.log(`Warna mobil diubah dari ${this._color} menjadi ${value}`);
- this._color = value;
- }
- }
- const johnCar = new Car("Honda", "Red");
- console.log(johnCar.color); // output -> Warna Mobil: Red
- johnCar.color = "White"; // Mengubah nilai properti color menjadi white
- console.log(johnCar.color); // output -> Warna Mobil: White
Perhatikan juga ketika kita menerapkan getter/setter pada properti class. Kita perlu mengubah atau membedakan penamaan properti aslinya dengan property accessor yang kita buat. Berdasarkan code convention yang ada kita perlu mengubah properti asli class-nya dengan menambahkan underscore di depan nama propertinya (_color). Tanda underscore berfungsi sebagai tanda bahwa properti _color tidak sebaiknya diakses langsung, namun harus melalui property accessor (getter/setter)
Deklarasi class menggunakan ES6 memiliki sifat yang sama seperti pembuatan class menggunakan function constructor (seperti contoh sebelumnya).
Namun alih-alih menggunakan function constructor dalam menginisialisasi propertinya, class ini memisahkan constructornya dan ditempatkan pada body class menggunakan method spesial yang dinamakan constructor.
- class Car {
- constructor(manufacture, color) {
- this.manufacture = manufacture;
- this.color = color;
- this.enginesActive = false;
- }
- }
constructor biasanya hanya digunakan untuk menetapkan nilai awal pada properti berdasarkan nilai yang dikirimkan pada constructor. Namun sebenarnya kita juga dapat menuliskan logika di dalam constructor jika memang kita memerlukan beberapa kondisi sebelum nilai properti diinisialisasi.
Kita juga melihat penggunaan this pada constructor. Konteks dalam class, keyword this merujuk pada instance dari class tersebut. Sehingga this dapat digunakan untuk mengelola properti yang terdapat pada instance.
Dengan menggunakan default parameters, nilai pada parameter tidak akan menghasilkan undefined walaupun kita tidak memberikan nilai ketika fungsi tersebut dipanggil. Default parameter dapat digunakan pada regular function ataupun arrow function.
- function sayHello(name = "Stranger", greet = "Hello") {
- console.log(`${greet} ${name}!`);
- }
- sayHello("Dimas", "Hai");
- sayHello();
- /* output:
- Hai Dimas!
- Hello Stranger!
- */
- const sayHello = (name = "Stranger", greet = "Hello") => console.log(`${greet} ${name}!`);
- sayHello("Dimas", "Hai");
- sayHello();
- /* output:
- Hai Dimas!
- Hello Stranger!
- */
Pada contoh di atas, kita menggunakan tanda assignment (=) untuk menetapkan parameter name dengan nilai default “Stranger”, dan parameter greet dengan nilai default “Hello”. Hal ini sangat berguna ketika kita memanggil fungsi sayHello() tanpa menetapkan nilai parameter di dalamnya, karena walaupun kita tidak menetapkan nilainya, kedua parameter tersebut tidak akan menghasilkan undefined.
Post a Comment for "Property Accessor didalam Object Class Javascript"