Langsung ke konten utama

Cara Membuat Instance di Dalam Class Javascript

Setelah kita membuat class pada JavaScript, lantas bagaimana cara membuat instance dari class tersebut? 

Tapi sebelumnya, apa itu instance? Instance merupakan objek yang memiliki properti dan method yang telah ditentukan oleh blueprint-nya (class), atau singkatnya adalah objek yang merupakan hasil realisasi dari sebuah blueprint.
Sama seperti constructor function, untuk membuat instance dari class pada ES6 kita gunakan keyword new.

  1. class Car {

  2.     constructor(manufacture, color) {

  3.         this.manufacture = manufacture;

  4.         this.color = color;

  5.         this.enginesActive = false;

  6.     }

  7. }

  8.  

  9. const johnCar = new Car("Honda", "Red");


Pembuatan class menggunakan ES6 lebih ketat dibandingkan dengan constructor function, di mana dalam pembuatan instance wajib menggunakan keyword new. Jika kita tidak menuliskannya, maka akan terjadi error seperti ini:

  1. class Car {

  2.     constructor(manufacture, color) {

  3.         this.manufacture = manufacture;

  4.         this.color = color;

  5.         this.enginesActive = false;

  6.     }

  7. }

  8.  

  9. const johnCar = Car("Honda", "Red");

  10.  

  11. /* error:

  12. TypeError: Class constructor Car cannot be invoked without 'new'

  13. */


Kita juga dapat membuat banyak instance dari class yang sama, dan tentunya objek yang kita buat memiliki karakteristik (properti dan method) yang sama. Walaupun sama, namun nilai dari propertinya bersifat unik atau bisa saja berbeda. Contohnya seperti ini:

  1. class Car {

  2.     constructor(manufacture, color) {

  3.         this.manufacture = manufacture;

  4.         this.color = color;

  5.         this.enginesActive = false;

  6.     }

  7. }

  8.  

  9. const johnCar = new Car("Honda", "Red");

  10. const adamCar = new Car("Tesla", "Black");

  11.  

  12. console.log(johnCar.manufacture);

  13. console.log(adamCar.manufacture);

  14.  

  15. /* output:

  16. Honda

  17. Tesla

  18. */


Variabel johnCar dan adamCar merupakan sebuah objek dari Car. Tentu keduanya akan memiliki properti manufacturecolor, dan enginesActive. Namun pada output kita melihat bahwa nilai dari properti kedua objek tersebut berbeda, karena kita dapat memberikan nilai yang berbeda pada saat objeknya dibuat.

Postingan populer dari blog ini

Apa Itu JSON?

Setelah kita mengetahui apa itu Web API dan cara pengujiannya menggunakan Postman, sekarang saatnya kita mempelajari suatu format yang biasa digunakan dalam transaksi data menggunakan Web API, yaitu JSON. Jauh pada materi sebelumnya, atau jika Anda sudah mengikuti kelas  Belajar Dasar Pemrograman Web ,  tentunya Anda sudah mengenal dan menggunakan JSON bukan? Pada materi kali ini kita akan membahas JSON lebih detail lagi. JSON sendiri adalah singkatan dari JavaScript Object Notation. JSON merupakan format yang sering digunakan dalam pertukaran data. Saat ini JSON banyak diandalkan karena formatnya berbasis teks dan relatif mudah dibaca. Bukan hanya JavaScript, walaupun memiliki nama JavaScript Object Notation, format JSON ini dapat digunakan oleh hampir semua bahasa pemrograman yang ada. Jika Anda belajar fundamental dalam membangun aplikasi Android pada kelas Dicoding, baik menggunakan Kotlin ataupun Java, Anda akan berhadapan dengan JSON untuk transaksi datanya. Lalu seperti...

Constructor didalam Javascript

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 peng...

Cara mengaktifkan mode Picture-in-Picture di google chrome

Pada kesempatan kali ini saya akan share cara mengaktifkan mode Picture-in-Picture di google chrome. Yang di maksud mode Picture-in-Picture adalah memutar video pada jendela lain secara overlay / mengapung. Jadi dengan mengaktifkan mode Picture-in-Picture ini, anda bisa nonton video sembari melakukan aktifitas yang lainnya. Sebelumnya Apple sudah memperkenalkan mode Picture-in-Picture ini di