JavaScript知识点之prototype

前言

prototype是所有函数都有的内置属性，prototype属性的值是对象，该对象称之为原型对象。原型是Js的核心概念之一，它引申出继承、原型链等其他概念，本文就详细的分析总结下prototype的相关知识点。

在理解prototype之前，我觉得有必要讲讲面向对象，当然这里不会讲很多，就讲讲Js的面向对象与Java面向对象的区别。

联系：都是面向对象编程
区别：
Js是基于对象的面向对象
Java是基于类的面向对象

这两种形式主要是思想的不同：

• Java是基于类的，类就像生产的模具或者图纸，例如：生产汽车对象，类就是汽车生产图纸，汽车是依据图纸创建出来的
• Js是基于对象的，新的对象是在其他对象的继承上产生的，例如，生产汽车对象，汽车由发动机对象、轮胎对象等组合而成

对象与函数

简要的说了一些题外话，对于Js中的对象与函数，概括性地总结就是两句话：

1、原型都是对象，对象都是由函数创建而来
2、函数都是由Function创建而来

实际上面的两句话很好的说明了Js中对象与函数以及原型相关联系，但是也会有很多细节是无法通过上面的两句话体现出来，例如：

1、Function是对象还是函数？
2、Function是由谁创建而来的呢？
3、函数也是对象，对象又是函数创建而来，不是自相矛盾吗？
等等

下面就详细的解释上面两句话，首先第一句：

1、原型都是对象，对象都是由函数创建而来

在Js中，我们如何获取原型对象呢？
分为两种情况：

1.从函数获取原型对象
prototype是所有函数的内置属性，通过prototype属性可以直接获取到，例如：

2.从对象上获取原型对象
prototype是函数的内置属性，对象不存在prototype属性，所以无法直接通过prototype来获取，通过__proto__属性或者Object.getPrototypeOf(obj)来获取，例如：

获取到原型之后，我们验证下它的类型，如下：

从上图中可以看出原型就是对象，那就说说对象都是由函数创建而来的问题。

提及对象就需要说说Js中创建对象的几种方式：

• 第一种：字面量，也是常用的形式，例如：var test = {}；
• 第二种：Object，例如：var test = new Object();

Js提供了Object、Date、Array、Boolean等内置对象，实际上它们全部是函数，可以构造调用创建对象，如下：

Js中所有的对象（包括函数）都会有一个内置属性constructor，该属性表示创建该对象的构造函数（原型对象的constructor属性值雨有点特殊，下面会详细介绍），如下：

从上图中可以看出，创建test对象的函数是Object函数，侧面的说明了一点字面量的形式实际上还是通过new Object()方式创建的。

2、函数都是由Function创建而来

函数都是通过Function函数构造而成，具体如下：

下面说一下看起来矛盾的几点：

• 函数是可调用对象，对象是函数创建的，实际上这不冲突，Function创建了函数，但Function本身也是函数
• Function是谁创建的呢？实际上Function是由其自身创建，如下：
  

Function.constructor // function Function() {[native code]}

原型

下面就重要说下原型对象知识点，在上面也讲过，原型对象是对象，对象存在内置constructor属性，下面看看原型对象具体构成：

一个空的函数的原型对象包括constructor属性，该属性指向拥有该原型对象的函数自身
对象存在__proto__指向创建该对象的原型对象，即

Object.__proto__ === Function.prototype

原型对象是对象，对象存在__proto__指向创建该原型对象的原型对象，就会形成原型链
下面就以Object为例分析下它的原型链：

Object是Function创建而来的，那么Object.__proto__ === Function.prototype，即Function的原型对象，假设为对象A
对象A的原型对象是对象A.__proto__ (Function.prototype.__proto__), 我们得到：


可知Function.prototype.__proto__ === Object.prototype,所以我们可知Function原型对象的原型对象是Object的原型对象
那么Object.prototype的原型对象是谁？

object.prototype.__proto__ === null，有点哲学的感觉

3、总结

1. 原型是对象，对象是由函数创建而成
2. 函数是由Function创建而成
3. Function是由自身创建而成
4. Function.prototype虽然也是对象，但是查看它的类型实际上是function
5. Function.prototype.__proto__ === Object.prototype
6. Object.prototype.__proto__ === null