美文网首页
js继承方式

js继承方式

作者: _dani | 来源:发表于2016-12-01 17:18 被阅读0次

类式继承

function SuperClass(){
  this.superValue = 'superValue';
  this.langs = ['js','html'];
}

SuperClass.prototype.getSuperValue = function(){
  return this.superValue;
}
function SubClass(){
  this.subValue = 'subValue';
}

SubClass.prototype = new SuperClass(); 
SubClass.prototype.getSubValue = function(){
  return this.subValue;
}

缺点:   1.父类构造函数中的引用类型会被子类实例共享
        2.子类实例化过程中不能将参数传给父类构造函数

构造函数继承

function SuperClass(name){
  this.superValue = 'superValue';
  this.langs = ['js','html'];
  this.name = name || 'super';
}

SuperClass.prototype.getSuperValue = function(){
  return this.superValue;
}
function SubClass(name){
  this.subValue = 'subValue';
  SuperClass.call(this,name);
}

SubClass.prototype.getSubValue = function(){
  return this.subValue;
}
优点: 子类实例化过程中可传参给父类构造函数
缺点: 子类不能继承到父类prototype上的属性

组合继承

类式继承 + 构造函数继承

function SuperClass(name){
  this.superValue = 'superValue';
  this.langs = ['js','html'];
  this.name = name || 'super';
}

SuperClass.prototype.getSuperValue = function(){
  return this.superValue;
}
function SubClass(name){
  this.subValue = 'subValue';
  SuperClass.call(this,name);
}

SubClass.prototype = new SuperClass(); 
SubClass.prototype.getSubValue = function(){
  return this.subValue;
}

优点: 1.子类实例中更改继承的引用类型不会影响到其他子类实例
      2.子类实例化过程中能将参数传递给父类的构造函数

缺点: 子类继承会调用两次父类构造函数(prototype和call)
   

原型式继承

function inheritObject(o){
  function F(){}
  F.prototype = o;
  return new F();
}
---
var book = {
  name:'langs'
  content:['js','html']
}
var newBook = inheritObject(book);

类似于类式继承
缺点:同类式继承
优点:可根据已有对象创建新对象,不必创建自定义的类

寄生式继承

 var book = {
  name:'langs'
  content:['js','html']
}

function createBook(o){
  var obj =  inheritObject(o);
    //扩展新对象
    obj.getName = function(){
    console.log('name');
  }
  return obj;
}
在原型式继承的基础上扩展属性
优缺点同原型式继承

寄生组合式继承

寄生式继承 + 构造函数继承


function inheritPrototype(subClass,superClass){
  var p = inheritObject(superClass);
  p.constructor = subClass;
  subClass.prototype = p;
}

function SuperClass(value){
  this.superValue = value || 'superValue';
  this.langs = ['js','html'];
}

SuperClass.prototype.getSuperValue = function(){
  return this.superValue;
}
function SubClass(value){
  SuperClass.call(this, value);
}
inheritPrototype(SubClass, SuperClass);
优点:1.子类实例中更改继承的引用类型不会影响到其他子类实例
      2.子类实例化过程中可传参给父类构造函数
缺点:代码实现复杂

相关文章

  • js 的继承的几种方式

    js 继承有6种方式的代码。 js继承的6种方式[https://www.cnblogs.com/Grace-zy...

  • js继承方式

    类式继承 构造函数继承 组合继承 类式继承 + 构造函数继承 原型式继承 寄生式继承 寄生组合式继承 寄生式继承 ...

  • JS继承方式

    js继承有多种继承方式,但最常用的是组合模式,代码例子如下 在这种方式下,把实例函数都保存在原型对象上,这样可...

  • js继承方式

    实现继承有两种常见方式: 混合式继承 最简单的继承就是将别的对象的属性强加到我身上,那么我就有这个成员了。 混合式...

  • js继承方式

    //Object.create(proObj)创建一个新的对象,但是还要把proObj作为这个对象的原型 //...

  • js继承方式

    1、原型链继承 缺点:复合类型数据改变会影响所有子函数2、构造函数继承 缺点:如果属性有公用函数,重复多了会浪费内...

  • js继承方式

    原型链继承 打印结果如下: 上面定义了一个 Parent 类并传了一个 name 值,而且在 Parent 的原型...

  • JS继承

    JS中的继承 许多OO语言都支持两种继承方式:接口继承和实现继承; 因为JS中没有类和接口的概念 , 所以JS不支...

  • 继承

    研究学习了js内部的继承方式,以及多种方式的优点和缺点 目前项目中的 以前项目中的 js中继承有多种方式 原型继承...

  • #js继承

    js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承)类式继承(构造函数间的继承) 类式继承是...

网友评论

      本文标题:js继承方式

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