2 minutes
I Saw Many “Prototype” Words on Mozilla. What Is That Actually?
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
Kalau kamu suka tulisan saya, boleh kok traktir saya kopi. Tinggal klik di sini.