Contoh Penjelasan Menerapkan Fitur Enkapsulasi Objek dalam Pemrograman JavaScript

1. Objek Prototipe

1.1 Kontra Konstruktor

JavaScript menghasilkan objek baru melalui konstruktor, sehingga konstruktor dapat dianggap sebagai templat untuk objek. Properti dan metode objek instan dapat didefinisikan di dalam konstruktor.

 function cat (name, color) {this.name = name; this.color = color;} var cat1 = kucing baru ('rambut besar', 'putih'); cat1.name // 'Big hair'cat1.color //' putih '

Fungsi kucing dalam kode di atas adalah konstruktor. Atribut nama dan atribut warna didefinisikan secara internal. Semua objek instan akan menghasilkan dua atribut ini. Namun, melakukan hal itu adalah pemborosan sumber daya sistem, karena properti tidak dapat dibagi antara contoh objek dari konstruktor yang sama.

 function cat (name, color) {this.name = name; this.color = warna; this.meow = function () {console.log ('mew, mew, mew ...'); };} var cat1 = kucing baru ('rambut besar', 'putih'); var cat2 = kucing baru ('ei mao', 'hitam'); cat1.meow === cat2.meow // false

Dalam kode di atas, CAT1 dan CAT2 adalah contoh konstruktor yang sama. Namun, metode meow mereka berbeda, yaitu, setiap kali contoh baru dibuat, metode Meow baru akan dibuat. Ini tidak diperlukan atau membuang -buang sumber daya sistem, karena semua metode meow adalah perilaku yang sama dan harus dibagikan sepenuhnya.

1.2 Peran atribut prototipe

Dalam bahasa JavaScript, setiap objek memiliki objek prototipe yang sesuai, yang disebut objek prototipe. Semua properti dan metode yang didefinisikan pada objek prototipe dapat diwarisi oleh objek yang diturunkan. Ini adalah desain dasar dari mekanisme warisan JavaScript.

Selain pendekatan ini, JavaScript juga menyediakan cara lain untuk mendefinisikan objek instance. Kita tahu bahwa konstruktor adalah fungsi, objek, dan juga memiliki sifat dan metode sendiri. Satu atribut prototipe menunjuk ke objek lain, yang umumnya disebut objek prototipe. Objek ini sangat istimewa. Selama properti dan metode yang ditentukan dapat dibagikan oleh semua objek instan. Artinya, ketika konstruktor menghasilkan objek instan, atribut prototipe secara otomatis ditetapkan ke objek instan.

 fungsi hewan (nama) {this.name = name;} animal.prototype.color = "white"; var cat1 = hewan baru ('rambut besar'); var cat2 = hewan baru ('erimao'); cat1.color // 'white'cat2.color //' putih ');

Kode di atas menambahkan atribut warna ke objek prototipe hewan konstruktor. Akibatnya, kedua objek instance CAT1 dan CAT2 membawa properti ini.

Lebih khusus lagi, selama objek prototipe dimodifikasi, perubahan akan segera tercermin dalam objek instan.

 Animal.prototype.color = "yellow"; cat1.color // 'yellow'cat2.color //' yellow '

Kode di atas mengubah nilai atribut warna dari objek prototipe menjadi kuning, dan nilai atribut warna dari dua objek instance akan segera berubah. Ini karena objek instan sebenarnya tidak memiliki atribut warna, dan mereka semua membaca atribut warna dari objek prototipe. Dengan kata lain, ketika objek instan itu sendiri tidak memiliki properti atau metode tertentu, itu akan masuk ke objek prototipe konstruktor untuk menemukan properti atau metode. Ini adalah hal khusus tentang objek prototipe.

Jika objek instan itu sendiri memiliki properti atau metode tertentu, ia tidak akan lagi mencari properti atau metode ini dalam objek prototipe.

 cat1.color = 'hitam'; cat2.color // 'yellow'animal.prototype.color // "yellow";

Kode di atas mengubah properti warna dari objek instan CAT1 menjadi hitam, sehingga tidak perlu lagi membaca properti warna dari objek prototipe, dan nilai yang terakhir masih kuning.

Singkatnya, fungsi objek prototipe adalah untuk menentukan sifat dan metode yang dibagikan oleh semua objek instan, sehingga juga disebut prototipe objek instan, dan objek instan dapat dianggap berasal dari objek prototipe.

 Animal.prototype.walk = function () {console.log (this.name + 'berjalan.');};

Kode di atas mendefinisikan metode WALK pada objek Hewan.Protype, yang akan dipanggil pada semua objek instance hewan.

1.3 Rantai Prototipe

Karena semua objek dalam JavaScript memiliki konstruktor, dan semua konstruktor memiliki atribut prototipe (sebenarnya semua fungsi memiliki atribut prototipe), semua objek memiliki objek prototipe prototipe sendiri.

Oleh karena itu, properti dan metode suatu objek dapat didefinisikan pada dirinya sendiri atau pada objek prototipe (seperti metode Walk dalam kode di atas). Karena prototipe itu sendiri adalah objek dan memiliki prototipe sendiri, rantai prototipe terbentuk. Misalnya, objek A adalah prototipe objek B, objek B adalah prototipe objek C, dan sebagainya. Karena melacak akar sumber, objek pada sumber dihasilkan dari konstruktor objek (menggunakan perintah objek baru ()), jadi jika Anda melacaknya ke atas lapisan demi lapisan, prototipe semua objek pada akhirnya dapat ditelusuri ke objek.prototype. Jadi, apakah ada prototipe untuk objek.prototype? Jawabannya bisa ya atau tidak, karena prototipe objek.prototype adalah nol tanpa sifat dan metode apa pun.

 Object.getPrototypeOf (object.prototype) // null

Kode di atas menunjukkan bahwa prototipe objek.Prototype objek adalah nol. Karena NULL tidak memiliki sifat, rantai prototipe berakhir di sini.

Fungsi "rantai prototipe" adalah bahwa ketika membaca atribut tertentu dari suatu objek, mesin JavaScript terlebih dahulu mencari atribut objek itu sendiri. Jika tidak dapat ditemukan, ia akan mencari prototipe. Jika masih tidak dapat ditemukan, itu akan mencari prototipe prototipe. Dan seterusnya, jika objek.prototype di level atas masih belum ditemukan, ia kembali tidak ditentukan.

Misalnya, jika atribut prototipe fungsi menunjuk ke array, itu berarti bahwa fungsi dapat digunakan sebagai konstruktor array, karena objek instan yang dihasilkannya dapat memanggil metode array melalui atribut prototipe.

 Fungsi myArray () {} myarray.prototype = array baru (); myarray.prototype.constructor = myArray; var mine = myArray baru (); Mine.push (1, 2, 3); Mine.length // 3mine instance dari array // true (true (1, 2, 3); Mine.length // 3mine instance dari array // true (true (1, 2, 3); Mine.length // 3mine instance dari array // true (benar

Tambang dalam kode di atas adalah objek instance dari MyArray. Karena properti prototipe dari MyArray menunjuk ke array, tambang dapat memanggil metode array (metode ini sebenarnya didefinisikan pada objek prototipe array). Adapun baris terakhir dari ekspresi instance dari, kita tahu bahwa instance dari operator digunakan untuk membandingkan apakah suatu objek adalah instance dari konstruktor, dan baris terakhir menunjukkan bahwa tambang adalah instance dari array.

 Tambang contoh array // setara dengan (array === myarray.prototype.constructor) || (array === array.prototype.constructor) || (array === objek.prototype.constructor)

Kode di atas menggambarkan esensi dari instance dari operator, yang dibandingkan dengan atribut konstruktor dari semua objek prototipe dari objek instan (untuk pengenalan atribut ini, silakan lihat bagian selanjutnya). Selama ada satu, itu akan mengembalikan true, jika tidak, ia akan mengembalikan false.

1.4 Atribut Konstruktor

Objek prototipe memiliki atribut konstruktor yang menunjuk ke fungsi konstruktor di mana objek prototipe terletak secara default.

 fungsi p () {} p.prototype.constructor === p // true

Karena atribut konstruktor didefinisikan pada objek prototipe, itu berarti dapat diwarisi oleh semua objek instan.

 fungsi p () {} var p = new p (); p.constructor // function p () {} p.constructor === p.prototype.constructor // truep.hasownproperty ('constructor') // false

Kode di atas menunjukkan bahwa P adalah objek instance dari konstruktor P, tetapi P sendiri tidak memiliki atribut konstruktor, yang sebenarnya membaca atribut P.Prototype.constructor pada rantai prototipe.

Fungsi atribut konstruktor adalah untuk membedakan konstruktor mana objek prototipe didefinisikan pada.

 fungsi f () {}; var f = baru f (); f.constructor === f // truef.constructor === regexp // false

Kode di atas berarti bahwa menggunakan properti konstruktor, ditentukan bahwa fungsi konstruktor dari variabel f ​​adalah f, bukan regexp.

2.Object.getPrototipe Metode

Metode Object.getPrototypeof mengembalikan prototipe suatu objek.

 // Prototipe objek kosong adalah object.prototypeObject.getPrototypeOf ({}) === objek.prototype // true // Prototipe fungsi adalah function.prototypunction f () {} objek.getProtype adalah fo function. f is f.prototypevar f = new f (); object.getPrototypeOf (f) === f.prototype // true

3.Object.Create Metode

Metode Object.Create digunakan untuk menghasilkan objek baru dan dapat menggantikan perintah baru. Ia menerima objek sebagai argumen dan mengembalikan objek baru, yang sepenuhnya mewarisi sifat -sifat yang pertama, yaitu, yang pertama menjadi prototipe yang terakhir.

 var o1 = {p: 1}; var o2 = objek.create (o1); o2.p // 1

Dalam kode di atas, metode Object.Create menghasilkan O2 berdasarkan O1. Pada saat ini, O1 menjadi prototipe O2, yaitu O2 mewarisi semua sifat O1.

Metode Object.Create pada dasarnya setara dengan kode berikut. Jika browser lama tidak mendukung metode Object.Create, Anda dapat menggunakan kode berikut untuk menggunakannya sendiri.

 if (typeof object.create! == "function") {object.create = function (o) {function f () {} f.prototype = o; mengembalikan f baru (); };}

Kode di atas menunjukkan bahwa metode Object.Create pada dasarnya membuat konstruktor baru, kemudian memungkinkan atribut prototipe F untuk menunjuk ke objek O sebagai prototipe, dan akhirnya mengembalikan instance f, sehingga instance dapat mewarisi atribut O.

Objek baru yang dihasilkan dalam tiga cara berikut setara.

 var o1 = object.create ({}); var o2 = object.create (object.prototype); var o3 = objek baru ();

Jika Anda ingin menghasilkan objek yang tidak mewarisi properti apa pun (seperti ToString dan nilai metode), Anda dapat mengatur objek. Membuat parameter ke nol.

 var o = objek.create (null); o.valueof () // typeError: objek [objek objek] tidak memiliki metode 'nilai'

Kode di atas menunjukkan bahwa jika prototipe objek O adalah nol, tidak memiliki beberapa properti yang didefinisikan pada objek.Prototype objek, seperti metode nilai.

Saat menggunakan metode Object.Create, prototipe objek harus disediakan, jika tidak kesalahan akan dilaporkan.

 Object.create () // TypeError: Prototipe Objek mungkin hanya objek atau nol

Objek baru yang dihasilkan oleh objek. Metode Buat secara dinamis mewarisi prototipe. Menambahkan atau memodifikasi metode apa pun pada prototipe akan segera mencerminkan objek baru.

 var o1 = {p: 1}; var o2 = objek.create (o1); o1.p = 2; o2.p // 2

Kode di atas menunjukkan bahwa memodifikasi prototipe objek akan mempengaruhi objek yang baru dihasilkan.

Selain prototipe objek, metode Object.Create juga dapat menerima parameter kedua, mewakili objek atribut yang menggambarkan atribut, yang merupakan format yang sama dengan metode objek.defineproPerties yang digunakan. Properti objek yang dijelaskan akan ditambahkan ke objek baru.

 var o = object.create (object.prototype, {p1: {value: 123, enumerable: true}, p2: {value: "abc", enumerable: true}}); o.p1 // 123o.p2 // "abc"

Karena metode Object.Create tidak menggunakan konstruktor, instance dari operator tidak dapat digunakan untuk menentukan instance konstruktor mana objek tersebut. Pada saat ini, Anda dapat menggunakan metode IsprototypeOf berikut untuk menafsirkan objek mana prototipe.

4.Sprototipe metode

Metode Isprototype dari digunakan untuk menentukan apakah suatu objek adalah prototipe objek lain.

 var o1 = {}; var o2 = object.create (o1); var o3 = objek.create (o2); o2.isprototypeof (o3) // trueo1.isprototypeof (o3) // true

Kode di atas menunjukkan bahwa IsprotypeOf mengembalikan true selama objek ada pada rantai prototipe.

5. Contoh sederhana

 var classDemo = function () {// variabel privat statis var private_static_var = 'aaaa'; // Metode privat statis var private_static_func = function (key) {return key + private_static_var; } // Metode privat, kuncinya adalah lulus var private_func = function ini (self, key) {return private_static_func (key + self.id); } var _class = function (id) {// constructor this.id = id; // variabel publik} // public method_class.prototype.public_func = function (key) {return private_func (this, key); } return _class;} (); var a = classDemo baru ('Hello World'); alert (a.public_func ('World Hello'));

Tidak ada cara sederhana untuk mengimplementasikan variabel pribadi dan variabel/metode statis publik, tetapi enkapsulasi sudah cukup untuk dilakukan sejauh ini.