构造函数的继承——使用原型对象(prototype)

栏目: JavaScript · 发布时间: 5年前

内容简介:构造函数是JavaScript中生成实例对象的模板,如何实现构造函数的继承,是JavaScript程序员需要掌握的一项十分重要的技能。 本文将介绍如何使用原型对象,实现构造函数的继承。让一个构造函数继承另一个构造函数,可以分成两步实现。另外一种写法是Son.prototype等于一个父类实例。

构造函数是JavaScript中生成实例对象的模板,如何实现构造函数的继承,是JavaScript程序员需要掌握的一项十分重要的技能。 本文将介绍如何使用原型对象,实现构造函数的继承。

理论讲解

让一个构造函数继承另一个构造函数,可以分成两步实现。

  • 第一步是在子类的构造函数中,调用父类的构造函数。
function Son(value) {
  Father.call(this);
  this.prop = value;
}
复制代码
  • 第二步,是让子类的原型指向父类的原型,这样子类就可以继承父类原型。
Son.prototype = Object.create(Father.prototype);
Son.prototype.constructor = Son;
Son.prototype.method = '...';
复制代码

另外一种写法是Son.prototype等于一个父类实例。

Son.prototype = new Father();
复制代码

实例参考

举例来说,下面是一个Shape构造函数。

function Shape() {
  this.x = 0;
  this.y = 0;
}

Shape.prototype.move = function (x, y) {
  this.x += x;
  this.y += y;
  console.info('Shape moved.');
};
复制代码

我们需要让Rectangle构造函数继承Shape。

// 第一步,子类继承父类的实例
function Rectangle() {
  Shape.call(this); // 调用父类构造函数
}

// 第二步,子类继承父类的原型
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle;
复制代码

采用这样的写法以后,instanceof运算符会对子类和父类的构造函数,都返回true。

var rect = new Rectangle();

rect instanceof Rectangle  // true
rect instanceof Shape  // true
复制代码

上面代码中,子类是整体继承父类。有时只需要单个方法的继承,这时可以采用下面的写法。

ClassB.prototype.print = function() {
  ClassA.prototype.print.call(this);
  // some code
}
复制代码

继承数组

如果让构造函数的prototype属性指向一个数组,就意味着实例对象可以调用数组方法。

var MyArray = function () {};

MyArray.prototype = new Array();
MyArray.prototype.constructor = MyArray;

var mine = new MyArray();
mine.push(1, 2, 3);
mine.length // 3
mine instanceof Array // true
复制代码

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Neural Networks for Applied Sciences and Engineering

Neural Networks for Applied Sciences and Engineering

Samarasinghe, Sandhya / CRC Pr I Llc / 2006-9 / $ 118.59

In response to the exponentially increasing need to analyze vast amounts of data, Neural Networks for Applied Sciences and Engineering: From Fundamentals to Complex Pattern Recognition provides scient......一起来看看 《Neural Networks for Applied Sciences and Engineering》 这本书的介绍吧!

在线进制转换器
在线进制转换器

各进制数互转换器

RGB HSV 转换
RGB HSV 转换

RGB HSV 互转工具

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具