构造函数的继承——使用原型对象(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 复制代码
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- 构造函数、原型、原型链、继承
- 【进阶5-1期】重新认识构造函数、原型和原型链
- 详解js原型,构造函数以及class之间的原型关系
- JavaScript原型与构造函数笔记
- 构造函数(constructor)与原型链(prototype)关系
- 《JavaScript面向对象精要》之四:构造函数和原型对象
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。