Jadi kan kalau saya baca dokumentasi Mozilla, saya teh sering nemuin kata prototype. Seringnya kalau saya lagi baca dokumentasi method.

Contohnya:

// mengembalikan nilai string yang merepresentasikan suatu objek
Object.prototype.toString();

// mengembalikan nilai primitif dari suatu object
Object.prototype.valueOf();

// mengetahui apakah suatu objek punya property tertentu
Object.prototype.hasOwnProperty();

Nah, itu prototype teh apa sih? Yaudah saya riset.

Apa?

Javascript adalah tentang objek, tidak mengenal konsep class. Nah, pas mau ngelakuin inheritance alias pewarisan, javascript melakukan itu dengan melakukan hubungan antar objek menggunakan suatu property yang dimiliki oleh semua objek. Property itu bernama prototype.

__proto__

Simple-nya, ini teh untuk mewarisi segala properti dan method dari satu objek ke objek lain. Tapi, ini tidak direkomendasikan untuk dipakai, malah sebaiknya jangan dipake karena bisa mempengaruhi performa. Tapi, ya namanya juga belajar ya. Saya pake aja sekarang mah. haha

let hulk = {
  radiasi: "gamma",
  superStrength: true
};

let sheHulk = {};

sheHulk.__proto__ = hulk;

console.log(sheHulk.radiasi); // gamma
console.log(sheHulk.superStrength); // true

let redHulk = {
  __proto__: hulk,
  color : "red"
}

console.log(redHulk.radiasi); // gamma
console.log(redHulk.superStrength); // true
console.log(redHulk.color); // red

Object.create

Karena __proto__ sebaiknya tidak dipakai, di ES5, javascript membuat method Object.create() untuk membuat objek baru yang memakai objek lama sebagai prototype-nya.

let hulk = {
  radiasi: "gamma",
  superStrength: true
};

let sheHulk = Object.create(hulk);

console.log(sheHulk.radiasi); // gamma
console.log(sheHulk.superStrength); // true

let redHulk = Object.create(
  hulk,
  {color: 
    {value: "red"}
  }
);

console.log(redHulk.radiasi); // gamma
console.log(redHulk.superStrength); // true
console.log(redHulk.color); // red

.prototype

Jadi, ada yang namanya object constructor function. Itu adalah sebuah fungsi yang dijadikan constructor untuk objek yang akan dibuat nantinya. object constructor ini gak bisa ditambahin properti. Kalau mau nambahin properti, bisa dimasukin ke properti prototype karena semua objek dalam javascript itu ada properti prototype.

function Hulk() {
  this.radiasi = "gamma";
  this.superStrength = true;
}

// instansiasi objek redHulk
let redHulk = new Hulk();

console.log(redHulk.radiasi); // gamma
console.log(redHulk.superStrength); // true
console.log(redHulk.color); // undefined

// menambahkan properti color
Hulk.prototype.color = "red";

console.log(redHulk.radiasi); // gamma
console.log(redHulk.superStrength); // true
console.log(redHulk.color); // red

Harusnya gue ngebahas Object dulu ya. Ah, di pos berikutnya deh.


Further reading