JavaScript 中的"類"與"執行個體"，javascript執行個體

JavaScript 中的"類"與"執行個體"，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> 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 的概念和用法.