JavaScript深入浅出了解原型与原型链

一图了解原型链

1. 什么是原型？

1. 原型分为两种 显示原型 prototype 和 隐示原型__proto__。
2. 在js中所有函数基本上都有 prototype这个属性，属性值是一个普通的对象。
3. 在js中所有引用类型都有一个__proto__(隐式原型)属性，属性值是一个普通的对象。
4. 有一个例外 let fun = Function.prototype.bind() 此时fun没有原型。
5. 所有引用类型的__proto__属性指向它构造函数的显示原型prototype
6. 函数原型中有一个属性constructor 构造函数 指向函数本身

2. 什么是原型链？

1. 简单来说原型链就是通过隐示原型__proto__可以找到其构造函数的原型上的属性，依次寻找上层知道寻找到 Object.prototype.__proto__ === null //true
2. 原型链是用来共享与继承的一个对象链

3. new的时候发生了什么，手写一个new

1. 创建一个对象
2. 隐示原型指向构造函数的原型
3. 绑定this
4. 返回新对象

function create() {
  // 创建一个新的对象
  let obj = new Object();
  // 取出第一个参数，该参数就是我们将会传入的构造函数
  // arguments会被shift去除第一个参数
  let Constructor = [].shift.call(arguments);
  // 将obj的原型指向构造函数，此时obj可以访问构造函数原型中的属性
  obj.__proto__ = Constructor.prototype;
  // 改变构造函数的this的指向，使其指向obj
  // 此时obj也可以访问构造函数中的属性了
  let result = Constructor.apply(obj, arguments);
  // 确保 new 出来的是个对象
  // 返回的值是什么就return什么出来
  return typeof result === 'object' ? result : obj 
}
function A(){}
var a = new A();
create(A)

4. 三个特殊 注意的地方

1. Object.prototype.__proto__ === null 对象原型的隐示原型指向空
2. Object.__proto__ === Function.prototype 因为对象也是函数创造的，所以对象的隐示原型指向函数的原型
3. Function.prototype === Function.__proto__ 因为 函数也是被Function创造的所以 函数的隐示原型指向函数的原型
4. 除了Function.prototype 和 Object.prototype两个特殊对象，他们是由引擎创造的，其他对象都是通过构造器 new 出来的