第二课：原型链（二）（2021/4/14）

客官°小女子只卖身不卖艺 2022-11-19 05:25 103阅读 0赞

> 1.构造函数原型 prototype

（可以实现函数共享，所有对象的共享操作，不用再单独开辟内存空间）

function Star(uname,age){
            this.uname = uname;
            this.age = age;
    }
    Star.prototype.sing = function(){
            console.log("我会唱歌");
    }

我们可以把那些不变的方法，直接定义在prototype对象上，这样所有对象的实例就可以共享这些方法。

问答：

1.原型是什么?  
一个对象，我们也称为prototype为原型对象。  
⒉原型的作用是什么?  
共享方法。

**公共的方法放到原型对象身上，节省内存空间**

> 2.对象原型\_proto\_

对象都会有一个属性\_proto\_指向构造函数的prototype原型对象，之所以我们对象可以使用构造函数prototype原型对象的属性和方法，就是因为对象有\_proto\_原型的存在。

![在这里插入图片描述][2021041421161524.png]

> 3.constructor构造函数

对象原型(\_ *proto* \_)和构造函数(prototype)原型对象里面都有一个属性constructor属性，constructor我们称为构造函数，因为它**指回构造函数本身**。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTAzMzA0OA_size_16_color_FFFFFF_t_70]  
**很多情况下,我们需要手动的利用constructor这个属性指回原来的构造函数**

// 1.实例成员即使构造函数内部通过this添加的成员uname age sing 就是实例成员
    // 实例成员只能通过实例化的对象来访问
    // 2.静态成员 在构造函数本身上添加的成员
    Star.sex = '男';
    
    // 很多情况下,我们需要手动的利用constructor这个属性指回原来的构造函数
    Star.prototype.sing = function(){
            console.log('我会唱歌');
    }
    Star.prototype.movie = function(){
            console.log('我会演电影');
    }
    
    // 对象的写法：
    Star.prototype = {
            constructor:Star, //指回原先的原型对象
            sing:function(){
                    console.log('我会唱歌');
            },
            movie:function(){
                    console.log('我会演电影');
            }
    }
    // 这个方法是直接覆盖了原先的所有属性、方法。没有constructor了

> 4.构造函数、实例、原型对象三者之间的关系

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTAzMzA0OA_size_16_color_FFFFFF_t_70 1]

> 5.原型链

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTAzMzA0OA_size_16_color_FFFFFF_t_70 2]

> 6.js成员查找机制

会依次根据原型链的结构往上找，首先找构造函数里面的属性方法

ldh.sex; //成员对象自身是否有该属性
    Star.prototype.sex // 如果成员对象自身没有sex属性的话，往上找构造函数原型上是否有这个属性
    Object.prototype.sex //如果构造函数没有sex属性的话，继续网上找对象的sex属性是否存在
    //再往上查找就直接返回undefined了

[2021041421161524.png]: /images/20221022/3f418647d2fe4268b9a4fd49767b7b1f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTAzMzA0OA_size_16_color_FFFFFF_t_70]: /images/20221022/6a11b03816f1410d93aff7e89cafc2e6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTAzMzA0OA_size_16_color_FFFFFF_t_70 1]: /images/20221022/b73d780be1f84b8295be6ce7b92db988.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTAzMzA0OA_size_16_color_FFFFFF_t_70 2]: /images/20221022/da15ee3a5530449bba68bf6c4bb7bb8e.png