原型和原型链（一）

悠悠 2022-11-15 11:35 147阅读 0赞

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70][]

**创建对象有几种方法**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70 1][]

**原型、构造函数、实例、原型链**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70 2][]

构造函数M，它的实例o3，这些都为true，M.prototype.constructor === M;o3.\_\_proto\_\_ === M.prototype；

从一个实例对象往上找构造这个实例的相关联的对象，这个关联的对象再往上找，它又有创造它的上一级的原型对象，以此类推，一直到Object.prototype终止，这个链条就断了，也就是说Object.prototype属性是整个原型链的顶端，原型链是通过prototype这个原型和\_\_proto\_\_属性完成原型链的查找；

当我有多个实例的时候，有相同方法的时候，可以存到共同的东西上，共同的东西就是原型对象，通过原型链的方式找到原型对象，原型对象的方法是被不同的实例所共有的，这是原型链的一个工作原理；

按照JS引擎的分析方式，在访问一个实例的时候，实例有什么方法，在这个实例上没有找到这个方法和属性的话，它就会往它的上一级原型对象上找，如果在它的上一级原型对象还没有找到这个属性和方法，它会在它原型对象的基础上再通过原型对象这个\_\_proto\_\_再往上一级查找，以此类推，直到找到Object.prototype，如果到那个地方还没有找到，原路返回，告诉它这个方法或属性没有找到没有定义，如果在中间找到了，它就停止向上查找，直接返回这个方法的用处；

函数才有prototype，对象是没有prototype的；只有实例对象才有\_\_proto\_\_，函数也有\_\_proto\_\_，因为函数既是函数，也是一个对象（函数M.\_\_proto\_\_ === Function.prototype返回true），说明了函数M的构造函数是Function（把M看成一个实例），可以理解为普通函数M是Function这个构造函数的一个实例；

实例明明是被构造函数生成的，那它是怎么跟这个原型对象产生关联的，也就是构造函数的prototype这个属性，也就是说你修改这个属性，也就修改了实例上一级的原型对象；

当我们创建一个函数的时候，每个函数会自动生成一个原型（prototype）属性；在函数中就只有这一个原型属性，而这个属性是一个指针，指向一个对象，称为原型对象，原型对象中含有一个constructor属性，通过这个属性又可指回函数。当我们向函数中添加属性时，实际上添加到了原型对象之中，当我们用new操作符创建新实例时，这个新实例是可以共享原型对象中的属性的。当我们向新实例中添加属性时，属性被保存到了新实例中，当向新实例中添加和原型中一模一样的属性时，这个属性会覆写原型中的属性

**instanceof原理**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70 3][]

instanceof原理就是判断实例对象的\_\_proto\_\_属性和构造函数的prototype属性是不是同一个引用，用instanceof判断这个实例对象是不是这个构造函数的实例的时候，其实判断的是实例对象的\_\_proto\_\_属性和构造函数的prototype属性是不是引用了同一个地址，如果是就返回true，如果不是就返回false（注意：只要是在这条原型链上的构造函数，都会被instanceof看作是o3的一个构造函数，这是instanceof的一个工作原理）

o3 instanceof Object返回true，M.prototype.\_\_proto\_\_ === Object.prototype返回true，说明Object是o3的原型的构造函数，所以Object也会被instanceof看作是o3的一个构造函数，虽然不是它真正的构造函数，但是它在这条原型链上，所以也是返回true

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70]: /images/20221022/dcd393f9e1e944eaa51a98bfdcd26ae2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70 1]: /images/20221022/9516f71ddd2c4b8e8de4b861e749871e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20210106002533983.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20210106004345436.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzgwNDQ5Ng==,size_16,color_FFFFFF,t_70