Kaedah pelaksanaan kelas dan contoh dalam JavaScript

Artikel ini terutamanya memperkenalkan kaedah pelaksanaan kelas dan kejadian dalam JavaScript. Ia sangat bijak mensimulasikan proses pelaksanaan kelas dan kejadian itu mempunyai nilai rujukan tertentu yang boleh merujuk kepadanya 🎜>

Tiada konsep kelas induk, subkelas atau kelas dan contoh dalam JavaScript Ia bergantung sepenuhnya pada rantaian prototaip untuk merealisasikan warisan Apabila mencari sifat objek, JavaScript akan merentasi rantaian prototaip ke atas sifat yang sepadan ditemui . Terdapat beberapa cara untuk membuat JavaScript mensimulasikan konsep kelas dan contoh.

1 kepada contoh objek.

function Animal() {  
 this.name = "animal";  
 }  
 Animal.prototype.makeSound = function() {  
 console.log("animal sound");  
 }  
[Function]  
 var animal1 = new Animal();  
 animal1.name;  
'animal'  
 animal1.makeSound();  
animal sound

Lihat contoh lain:

function Point(x, y) {  
 this.x = x;  
 this.y = y;  
 }  
 Point.prototype = {  
 method1: function() { console.log("method1"); },  
 method2: function() { console.log("method2"); },  
 }  
{ method1: [Function], method2: [Function] }  
 var point1 = new Point(10, 20);  
 point1.method1();  
method1  
 point1.method2();  
method2

Di atas, nyatakan atribut prototaip objek pembina, kemudian buat tika baharu bagi objek, dan kemudian panggil prototaip yang dinyatakan dalam kaedah.

2 Gunakan kaedah Object.create() untuk mencipta objek

var Animal = {  
 name: "animal",  
 makeSound: function() { console.log("animal sound"); },  
 }  
 var animal2 = Object.create(Animal);  
 animal2.name;  
'animal'  
 console.log(animal2.name);  
animal  
 animal2.makeSound();  
animal sound

Ini. kaedah adalah lebih mudah daripada kaedah pembina, Walau bagaimanapun, sifat persendirian dan kaedah persendirian tidak boleh dilaksanakan, dan data tidak boleh dikongsi antara objek contoh, dan simulasi kelas masih tidak cukup komprehensif.

3. Minimalist yang dicadangkan oleh pengaturcara Belanda Gabor de Mooij Pendekatan Minimalist

var Animal = {  
 init: function() {  
 var animal = {};  
 animal.name = "animal";  
 animal.makeSound = function() { console.log("animal sound"); };  
 return animal;  
 }  
 };  
 var animal3 = Animal.init();  
 animal3.name;  
'animal'  
 animal3.makeSound();  
animal sound

Jangan gunakan prototaip dan ini, hanya perlu menyesuaikan init pembina juga sangat mudah.

var Cat = {  
 init: function() {  
 var cat = Animal.init();  
 cat.name2 = "cat";  
 cat.makeSound = function() { console.log("cat sound"); };  
 cat.sleep = function() { console.log("cat sleep"); };  
 return cat;  
 }  
 }  
 var cat = Cat.init();  
 cat.name; // 'animal'  
 cat.name2; // 'cat'  
 cat.makeSound(); // 类似于方法的重载  
cat sound  
 cat.sleep();  
cat sleep

Penggunaan sifat peribadi dan kaedah persendirian:

var Animal = {  
 init: function() {  
 var animal = {};  
 var sound = "private animal sound"; // 私有属性  
 animal.makeSound = function() { console.log(sound); };  
 return animal;  
 }  
 };  
 var animal4 = Animal.init();  
 Animal.sound; // undefined 私有属性只能通过对象自身的方法来读取.  
 animal.sound; // undefined 私有属性只能通过对象自身的方法来读取  
 animal4.makeSound();  
private animal sound

Selagi sifat dan kaedah tidak ditakrifkan pada objek haiwan, ia adalah peribadi dan tidak boleh diakses oleh dunia luar.

Antara kelas dan kejadian, anda boleh Mencapai perkongsian data

var Animal = {  
 sound: "common animal sound",  
 init: function() {  
 var animal = {};  
 animal.commonSound = function() { console.log(Animal.sound); };  
 animal.changeSound = function() { Animal.sound = "common animal sound changed"; };  
 return animal;  
 }  
 }  
 var animal5 = Animal.init();  
 var animal6 = Animal.init();  
 Animal.sound; // 可以视为类属性  
'common animal sound'  
 animal5.sound; // 实例对象不能访问类属性  
undefined  
 animal6.sound;  
undefined  
 animal5.commonSound();  
common animal sound  
 animal6.commonSound();  
common animal sound  
 animal5.changeSound(); // 修改类属性  
undefined  
 Animal.sound;  
'common animal sound'  
 animal5.commonSound();  
common animal sound  
 animal6.commonSound();  
common animal sound

Sebagai contoh, Animal.sound ialah atribut biasa antara kelas dan kejadian, yang boleh dianggap sebagai kelas. atribut dan kaedah kelas

Jika suatu kejadian mengubah suai atribut sepunya, Maka atribut sepunya kelas ini dan kejadian lain juga diubah suai dengan sewajarnya.

Ringkasnya, ini ialah konsep dan penggunaan kelas dan contoh yang disimulasikan dalam JavaScript. Saya harap artikel ini akan membantu pengaturcaraan javascript semua orang. Untuk lebih banyak tutorial berkaitan, sila lawati

Tutorial Video JavaScript!