美文网首页
继承方法

继承方法

作者: LuckyFBB | 来源:发表于2018-08-22 11:04 被阅读0次

构造函数/原型/实例的关系

每一个构造函数都有一个原型对象
原型对象都包含一个指向构造函数的指针
实例都包含一个指向原型对象的内部指针
  1. 借助构造函数实现继承
function Parent() {
    this.name = "Parent";
}
Parent.prototype.say = function () {
    console.log('hi');
};
function Child() {
    Parent.call(this);
    this.type = "Child";
}
new Child().say();    //not a function
重点:用call()、apply()将父类构造函数引入子类函数(在子类函数中做了父类函数的自执行(复制))
特点:a.只继承了父类构造函数的属性,没有继承父类原型的属性
      b.解决了原型链继承缺点1、2、3
      c.可以继承多个构造函数属性(call多个)
      d.在子实例中可向父实例传参
缺点:a.只能继承父类构造函数的属性
      b.无法实现构造函数的复用
      c.每个新实例都有父类构造函数的副本
  1. 借助原型链实现继承(弥补构造函数实现继承不足)
function Parent() {
    this.name = "Parent1";
    this.list = [1, 2, 3]
}
function Child() {
    this.type = "Child1";
}
Child.prototype = new Parent();
var c1 = new Child();
var c2 = new Child();
console.log(c1.list);   //[1,2,3]
c2.list.push(5);
console.log(c1.list);   //[1,2,3,5]
重点:让新实例的原型等于父类的实例
特点:实例可以继承的属性有:实例的构造函数的属性、父类构造函数属相、父类的原型属性。
缺点:a.新实例无法向父类构造函数传参
      b.继承单一
      c.所有新实例都会共享父类实例的属性(原型上的属性是共享的,一个实例修改了原型属性,另一个实例的原型属性也会被修改)
借助原型链
  1. 组合方式(组合原型链和借用构造函数继承,常用)
function Parent() {
    this.name = "Parent";
    this.list = [1, 2, 3];
}
function Child() {
    Parent.call(this);    //借用构造函数模式
    this.type = "Child";
}
Child.prototype = new Parent();   //原型链继承
Child.prototype.constructor = Child;
var c3 = new Child();
var c4 = new Child();
console.log(c3.list);
c4.list.push(5);
console.log(c3.list);
重点:结合两种模式的优点,传参和复用
特点:可以继承父类原型链上的属性,可以传参,可复用。  
     每个新实例引入的构造函数属性都是私有的。
缺点:调用两次父类构造函数,子类的构造函数会代替原型上的那个父类构造函数。
  1. 组合式优化1
function Parent5() {
    this.name = "Parent";
    this.list = [1, 2, 3];
}
function Child5() {
    Parent5.call(this);    
    this.type = "Child";
}
Child5.prototype = Parent5.prototype;
var c7 = new Child5();
var c8 = new Child5();
c7.list.push(4);
console.log(c7 instanceof Child5, c7 instanceof Parent5);     //true true
console.log(c7.constructor);      //Parent5
缺点:无法区分一个对象是直接由它的子类实例化的,还是它的父类实例化的
组合优化1
  1. 组合式优化2(常用)
    寄生:在函数内返回对象然后调用
    组合:函数的原型等于另一个实例;在函数中用call和call引入另一个构造函数,可传参。
function Parent5() {
    this.name = "Parent";
    this.list = [1, 2, 3];
}
function Child5() {
    Parent5.call(this);    //组合
    this.type = "Child";
}
Child5.prototype = Object.create(Parent5.prototype);     //寄生
Child5.prototype.constructor = Child5; 
var c7 = new Child5();
var c8 = new Child5();
c7.list.push(4);
console.log(c7 instanceof Child5, c8 instanceof Parent5);     //true true
console.log(c7.constructor);      //Child5
重点:修复了组合继承的问题
组合优化2

相关文章

  • 原型相关(二)

    1.继承 继承方式:接口继承(只继承方法签名)实现继承(继承实际的方法)ECMAScript只支持实现继承,并且主...

  • 我碰到的前端面试题(js)

    1.js实现继承有哪几种方法? 方法一:原型链继承 方法二: 构造函数继承 方法三: 组合继承 2.this指向问...

  • 7、面向对象的程序设计3(《JS高级》笔记)

    三、继承 许多OO语言都支持两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际方法。由...

  • 继承

    一. 单继承 继承的概念一般子女继承父辈 2.多继承 3.重写、调用父类方法 二. 静态方法和类方法 1、类方法 ...

  • 面向对象——继承

    许多OO语言都支持两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。ECMAS...

  • 高程三 关于原型链 阅读笔记

    许多OO语言都支持两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。由于函数没...

  • js面向对象设计---继承

    许多OO语言都支持两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。如前所述,...

  • javaScript继承

    很多面向对象语言都支持两种继承:接口继承和实现继承,前者继承方法签名,后者继承实际的方法。接口继承在 ECMAS...

  • 2021-03-15 Dart中的多继承

    extends 继承implements 继承(父类方法必须要实现)with 多继承(父类不能有构造方法)on ...

  • 原型与继承

    什么是继承? 继承父级的属性和方法和共享(原型链)的属性和方法 组合继承 通过原型链继承共享的方法和属性;通过构造...

网友评论

      本文标题:继承方法

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