js 創建類和繼承的幾種方法

在面向對象編程中，類（class）是對象（object）的模板，定義了同一組對象（又稱"實例"）共有的屬性和方法。JavaScript語言里是沒有類的概念的，但是我們通過以下方法也可以模擬出類。

一.創建類：

1. 利用function關鍵字:

　　

function Animal(name,age){
    this.name=name;
    this.age = age;
    this.getName = function(){
        return this.name;
    }
    this.setName = function(name){
        this.name = name
    }
}

var ani = new Animal('大毛',1);

原型方法：

function Animal(name,age){
    this.name=name;
    this.age = age;
}

Animal.prototype={
   getName: function(){
        return this.name;
    }
   setName: function(name){
        this.name = name
    }  
}

 

2.利用Object.create()方法構造：

為了解決"構造函數法"的缺點，更方便地生成對象，Javascript的國際標准ECMAScript第五版（目前通行的是第三版），提出了一個新的方法Object.create()。

 

var Animal ={
    name: '大毛',
    getName: function(){
        return this.name;
    }
}

var ani = Object.create(Animal);
ani.getName();//大毛

對於IE9以下瀏覽器不支持這種寫法，我們可以做以下兼容：

function classFactory(o){
    var fn = function(){}
    fn.prototype = o;
    return new fn();
}

二.繼承：

1.利用prototype關鍵字

function extend(Sub,Sup) {
    //Sub表示子類，Sup表示超類
    // 首先定義一個空函數
    var F = function(){};
 
    // 設置空函數的原型為超類的原型
    F.prototype = Sup.prototype; 
 
// 實例化空函數，並把超類原型引用傳遞給子類
    Sub.prototype = new F();
 
    // 重置子類原型的構造器為子類自身
    Sub.prototype.constructor = Sub;
 
    // 在子類中保存超類的原型,避免子類與超類耦合
    Sub.sup = Sup.prototype;
 
    if(Sup.prototype.constructor === Object.prototype.constructor) {
        // 檢測超類原型的構造器是否為原型自身
        Sup.prototype.constructor = Sup;
    }
 
}

2.call和apply