JavaScript – Tentang JavaScript Object [Bag. 1]

Kita tentu familiar dengan konsep OOP yang dimiliki oleh beberapa pemrograman seperti Java dan C#. Di JavaScript juga memiliki konsep obyek yang hampir mirip dengan OOP. Hal terpenting dan fundamental dari tipe data pada JavaScript adalah tipe data Object. Selain tipe data Object, JavaScript juga memiliki lima jenis tipe data lain (tipe data primitif): Number, String, Boolean, Undefined, dan Null. Perbedaannya adalah tipe data primitif bersifat immutable, sedangkan Object bersifat mutable. Untuk lebih jelasnya mengenai immutable dan mutable, klik di sini.

Apakah Object itu?

Object adalah kumpulan atau list dari tipe data primitif (bisa juga tipe data reference, seperti array). Tiap item dari list tersebut disebut property, sedangkan fungsi disebut method.

Contoh obyek sederhana:

var myFirstObject = {
  firstName : “Richard”,
  favoriteAuthor : “Conrad”
}

Dari contoh tersebut, firstName dan favoriteAuthor disebut dengan property, dan nilainya adalah “Richard” dan “Conrad”.

Property dari obyek dapat berupa string atau number, tapi jika properti tersebut berupa number, maka properti tersebut dapat diakses dengan kurung siku. Berikut adalah contohnya.

var ageGroup = {
  30: "Children", 
  100:"Very Old"
}
console.log(ageGroup.30) // Error

console.log(ageGroup["30"]); // “Children”

Sebagai JavaScript Developer, kamu akan sering menggunakan tipe data Object, khususnya pada saat storing data dan untuk membuat method atau function.

Reference Data Type dan Primitive Data Type

Perbedaan utama antara tipe data reference dan primitf adalah metode penyimpanan datanya. Tipe data reference tidak menyimpan datanya secara langsung pada variabel, tetapi disimpan sebagai reference. Tipe data reference akan menyimpan alamat dari variabel yang menampung nilai tersebut.

// Tipe data primitif string menyimpan data
var person = "Kobe";  
var anotherPerson = person; // anotherPerson = nilai dari variabel person
person = "Bryant"; // nilai dari variabel person berubah

console.log(anotherPerson); // ”Kobe”
console.log(person); // “Bryant”

Bandingkan dengan cara penyimpanan data pada tipe data reference.

var person = {name: "Kobe"};
var anotherPerson = person;
person.name = "Bryant";

console.log(anotherPerson.name); // “Bryant”
console.log(person.name); // “Bryant”

Pada contoh tersebut, variabel anotherPerson diisi dinisialisasi dengan variabel person. Karena nilai pada variabel person disimpan berupa referense dan bukan nilai aktualnya, maka ketika property person,name diubah menjadi “Bryant”, anotherPerson juga ikut berubah. Hal tersebut karena variabel anotherPerson tidak berisi nilai aktual, melainkan reference atau alamat dari person. Lain lagi jika variabel anotherPerson diinisialisasi dengan property person.name.

Creating Objects

Terdapat dua cara umum untuk membuat obyek.

1. Object Literals
   Cara paling umum dan, tentu saja, cara paling mudah untuk membuat obyek adalah dengan mendefinisikan nama property dan method secara langsung.

   // Obyek kosong
   var myBooks = {}
   
   // Obyek dengan 4 item
     var banana = {
       color: "yellow",
       shape: "round",
       sweetness: 8,
   
     howSweetAmI: function () {
       console.log("Hmm Hmm Keren");
     }
   }

2. Object Constructor
   Cara umum lainnya untuk membuat obyek adalah dengan metode ini. Constructor adalah fungsi yang digunakan untuk menginisialisasi obyek baru (new objects), dan kamu bisa menggunakan keyword “new” untuk memanggil constructor. Cara ini cukup familiar dengan bahasa pemrograman berbasis OOP lainnya.

   var mango =  new Object ();
   
   mango.color = "yellow";
   mango.shape= "round";
   mango.sweetness = 8;
   
   mango.howSweetAmI = function () {
     console.log("Hmm Hmm Keren");
   }
   

Obyek dapat berisi tipe data lainnya, termasuk Numbers, Arrays, dan bahkan Objects.

Pada bagian 2, kita akan membahas mengenai pattern atau pola pada tipe data Object, diantaranya constructor pattern dan prototype pattern. Selain itu akan dibahas pula mengenai metode inherited pada obyek.

Salam.