@Dale-Lin
2020-05-05T19:23:25.000000Z
字数 2001
阅读 518
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)
}
}