资讯专栏INFORMATION COLUMN

JS之理解继承

caiyongji / 1318人阅读

摘要:父类子类原理就是改变中的指向,指向的实例,子类会获得父类的私有属性和方法原型链继承在中通过继承到了父类的私有属性和私有方法。子类私有继承父类私有原理目前比较常用的是混合继承和混合继承,子类能很清晰的继承父类的公有和私有。

前言:JS之理解原型和原型链,几种常见的继承方式介绍

1.call继承,也叫借用构造函数伪造对象或是经典继承call继承回把父类的私有属性和方法继承给子类私有;父类公有属性(原型上的属性)无关。当然这里的call也可以用apply

//父类F     //子类S
function S(){
  F.call(this)   
}//原理就是改变F中的this指向,指向S的实例,子类会获得父类F的私有属性和方法

2.原型链继承:在1中通过call继承到了父类的私有属性和私有方法。下一步就是有共有属性和方法。原型链继承把父类私有和公有的属性,都给了子类公有,子类的原型作为父类的实例。原型链继承会使得父类的私有属性在子类的私有和公有都得到继承。

function S(){};
//把子类公有的作为父类的实例;
S.prototype=new F;
 let  s=new S;

3.冒充继承:通过遍历父类的属性,把父类私有+公有的的属性都给了子类私有。for in循环,只能遍历自定义的属性和方法;拿不到系统的属性和方法,例如constructor

   function S(){ 
     for(var attr in f){
       this[attr]=f[attr];}}
    let s=new S;

4.混合继承1call继承+原型链继承;子类私有中有父类私有的,子类公有也有父类私有;;

 //子类私有继承父类私有;
 function S(){ F.call(this)};
  
 //子类公有继承父类私有——公有 
 S.prototype=new F;
 let s=new S;

5.混合继承2call继承+拷贝继承(extend),通过extend方法遍历父类原型上的方法,并复制给子类的原型。

   //子类私有继承父类私有;
   function S(){F.call(this);}
   
   //通过extend方法进行拷贝继承公有
   extend(S.prototype, F.prototype);
   let s=new S;

   //extend方法
   function extend(obj2,obj1){
      for(var attr in obj1){
       obj2[attr]=obj1[attr]}

6.混合继承3call继承+Object.create(),这也是ES6class继承extends的原理,点这。

//子类私有继承父类私有;
 function S(){F.call(this)}
    
 S.prototype =  Object.create(F.prototype,{constructor:{value:S}})   
    
 //Object.create()原理   
 function Tmp(){};
 Tmp.prototype= F.prototype;
 S.prototype=new Tmp;
 S.prototype.constructor=S;
 //*********

 let  s=new S;

目前比较常用的是混合继承2和混合继承3,子类能很清晰的继承父类的公有和私有。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84596.html

相关文章

  • JS理解ES6 继承extends

    摘要:理解继承在中对继承有了更友好的方式。总的来说的的实质和以前的继承方式是一致的,但是有了更好的,更清晰的表现形式。 理解ES6继承extends 1.在es6中对继承有了更友好的方式。在下面的继承中那到底在extends的时候做了什么,super()又是代表什么意思。 class People{ constructor(name, age) { this.name = name; ...

    starsfun 评论0 收藏0
  • JavaScript深入各种继承

    摘要:通常有这两种继承方式接口继承和实现继承。理解继承的工作是通过调用函数实现的,所以是寄生,将继承工作寄托给别人做,自己只是做增强工作。适用基于某个对象或某些信息来创建对象,而不考虑自定义类型和构造函数。 一、继承的概念 继承,是面向对象语言的一个重要概念。通常有这两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。 《JS高程》里提到:由于函数没有签名,...

    tomlingtm 评论0 收藏0
  • 深入理解 js 继承与原型链

    摘要:原型链与继承当谈到继承时,只有一种结构对象。如果对该图不怎么理解,不要着急,继续往下看基于原型链的继承对象是动态的属性包指其自己的属性。当使用操作符来作用这个函数时,它就可以被称为构造方法构造函数。 原型链与继承 当谈到继承时,JavaScript 只有一种结构:对象。每个实例对象(object )都有一个私有属性(称之为proto)指向它的原型对象(prototype)。该原型对象也...

    xingqiba 评论0 收藏0
  • 深入理解 Javascript 继承

    摘要:继承继承子类可以使用父类的所有功能,并且对这些功能进行扩展。类继承父类父类添加共有方法子类继承父类子类添加共有方法其中最核心的一句代码是将原型指向了父类的原型对象。 继承 继承:子类可以使用父类的所有功能,并且对这些功能进行扩展。继承的过程,就是从一般到特殊的过程。 类继承 // 父类 var supperClass = function() { var id = 1; thi...

    wuyangnju 评论0 收藏0
  • javascript编程继承

    摘要:中的继承有多少种方式去某度搜一下,说几种的都有,看的头晕眼花,还是云里雾里,于是就自己认真理一下,写一篇按照自己的理解来进行的分类。 js中的继承有多少种方式?去某度搜一下,说几种的都有,看的头晕眼花,还是云里雾里,于是就自己认真理一下,写一篇按照自己的理解来进行的分类。 JS实现继承的核心技术点无非几种: 1: new 关键字 2: prototype 3: call、appl...

    livem 评论0 收藏0

发表评论

0条评论

caiyongji

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<