JavaScript原型对象与原型链

网页三兄弟

前端的兄弟面试多多少少被问到原型的问题，原型是什么？
网上文章太多了，写的很复杂，尤其是有一张像蚯蚓的图看的我头大，看了好多文章结合自己实践总结了下面一张图

JavaScript是一种基于原型的面向对象编程语言
引用mozilla的描述：
JavaScript 只有一种结构：对象。 每个实例对象（object）都有一个私有属性（称之为__proto__）指向它的构造函数的原型对象（prototype ）。该原型对象也有一个自己的原型对象(proto) ，层层向上直到一个对象的原型对象为 null。
根据定义，null 没有原型，是原型链中的最后一个环节。
几乎所有 JavaScript 中的对象都是位于原型链顶端的 Object 的实例。`

对象分为两种：普通对象object和函数对象function;
概要：

  • function有__proto__属性和prototype属性，prototype属性是function独有的；
  • 对象都有__proto__属性，通过这个属性找到它的上级；
  • 数据类型：null、undefined是没有构造函数的
  • Object.prototype是所有对象的爸爸，Object.prototype原型是null。
foo 
1
2
3
4
5
6
7
8
9
10
Object.prototype === {}.__proto__  //true，这个前后反过来写会报错，var a = {};a.__proto__ === Object.prototype;这样就不会

(1).__proto__ === Number.prototype //true，1是个值，要用强制运算符()

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

Object.prototype.__proto__ === null //true
//...根据上面的图，你们可以一一对应找出对象的上级

原型链

上面的结构图可以看出来，对象的上级以及上级的上级一直到末端到null，这一整条链接关系就是原型链

参考资料：
继承与原型链
三张图搞懂JavaScript的原型对象与原型链
js基础篇——原型与原型链的详细理解