日期:2014-05-16  浏览次数:20381 次

javascript面向对象二-“继承”

让我们接着上篇博客“javascript-面向对象,你了解多少”继续javascript的面向对象特征。这次说“继承”。

当开始听到javascript的继承时有点疑惑,因为在javascript中没有“类”的概念,怎么会继承呢?在javascript中有什么呢?有对象,有函数,通常在一个对象中定义变量,属性,还定义函数(内置)。这种结构像极了类。继承其实就是复用一些东西,在javascript中,我们可以把这种函数看成是一个类,然后进行继承。

“继承”在javascript中可以实现继承的方法有两种形式。

一、原型继承法

每一个类(函数)都有一个原型,该原型上的成员在该类实例化时,会传给该类的实例化对象。实例化的对象上没有原型,但是它可以作为另一个类(函数)的原型,当以该对象为原型的类实例化时,该对象上的成员就会传给以它为原型的类的实例化对象上。这就是原型继承的本质。


function parentClass() {
 
    // private field
 
    var x = "I'm a parentClass field!";
 
    // private method
 
    function method1() {
 
        alert(x);
 
        alert("I'm a parentClass method!");
 
    }
 
    // public field
 
    this.x = "I'm a parentClass object field!";
 
    // public method
 
    this.method1 = function() {
 
        alert(x);
 
        alert(this.x);
 
        method1();
 
    }
 
}
 
parentClass.prototype.method = function () {
 
    alert("I'm a parentClass prototype method!");
 
}
 
parentClass.staticMethod = function () {
 
    alert("I'm a parentClass static method!");
 
} 
 
function subClass() {
 
    // private field
 
    var x = "I'm a subClass field!";
 
    // private method
 
    function method2() {
 
        alert(x);
 
        alert("I'm a subClass method!");
 
    }
 
    // public field
 
    this.x = "I'm a subClass object field!";
 
    // public method
 
    this.method2 = function() {
 
        alert(x);
 
        alert(this.x);
 
        method2();
 
    }
 
    this.method3 = function() {
 
        method1();
 
    }
 
} 
 
// inherit
subClass.prototype = new parentClass();// new 新对象,赋值给子类.
// 等同于var p=parentClass();subClass.prototype=p;首先创建一个父类的实例化对象然后将该对象赋给子类的 prototype 属性. 
subClass.prototype.constructor = subClass; // 将子类本身赋值给它的 prototype 的 constructor 属性。注意:这里赋值是没有 () 。
 
// test
var o = new subClass();// 实例化子类
alert(o instanceof parentClass);    // true
alert(o instanceof subClass);       // true
// 通过继承,父类中的所有公有实例成员都会被子类继承。子类的实例化对象既属于子类,也属于父类。 
 
alert(o.constructor);  // function subClass() {...} // 通过原型赋值,查看子类的实例化对象的 constructor