美文网首页
继承模式

继承模式

作者: RQrry | 来源:发表于2020-04-06 14:49 被阅读0次

原型继承

子类型的原型为父类型的一个实例对象

function Person (name, age) {
  this.name = name;
  this.age = age;
}
Person.prototype.setName = function (name) {
  this.name = name;
}
function Student (name, age, grade) {
  Person.call(this, name, age);
  this.grade = grade;
}
// 子类型的原型为父类型的一个实例对象
function F () {}
F.prototype = Person.prototype;
Student.prototype = new F();
// 修复子类型的 constructor 指向
Student.prototype.constructor = Student;
Student.prototype.setGrade = function (grade) {
  this.grade = grade;
}
var st1 = new Student('aaa', 18, 88);
console.log(st1); // Student { name: 'aaa', age: 18, grade: 88 }
st1.setGrade(90);
st1.setName('bbb');
console.log(st1); // Student { name: 'bbb', age: 18, grade: 90 }

继承封装

function inherit(Target, Origin) {
  function F() {};
  F.prototype = Origin.prototype;
  Target.prototype = new F();
  Target.prototype.constructor = Target;
}
function inherit(Target, Origin) {
  Target.prototype = Object.create(Origin.prototype);
  Target.prototype.constructor = Target;
}

class

class Person {
  constructor (name, age) {
    this.name = name;
    this.age = age;
  }
  getName () {
    console.log(this.name);
  }
}
let person = new Person('aaa', 18);

等同于

function Person (name, age) {
  this.name = name;
  this.age = age;
}
Person.prototype.getName = function (name) {
  console.log(this.name);
}
let person = new Person('aaa', 18);

class 继承

// Person 类
class Person {
  constructor (name, age) {
    this.name = name;
    this.age = age;
  }
  setName (name) {
    this.name = name;
  }
}

// Student 类继承自 Person 类
class Student extends Person {
  constructor (name, age, grade) {
    super(name, age); // 调用父类的构造方法
    this.grade = grade;
  }
  setGrade (grade) {
    this.grade = grade;
  }
}

let st1 = new Student('aaa', 18, 80);
console.log(st1); // Student { name: 'aaa', age: 18, grade: 80 }
st1.setName('bbb');
st1.setGrade(90);
console.log(st1); // Student { name: 'bbb', age: 18, grade: 90 }

相关文章

  • 继承模式

    原型继承 子类型的原型为父类型的一个实例对象 继承封装 class 等同于 class 继承

  • day18(面向对象基础,设计模式)

    多继承补充 继承具有传递性,可以借助 类名.__mro__观察继承关系 设计模式 设计模式(Designpatte...

  • 09 js04 继承模式、命名空间、对象枚举

    继承模式、命名空间、对象枚举 【附:this指向问题、arguments、逗号操作符、对象克隆】 1、继承模式:【...

  • js面向对象设计

    面向对象模式 继承

  • JavaScript 中几个重要的工具函数

    实现原型继承的extend函数 单体模式通用函数 实现原型继承的extend函数 单体模式通用函数

  • JavaScript Mixin模式

    Mixin模式,混合模式。这是一种不用继承就可以复用的技术。主要还是为了解决多重继承的问题。多继承的继承路径是个问...

  • js面向对象的几种写法

    一、工厂模式 二、构造函数模式 三、原型模式 四、组合使用构造函数和原型模式 五、原型链继承 六、借用构造函数继承...

  • 设计模式

    [toc] 一、创建型 工厂模式 简单工厂模式 以继承的思想分别生产不同的产品。例: 抽象工厂模式 以继承+归类的...

  • Adapter模式

    分为类模式和对象两种 类模式public继承接口,private继承实现 Adapter.h #ifndef _A...

  • 结构性模式(二):装饰器、外观模式

    1、装饰器模式(Decorator Pattern) 装饰器模式主要解决继承关系过于复杂的问题,通过组合来替代继承...

网友评论

      本文标题:继承模式

      本文链接:https://www.haomeiwen.com/subject/wxqbphtx.html