Function，Object，__proto__，prototype

** 原文链接：https://juejin.cn/post/6844903930216841230#comment**

彻底搞懂Function，Object，proto，prototype之间的关系

写在开篇之前：记录学习点滴，如有错误与补充，希望大家积极指正。

有4个规则一定要记住，如下`
javascript中一切皆对象，函数也属于对象。
所有对象都含有__proto__。
只有函数才有prototype。
所有函数的默认原型都是Object的实例。
我们来看一下demo

var o = {};
o.proto === Object.prototype //true
o instanceof Object //true
o instanceof Function //false

var o = Object();
o.proto === Object.prototype //true
o instanceof Object //true
o instanceof Function //false

var o = new Object();
o.proto === Object.prototype //true
o instanceof Object //true
o instanceof Function //false

function Fn(){}
var fn = new Fn();
fn.proto === Fn.prototype;

fn instanceof Fn //true
fn instanceof Object //true
fn instanceof Function //false

复制代码
js中一切皆对象，函数也是对象的一种，姑且叫做函数对象。那么Function与Object是什么关系呢。

函数对象都是由Function函数生成的，看下例

  function fn(){
    
    }
    
    fn.__proto__ === Function.prototype  //true
    fn instanceof Function  //true
    fn instanceof Object    //true

复制代码
可以看出当把函数当成对象的时候，函数也有__proto__属性，并且生成它的函数就是Function，那么Function自己呢，因为Function本身也是函数，函数是由Function生成的，那么看下例。

Function.__proto__ === Function.prototype  //true

复制代码
Object函数也是一个函数对象，也是由Function生成的，那么看下例

  Object.__proto__ === Function.prototype  //true

复制代码
对一般函数来说，prototype是什么呢？以function fn(){}为例子
在这里插入图片描述
看看 fn.prototype的属性等于什么呢

 fn.prototype.__proto__ === Object.prototype  //true
    fn.prototype.constructor === fn  //true

复制代码
fn.prototype含有__proto__与constructor两个属性，__proto__属性指向Object.prototype，那么一般函数的prototype是由Object函数生成的。

特殊函数 Object与Function
先看看Object.prototype

在这里插入图片描述

可以看出Object的prototype的也是一个object类型的对象，但是和一般函数不一样的对方是，他的prototype多出了很多其他的方法，这些是Javascript系统默认的方法。但是好像没有__proto__属性啊，我们把Object.prototype.__proto__打出来看看
在这里插入图片描述

这就是Object函数不一样的地方了，Object.prototype.proto === null，这就是Javescript原型链的终点了。那为什么是这个样子呢？

typeof Object.prototye === ‘object’,说明他是一个object类型的对象，如果他是由Object函数生成的，那么Object.prototype.proto === Object.prototype。那么Object.prototype.__proto__指向自身，那么以__proto__属性构成的原型链将没有终点了，所以为了让原型链有终点。Javascript规定，Object.prototype.proto === null。

那么Function又是什么情况呢。
在这里插入图片描述

可以看出Function属性的prototype是一个"function"类型的对象，而不像其他的对象是"object"对象，那么既然是对象，那也是有__proto__属性的，那么Function.prototype.__proto__是什么呢
在这里插入图片描述

哇哦，看起来和Object.prototype好像啊，那么试一下

在这里插入图片描述

那么这又是为什么呢？

一般而言，一个"function"类型的对象，应该是由Function函数生成的，也就是Function.prototype.proto === Function.prototype才对，如果是这样的话，也就出现了跟Object一样的问题，一直循环利用，没有尽头。所以Javascript规定，Function.prototype.proto === Object.prototype,Object.prototype.proto === null，是原型链有终点。也就是在原型链的终点处有2个特殊情况。

在这里插入图片描述

总结以下

函数含有__proto__与prototype属性，__proto__指向Function.prototype,prototype指向Object.prototype，以Array函数为例
在这里插入图片描述

所有的类型的[[Prototype]]特性，即 __proto__属性均指向的是 Function.prototype，同时 Function.prototype 的[[Prototype]]特性，即 __proto__属性又指向了 Object.prototype，Object.prototype的__proto__又指向null，即原型链的终点。
下面一些题目，大家分析看看

 function fn(){
    
    }
 var o = {
    
    }
 var o1 = new Object();
 
 typeof fn     //"function"
 typeof fn.prototype   //"object"
 typeof fn.__proto__   //"function"  
 fn.prototype.__proto__ === Object.prototype  //true   所有函数的默认原型都是Object的实例
 fn.__proto__ === Function.prototype          //true   所有函数都是Function生成的
 
 fn instanceof Function  //true  fn是Function的实例
 fn instanceof Object    //true  fn也是Object的实例

 
 typeof o  //"object"
 typeof o.prototype  // "undefined"  因为只有函数才有prototype
 typeof o.__proto__  // "object"
 o.__proto__.__proto__ === null   //true
 
 o instanceof Object   // true o是Object的实例