@Dale-Lin
2020-05-05T11:23:25.000000Z
字数 2001
阅读 808
JavaScript
通过原型链的继承,不要忽略 Object 才是最终的原型,再结合原型链搜索规则判断搜索的结果。
将一个构造函数 a的原型 设置成另一个构造函数 b的对象实例 (a.prototype = new b()),即可完成 a对b的继承 :
function SuperType(){this.property = true;}SuperType.prototype.getSuperValue = function(){return this.property;};function SubType(){this.subproperty = false;}//原型替换成SuperType的实例SubType.prototype = new SuperType();var example = new SubType();
完成原型对实例的继承后,可以通过对原型(也就是实例)或其原型的访问来修改SuperType,甚至是SuperType.prototype的属性及方法。
但是,一旦修改SuperType.prototype的内容,将会影响所有对象实例的相应内容。
SuperType.prototype 存在于 SubType 实例的原型链上,通过 instanceof / Object.isPrototypeOf() 可以判断。
借用构造函数可以使SuperType的代码在SubType创建实例时,在SubType的环境下运行。
function SuperType(name){this.colors = ["red", "blue", "green"];this.name = name;}function SubType(name){SuperType.call(this, name);}var i1 = new SubType();i1.colors.push("black");console.log(i1.colors); //"red","blue","green","black"var i2 = new SubType("Nicholas");console.log(i2.colors); //"red","blue","green"console.log(i2.name); //"Nicholas"
这样就避免了对所有实例对象的无差别影响。
但是每一次创造实例,都要调用一次SuperType构造函数。
在借用继承的基础上,在SubType.prototype上定义函数,即可避免每次调用时写入共用方法,实现代码的复用。
// ...借用继承代码SubType.prototype = new SuperType();SubType.prototype.constructor = SubType;SubType.prototype.myFunc = function(){console.log(this.name);};
newObj = Object.create(proto[, propertiesObject])
Object.create() 第一个参数是一个对象,作为newObj的__proto__;
第二个参数如同Object.defineProperties()的第二个参数一样,是一组或几组属性名值对,作为newObj的实例属性添加。
function Shape() {this.x = 0;this.y = 0;}Shape.prototype.move = function (x, y) {this.x += x;this.y += y;}// 直接获得原型链var rect = Object.create(new Shape());rect instanceof Shape; // true
创建一个仅用于封装继承过程的函数,内部增强对象,最后返回这个对象。
继承基本是将另一个构造函数的原型作为新构造函数的原型,然后可以修改这个原型(目的是增强新实例的原型,并获得继承的内容)。
核心例子如下:
function inheritPrototype (subType, superType) {// 从另一个构造函数创建一个即将成为新对象原型的实例var prototype = Object.create(superType.prototype);// 绑定构造函数prototype.constructor = subType;subType.prototype = prototype;// 增强 prototype// ...}
class People {constructor(name) {this.name = name}sayName() {console.log(this.name)}}class Student extends People {constructor(name, id) {super(name)this.id = id}sayId() {console.log(this.id)}}