JavaScript學習——對象的創建和繼承

對象的創建

使用Object()構造函數或者對面字向量來創建對象

JavaScript中有多種對象創建模式，其中最簡單的就是使用Object()構造函數或者對象字面量來創建對象。

        var LY1 = {
            name: "LY",
            age: 21,
            sayname: function() {
                alert(this.name);
            }
        };
        LY1.sayname();//使用對象字面量創建對象
        var LY2 = new Object();
        LY2.name = "LY";
        LY2.age = 21;
        LY2.sayname = function() {
            alert(this.name);
        }
        LY2.sayname();//使用Object()構造函創建對象

構造函數模式和原型模式

這兩種方法在創建類似的對象時會產生大量相似的代碼。更好的方法是使用構造函數模式和原型模式。

        function LY1(name, age) {
            this.name = name;
            this.age = age;
            this.sayname = function() {
                alert(this.name);
            };
        }
        var ly1 = new LY1("LY1", 21);
        var ly11 = new LY1("LY11", 21); //使用構造函數的方法創建對象
        function LY2() {}
        LY.prototype.name = "LY2";
        LY.prototype.age = 21;
        LY.prototype.sayname = function() {
            alert(this.name);
        }
        var ly2 = new LY2();
        var ly22 = new LY2(); //使用原型模式構造對象

在ECMAScript中，每一個函數都是一個對象，都相當於Function類型的一個實例

因此，在使用構造函數LY1構造對象ly1和ly11時，sayname方法在每個實例中都構建了一遍，這導致了不同的作用域鏈

解決這個問題的方法是使用原型模式

每一個函數都有一個prototype屬性，它指向一個對象。這個對象包含特定類型所有實例共享的屬性和方法。

但如果將所有屬性和方法都由原型模式指定，則會導致所有實例沒有自己獨立的屬性或者方法

組合使用構造函數模式和原型模式

        function LY(name, age) {
            this.name = name;
            this.age = age;
        }
        LY.prototype = {
            constructor: LY,
            sayName: function() {
                alert(this.name);
            }
        };
        var ly1 = new LY();
        var ly2=  new LY();

這樣創建的兩個對象就既有共享屬性又有自己獨立的屬性

動態原型模式

動態原型模式和傳統的OO語言中的構造函數最相似

function LY(name, age) {
    this.name = name;
    this.age = age;
    if (typeof this.sayName != "function") {
        LY.prototype.sayName = function() {
            alert(this.name);
        };
    }
}

繼承

原型鏈

原型鏈是實現繼承的主要方法。其實質是通過將被繼承的類型的實例賦值給一個原型對象

function Child() {
    this.name = "LY";
}

function Parent() {
    this.age = 21;
}
Parent.prototype.getAge = function() {
    alert(age);
}
Child.prototype = new Parent();
Child.prototype.getName = function() {
    alert(this.name);
};
var child = new Child();

將Parent類型的實例賦值給Child類型的原型，賦值之後Child類型的實例child繼承了Parent()的屬性,接着又向Child類型的原型添加了getName()方法

這樣的方式雖然可以實現繼承，但是，將Parent()的實例賦給Child的原型後，實例屬性就變爲原型屬性了，這樣，實例中的屬性就會被所有Child()實例共享

借用構造函數

可以使用借用構造函數解決這個問題

借用構造函數是在子類型構造函數中調用超類型構造函數

function Parent() {
    this.age = 21;
}

function Child() {
    Parent.call(this);
}
Child.prototype = new Parent();
var child1 = new Child();
var child2 = new Child();

這樣在創建child1和child2是就會分別創建Parent()的實例，在修改child1時就不會對child2產生影響

組合繼承

組合繼承就是將原型鏈和借用構造函數組合一起，使用原型鏈實現對原型屬性和方法的繼承，使用構造函數實現對實例屬性的繼承

function Parent() {
    this.age = 21;
}

function Child() {
    this.name = "LY";
    Parent.call(this);
}
Child.prototype = new Parent();
var child1 = new Child();
var child2 = new Child();

在上面的代碼中，借用call()函數使得Child()函數獲得Parent()函數中的屬性。使用原型鏈獲得Parent原型中的方法
組合繼承是JavaScript中使用較多的繼承方式