导读
js的原型问题困扰了我很长时间，一直没有彻底理解其中的内部关系，所以整理了一个脑图来辅助理解，希望对各位读者有所帮助。
函数
function fn(){
console.log('running fn function');
};
当我们定义了这个函数后，你可以在脑图中找到对应的function fn()函数，来辅助理解。
-
每一个函数都有
prototype属性, 即原型，属性值为一个对象。 -
每一个对象都有
__proto__属性，指向创建该对象的函数的prototype。
typeof fn.prototype === 'object';
fn.prototype.constructor === fn;
构造函数（Function & Object）
这两个构造函数，平时可能接触比较少，但是这两个构造函数才是创建函数和对象的核心。
// Function创建函数
const func = new Function('a', 'b', 'return a + b');
// Object创建对象
const obj = new Object();
A instanceof B
沿着A的
__proto__这条线来找，同时沿着B的prototype这条线来找，如果两条线能找到同一个引用，即同一个对象，那么就返回true。如果找到终点还未重合，则返回false。
fn instanceof Function === true
fn instanceof Object === true
Function instanceof Object === true
Object instanceof Object === true
Function instanceof Function === true
上边的表达式我们依次解释
- fn instanceof Function === true
fn.__proto__ === Function.prototype
函数即对象，__proto__将指向创建该对象的函数的原型。
- fn instanceof Object === true
fn.__proto__ === Function.prototype
Function.prototype.__proto__ === Object.prototype
- Function instanceof Object === true
Function.__proto__ === Function.prototype
Function.prototype.__proto__ === Object.prototype
- Object instanceof Object === true
Object.__proto__ === Function.prototype
Function.prototype.__proto__ === Object.prototype
Object.__proto__.__proto__ === Object.prototype
- Function instanceof Function === true
Function.__proto__ === Function.prototype
Function.__proto__ === Function.prototype
class
ES6中引入了class，让我们在定义类和实现继承时，代码更清晰和简介。class仅仅是一个语法糖，本质上就是构造函数。
class cls{}
typeof cls === 'function'
所以class很多特性和函数都是一致的，通过类实现继承时，需要注意两点。
class A {}
class B extends A {}
- 子类
B的__proto__指向父类A - 子类
B的原型prototype指向父类A的原型prototype
