本文實例講述了JavaScript中的類與實例實現方法。分享給大家供大家參考。具體如下：
JavaScript 中沒有父類, 子類的概念, 也沒有class 和 instance 的概念, 全靠 prototype chain來實現繼承. 當查找一個對象的屬性時, JavaScript 會向上遍歷 prototype chain, 直到找到對應的屬性為止. 有幾種方法, 可以使得 JavaScript 模擬出 class 和 instance 的概念.
1. 直接使用構造函數來創建對象, 在構造函數內部使用 this指代對象實例.
代碼如下: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
再看另外一個例子:
代碼如下: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
以上, 先指定好一個構造函數對象的 prototype 屬性. 然後 new 一個該對象實例, 即可調用 prototype 中指定的方法.
2. 使用 Object.create()方法來創建對象
代碼如下: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
該方法, 比構造函數的方法更簡便, 但不能實現私有屬性和私有方法, 且實例對象之間不能共享數據, 對 class 的模擬仍不夠全面.
3. 荷蘭程序員 Gabor de Mooij 提出的極簡主義法(minimalist approach). 推薦用法.
代碼如下: 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
不使用 prototype 和 this, 僅需要自定義一個構造函數init. 繼承的實現也很簡單.
代碼如下: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
私有屬性和私有方法的使用:
代碼如下: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
只要不是定義在animal對象上的屬性和方法都是私有的, 外界不能訪問.
類與實例之間, 可以做到數據共享.
代碼如下: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
如 Animal.sound 就是類與實例的共有屬性, 可以視為類屬性和類方法.
若一個實例修改了該共有屬性, 則該類和其他實例的共有屬性也對應修改了.
綜上, 就是 JavaScript 中模擬的 class 和 instance 的概念和用法.
希望本文所述對大家的javascript程序設計有所幫助。