首页 > 代码库 > Javascript的继承

Javascript的继承

引用infoQ的一片文章《JavaScript的实例化与继承:请停止使用new关键字》一段话:

"

传统的实例化与继承

假设我们有两个类,Class:function Class() {}SubClass:function SubClass(){},SubClass需要继承自Class。传统方法一般是按如下步骤来组织和实现的:

  • Class中被继承的属性和方法必须放在Class的prototype属性中

  • SubClass中自己的方法和属性也必须放在自己prototype属性中
  • SubClass的prototype对象的prototype(__proto__)属性必须指向的Class的prototype

"

Class中被继承的属性和方法必须放在Class的prototype属性中

// 声明一个class
function Class() {}

// 给class的prototype添加一个类方法method1
Class.prototype.method1 = function() {
  console.log(‘class method1 called!‘);
}

// 创建实例
var instance = new Class();
// 调用类方法
instance.method1();

上面的Class既声明为一个类, 并且给Class添加两个类方法,类方法也是一个Function,但不能通过Class.prototype.method的方式直接调用,但是可以通过Class.prototype.method.call的方式调用或者实例调用。

 

SubClass中自己的方法和属性也必须放在自己prototype属性中

SubClass 也是一样通过prototype来添加自己的类方法

 

SubClass的prototype对象的prototype(__proto__)属性必须指向的Class的prototype

 

function Class() {}

Class.prototype.print = function(s) {
  console.log(‘class print>‘ + s);
}

function SubClass() {
Class.call(this);
}
// 通过Object.create来实现继承 SubClass.prototype = Object.create(Class.prototype) SubClass.prototype.add = function(a, b) { return (a+b); }

// SubClass添加类成员变量
SubClass.prototype.name = ‘abc‘;
// 创建subclass实例 var b = new SubClass();
// 调用subclass类方法 var r = b.add(1, 20);
// 调用父类Class的方法 b.print(r);

 

 

理解prototype链对实现继承很关键:

当实例b调用print方法时,先查找实例b(Object)有没有这样的function成员, 如果有则调用,没有则在SubClass的prototype(Object) 中查找,如果没有则在prototype.prototype(Object)中查找,顺着prototype链一直到找到为止,找不到就会报错。

 

上面的示例代码是实现继承的基本原理。