js篇-原型与原型链

prototype属性

每一个构造函数都有一个prototype属性,这个就是原型,每一个对象都会从原型"继承"属性。

__proto__属性

每一个实例都有一个__proto__属性,这个属性指向原型

继承

原型链继承

 实现思路:定义两个构造函数,分别为父类(SuperType)、子类(SubType),为了实现子类能够使用父类的属性(本身和原型上面的属性)。重写子类的原型,让子类的原型指向父类实例,这样子类的构造函数就是父类的实例地址,实现子类可以使用父类的本身和原型上的属性

function superType () {
}
superType.prototype.say = function () {
  console.log('say hello')
}
function subType(age) {
  this.age = age
}
subType.prototype = new superType(); // 改写子类的原型,为夫类的实例
SubType.prototype.constrcutor = SubType;  

优点:子类可以通过原型链的查找,实现父类的属性公用与子类的实例

缺点:

  • 一些引用数据操作的时候会出问题,两个实例会公用继承实例的引用数据类
  • 谨慎定义方法,以免定义方法也继承对象原型的方法重名
  • 无法直接给父级构造函数使用参数

构造函数继承

实现思路:使用call apply方法,通过执行方法修改tihs (上下文),是的父级的this变成子类实例的this,这样每个实例都会得到父类的属性,实现引用属性备份

function superType (name) {
  this.name = name;
}
superType.prototype.say = function () {
  console.log('say hello')
}
function subType (age, name) {
  this.age = age;
  superType.call(this, name)
}

优点:解决了父类传递参数问题

缺点:子类的实例只是得到了父类的this绑定的属性,放在父类prototype的属性和方法不可使用

组合继承(原型链+构造函数继承)

实现思路:

  • 使用原型链的继承实现,通过原型查找功能来满足原型链共享方法
  • 使用借用构造函数方法,使用实例备份父类共享引用类型备份
function superType (name) {
  this.name = name;
}
superType.prototype.say = function () {
  console.log('say hello')
}
function subType (age, name) {
  this.age = age;
  superType.call(this, name)
}
subType.prototype = new superType(); // 改写子类的原型,为夫类的实例
SubType.prototype.constrcutor = SubType;

缺点:父类的构造函数被实例换了两次 * 实例会有父类的构造函数的一些this属性、子类的构造函数(prototype)上也有一份实例的上有的属性

function superType (name) {
  this.name = name;
}
superType.prototype.say = function () {
  console.log('say hello')
}
function subType (age, name) {
  this.age = age;
  superType.call(this, name)
}
const props = Object(superType.prototype)
props.constrcutor = subType
subType.prototype = props
// subType.prototype = new superType(); // 改写子类的原型,为夫类的实例

  

原文地址:https://www.cnblogs.com/liangshuang/p/12299495.html