JS之理解继承:https://segmentfault.com/a/1190000010468293

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,子类能很清晰的继承父类的公有和私有。

JS之理解继承的更多相关文章

  1. 【学习笔记】六:面向对象的程序设计——理解JS中的对象属性、创建对象、JS中的继承

    ES中没有类的概念,这也使其对象和其他语言中的对象有所不同,ES中定义对象为:“无序属性的集合,其属性包含基本值.对象或者函数”.现在常用的创建单个对象的方法为对象字面量形式.在常见多个对象时,使用工 ...

  2. [js]js原型链继承小结

    这是之前总结的, 发现有很多的毛病,就是重点不突出,重新翻看的时候还是得耗费很长时间去理解这玩意. js中的继承 js中什么是类 1,类是函数数据类型 2.每个类有一个自带prototype属性 pr ...

  3. js面向对象理解

    js面向对象理解 ECMAScript 有两种开发模式:1.函数式(过程化),2.面向对象(OOP).面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是, ...

  4. JS中的继承(上)

    JS中的继承(上) 学过java或者c#之类语言的同学,应该会对js的继承感到很困惑--不要问我怎么知道的,js的继承主要是基于原型(prototype)的,对js的原型感兴趣的同学,可以了解一下我之 ...

  5. 浅谈JS中的继承

    前言 JS 是没有继承的,不过可以曲线救国,利用构造函数.原型等方法实现继承的功能. var o=new Object(); 其实用构造函数实例化一个对象,就是继承,这里可以使用Object中的所有属 ...

  6. JS创建对象、继承原型、ES6中class继承

    面向对象编程:java中对象的两个基本概念:1.类:类是对象的模板,比如说Leader 这个是泛称领导,并不特指谁.2:实例:实例是根据类创建的对象,根据类Leader可以创建出很多实例:liyi,y ...

  7. js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法。

    js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法. function ClassA(sColor) { this.color = sColor; } Class ...

  8. js模拟实现继承功能

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  9. js中实现继承的几种方式

    首先我们了解,js中的继承是主要是由原型链实现的.那么什么是原型链呢? 由于每个实例中都有一个指向原型对象的指针,如果一个对象的原型对象,是另一个构造函数的实例,这个对象的原型对象就会指向另一个对象的 ...

随机推荐

  1. ESP8266-模拟输出(PWM)

    PWM(Pulse Width Modulation,脉宽调制),是在保持波的频率不变的同时改变脉宽的技术 首先,我们来理解一下占空比.一个脉冲周期由一个ON周期(VCCC)和一个OFF周期(GND) ...

  2. 2016.09.03【初中部 NOIP提高组 】模拟赛A总结

    今天班主任不知道出了什么事,把整个班留了40多分钟,各种吹水谈人生.耽误了很多时间. #$%^& 这次第一题很神奇,通过枚举矩阵来确定三个单元格的位置,没想到,结果爆零. 刚开始看见这道题有费 ...

  3. 正则化方法L1 L2

    转载:http://blog.csdn.net/u012162613/article/details/44261657(请移步原文) 正则化方法:防止过拟合,提高泛化能力 在训练数据不够多时,或者ov ...

  4. VUE实现限制输入框最多输入15个中文,或者30个英文

    vue项目,输入框限制输入15个中文,或者30个英文 <input type="text" v-model="groupName" class=" ...

  5. C#Regex中replace方法的替换自定义小数点后的内容

    $1应该就是引用了这个组,不用这个会匹配不到 /// <summary> /// 截取 /// </summary> /// <param name="n&qu ...

  6. vue使用 router-link 时点击不能跳转问题

    本来一直都是使用<router-link to='/CouplePackage'>产品</router-link>这样的静态方法, 但是突然今天发现这个方法好像有点问题,在某些 ...

  7. python之sys._getframe() 用于查看函数被什么函数调用以及被第几行调用及被调用函数所在文件

    import sys def get_cur_info(): print(sys._getframe().f_code.co_filename) # 当前文件名,可以通过__file__获得 prin ...

  8. python 面向对象_3

    析构函数:实例被销毁时候自动调用的方法,(例如关闭数据库,可以将关闭数据库的代码写到析构函数里) class Person: def __init__(self): print('构造函数') def ...

  9. [人物存档]【AI少女】【捏脸数据】两个人物

    点击下载(城通网盘):8bcd58f40ad162d9c1fd6f641edfa9ec8b13cdf8.png 点击下载(城通网盘):AISChaF_20191110015122738.png

  10. Redis 数据安全与性能保障

    数据安全与性能保障 ·将数据持久化至硬盘·将数据复制至其他机器·处理系统故障·reids事务·非实物型流水线·诊断性能问题 持久化选项: 共享选项,这个选项决定了快照文件和AOF文件的保存位置dir ...