JavaScript OOP (Prototipe) #2

Hai teman-teman, saya Bennison, Di blog ini, saya akan menjelaskan cara kerja OOP di Javascript, dan menjelaskan perbedaannya dengan OOP klasik. Sebelum membaca artikel ini, silahkan baca blog saya sebelumnya yang membahas tentang dasar-dasar OOP .

Apa itu Prototipe?

• Dalam Javascript kami memiliki sesuatu yang disebut prototipe, Dalam JavaScript, setiap objek akan ditautkan ke prototipe tertentu. Jadi setiap objek memiliki prototipe. prototipe juga berisi properti dan metode.
• Di sini yang penting adalah metode dan properti prototipe dapat diakses oleh objek.

• Dalam OOP Klasik sebuah objek dibuat dari kelas, yang disebut instantiasi. Di sini kelas hanyalah cetak biru untuk membuat Objek.
• Tapi Dalam Javascript, terminologi ini hanya berbeda. Di sini setiap objek dihubungkan dengan objek lain , dan objek tersebut disebut prototipe .

• Pewarisan prototipe berarti prototipe yang berisi metode, dan prototipe yang dapat diakses oleh semua objek yang terkait dengan prototipe tersebut.
• Jadi objek mewarisi metode dan properti dari prototipe, inilah yang disebut pewarisan prototipe. pewarisan ini berbeda dengan pewarisan kelas yang merupakan pewarisan satu kelas dari kelas lainnya. Namun dalam kasus ini, instance mewarisi dari kelas dasar.
• Pada gambar di atas, pada panah OOP javascript mengarah ke atas, ini berarti objek mendelegasikan perilakunya ke prototipe.
• Dalam OOP klasik, metode disalin dari kelas ke instance (objek).

const numbers = [1, 2, 3, 4,5];
numbers.map((num) => num * 2)

• Jika kita menelusuri google untuk memahami metode peta javascript, dalam dokumen MDN kita dapat melihatnya seperti Array.prototype.map()

• Di sini " Array.prototype()" adalah prototipe untuk semua objek array yang kita buat di JavaScript. Oleh karena itu semua array memiliki akses ke metode peta.
• Sekarang, objek prototipe ini berisi semua metode larik termasuk peta.

• Jadi, Dalam contoh di atas, " Array.Prototype" adalah prototipe dari array angka, variabel array angka itu terkait dengan prototipe. Oleh karena itu ia memiliki akses ke semua metode yang didefinisikan pada objek “ array.prototype ”. Jadi dalam contoh di atas array "angka" mewarisi peta metode.
• Dalam Javascript, kita dapat mengimplementasikan pewarisan prototipe dalam tiga arah, yang pertama adalah fungsi konstruktor, yang kedua adalah kelas ES6, dan yang terakhir adalah metode Object.Create() .

• Fungsi konstruktor digunakan untuk membuat objek dari fungsi. ini adalah bagaimana objek bawaan seperti metode Array dan map diimplementasikan.

• Ini adalah alternatif modern untuk fungsi konstruktor. Kelas ES6 bekerja sama dengan fungsi konstruktor. Kelas ES6 tidak berperilaku seperti OOP Klasik. Di belakang layar, kelas ES6 diimplementasikan dengan fungsi Konstruktor.

class User {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }
  getFullName() {
    console.log(this.firstName + ' ' + this.lastName);
  }
}

const user = new User('Bennison', 'J');

console.log(user); // { firstName: 'Bennison', lastName: 'J' }

console.log(user.hasOwnProperty('firstName')); // true
console.log(user.hasOwnProperty('getFullName')); // false

• Dan contoh di atas kita dapat melihat metode 'hasOwnProperty', yang membantu kita untuk memeriksa properti, dan metode tersebut adalah milik sendiri dari objek yang disebut metode hasOwnProperty.

• Metode "object.create()" adalah cara termudah untuk menautkan objek ke objek prototipe.

const objOne = {
  firstName: 'Bennison',
  lastName: 'J',
  getFullName: function () {
    console.log(this.firstName + ' ' + this.lastName);
  }
};

const objTwo = Object.create(objOne);

console.log(objTwo); // {}
objTwo.getFullName(); //  Bennison J

• Metode "Object.create" mengembalikan objek kosong dengan prototipe. dan prototipe akan menjadi apa yang kami berikan ke metode itu.

• Saya harap, Di Blog ini, kita telah mempelajari dasar-dasar pewarisan prototipe dalam Javascript, jika Anda tidak dapat memahami contoh di atas, jangan khawatir saya akan menjelaskan lebih lanjut tentang konsep ini di blog saya yang akan datang. Terima kasih telah membaca blog ini, Sampai jumpa lagi.