js-----继承

曾经终败给现在 2021-09-20 06:56 361阅读 0赞

1：创建的三种方式

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70][]

2：构造函数和实例对象之间的关系

实例对象和构造函数之间的关系
     1：实例对象是通过构造函数来创建的  过程叫实例化
     2：如何判断对象是不是这个数据类型
     1）通过构造器的方式  实例对象.构造器 == 构造函数
     2）instanceof  对象 instanceof 构造函数名称(推荐)
    一个对象的构造器指向的不一定是自己的构造函数，有可能是object

![20190619172302976.png][]

3：原型的引入

作用：数据共享，节省内存空间

![20190619173403220.png][]

下面调用eat的时候，指向的是同一块内存空间

实例对象中有这两个属性(这两个属性是通过构造函数来获取的) ，__proto__属性
    构造函数没有这两个属性
    实例对象中有个属性，__proto__,也是对象，叫原型，不是标准的属性，浏览器使用的(所以存在兼容问题)
    构造函数中也有这个属性 prototype，也是对象，叫原型，，是标准属性，程序员用的
    数据共享，节省内存空间，作用之一

4：构造函数和实例对象和原型对象之间的关系

通过构造函数实例对象，并初始化

\* 构造函数可以实例对象

\* 构造函数有个属性叫prototype,是构造函数的原型对象

\* 构造函数的原型对象(prototype)里面有一个构造器constrotor,这个构造器指向的就是自己所在的原型对象所在的构造函数

\* 实例对象的原型对象，指向的是该构造函数的原型 \* 构造函数中原型的方法，可以被实例对象直接访问

5:简单的原型写法

Student.prototype = \{

height:'188',

eat:function()\{

缺点：这样写会把构造器丢了，需要手动修改构造器的指向

6：原型中的方法可以相互调用

this.方法

7:原型链

实例对象到原型 ---原型连
    * 实例对象使用的属性或方法，先在实例中找，找到直接使用，找不到，则在实例对象的__proto__指向的构造函数的原型对象prototype中找，找到使用，找不到，报错

8：改变原型的指向

构造函数中的this是实例对象

原型对象中方法中this就是实例对象

* 原型指向可以改变
    * 实例对象的原型(__proto__)指向的是该对象所在的构造函数的原型对象
    * 构造函数的原型对象(prototy)如果改变了，那么实例对象的原型也就改变了，this的指向也就改变了
    * 实力对象和原型对象通过__proto__原型来联系起来，这个关系叫原型链
    *在原型改变之后添加方法

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 1][]

原型最终指向了哪里

实例对象的 \_\_proto\_\_  指向构造函数的原型对象prototype ，构造函数的原型对象prototype.\_\_proto\_\_ 指向object.prototype

object.prototype.\_\_proto\_\_指向null

其实他们之间都是实例对象在进行交流

dir直接可以看到

有\_\_proto\_\_  就是实例对象

有prototype就是构造函数

:9：继承的四种方式

(1)原型继承

(2)借用构造函数继承

(3)组合继承

直接代码演示组合继承

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 2][]

(4)拷贝继承

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 3][]

/*
    *     原型作用：数据共享，目的：为了节省内存空间
    * 继承    目的：为了节省内存空间
    * 原型继承：改变原型指向
    * 借用构造函数继承：主要解决属性问题
    * 组合继承：原型继承+借用构造函数继承
    * 技既能解决属性又能解决方法继承
    * 拷贝继承：就是把对象中需要共享的属性或方法，直接遍历的方式赋值到另一个对象中

面试：

原型/原型链/构造函数/实例/继承

原型：

`实例对象中有个属性，__proto__,也是对象，叫原型，不是标准的属性，浏览器使用的(所以存在兼容问题) 构造函数中也有这个属性 prototype，也是对象，叫原型，，是标准属性，程序员用的`

`原型链：原型链是一种关系，是实例对象和原型对象之间的一种关系，通过__proto__练习`

构造函数：构造函数的主要作用是创建对象；一般函数命名以大写开头

构造函数(Person)----实例化对象(new)  ---初始化赋值

实例：new一个对象

原型的作用：

1：数据共享，节省内存空间

2：为了实现继承

继承：四种继承方式

原型继承：

Student.prototype = new Person()

因为是改变原型指向来实现的继承，直接初始化了属性，继承过来的值都一样，所以这就是问题

构造函数继承：

function Student(name,age,score)

Person.call(this,name,age)

解决了属性继承，并且赋值不重复的问题

缺陷：父级类别中的方法不能继承

组合继承：

原型继承+借用构造函数继承

技既能解决属性又能解决方法继承

拷贝继承：

把一个对象的属性和方法，通过遍历的方式，放到另一个对象中

用原型链实现继承有什么缺点，怎样解决？

因为是改变原型指向来实现的继承，直接初始化了属性，继承过来的值都一样，所以这就是问题

通过结合借用构造函数来实现继承，每次实例化对象的时候，进行赋值，但是由于父类级别的方法不能继承，这个时候，用原型继承就ok

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70]: /images/20210812/3f7e582bc17f4e978ada6e736f9637d8.png
[20190619172302976.png]: /images/20210812/b2a1dc42b911449ca021fafca23eed10.png
[20190619173403220.png]: /images/20210812/472e2c3291724e2688f9cd5657369127.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 1]: /images/20210812/52a012e06a504876bc9d2d306907d267.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 2]: /images/20210812/a5a80dec4be3400085c39f53ec768620.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 3]: /images/20210812/ac955a27700e4e94a0b4a84656a3d81f.png