蓝本和蓝本链
序言
蓝本和承继是js中十分关键的三大基本概念。深入细致介绍蓝本，也是努力学习承继的大前提。
先上看呵呵缺省、示例、蓝本第一类间的亲密关系
「示例与蓝本第一类间有间接的联络，但示例与缺省间没。」
三个概念
js分成「表达式第一类」和「一般第一类」，每一第一类都有__proto__优点，但多于表达式第一类且「非斜线表达式」才有prototype优点。
优点__proto__是三个第一类【示例透过__proto__显式原型对准其蓝本第一类】，它有三个优点，constructor和__proto__；蓝本第一类有三个预设的constructor优点，用作历史记录示例是由别的缺省建立；
蓝本
认知蓝本
建立三个表达式(非斜线表达式)，就会依照某一的准则为那个表达式建立三个 prototype 优点（对准蓝本第一类）。预设情况下，大部份蓝本第一类手动赢得三个名叫 constructor 的优点，千孔与之关连的缺省。在自订缺省时，原型第一类预设只会赢得 constructor 优点，其它的大部份形式都承继自Object。每天初始化缺省建立三个新示例，那个示例的外部[[Prototype]]操作符就会被表达式为缺省的蓝本第一类。JAVA中没出访那个[[Prototype]]优点的国际标准形式，但 Firefox、Safari 和 Chrome会在每一第一类上曝露__proto__优点，透过那个优点能出访第一类的蓝本。
function Person() {}
// 表明：name,age,job那些本不如果放到蓝本上，而已为的是表明优点搜寻监督机制
Person.prototype.name = “Nicholas”;
Person.prototype.age = 29;
Person.prototype.job = “Software Engineer”;
Person.prototype.sayName = function() {
console.log(this.name);
};
let person1 = new Person()
let person2 = new Person()
// 声明之后，缺省就有了三个与之关连的蓝本第一类
console.log(Object.prototype.toString.call(Person.prototype)) // [object Object]
console.log(Person.prototype) // {constructor: ƒ}
// 缺省有三个 prototype 优点引用其蓝本第一类，而那个蓝本对象也有三个constructor 优点，引用那个缺省
// 换句话说，两者循环引用
console.log(Person.prototype.constructor === Person); // true
// 缺省、蓝本第一类和示例是 3 个完全不同的第一类
console.log(person1 !== Person); // true
console.log(person1 !== Person.prototype); // true
console.log(Person.prototype !== Person); // true
// 示例透过__proto__链接到蓝本第一类，它实际上对准隐藏优点[[Prototype]]
// 缺省透过 prototype 优点链接到蓝本第一类，示例与缺省没间接联络，与蓝本第一类有间接联络，后面将会画图再次表明那个问题
console.log(person1.__proto__ === Person.prototype); // true
conosle.log(person1.__proto__.constructor === Person); // true
// 同三个缺省建立的三个示例，共享同三个蓝本第一类
console.log(person1.__proto__ === person2.__proto__); // true
// Object.getPrototypeOf()，返回参数的外部优点[[Prototype]
如下图：
Person.prototype 对准蓝本第一类，而 Person.prototype.contructor 千孔 Person 缺省。蓝本第一类包含 constructor 优点和其它后来添加的优点。Person 的三个示例 person1 和 person2 都多于三个外部优点千孔 Person.prototype，而且两者都与缺省没间接联络。
蓝本层级
在透过第一类出访优点时，会依照那个优点的名称开始搜索。搜索开始于第一类示例本身。如果在那个示例上发现了给定的名称，则返回该名称对应的值。如果没找到那个优点，则搜索会沿着操作符进入蓝本第一类，然后在蓝本第一类上找到优点后，再返回对应的值。因此，在初始化 person1.sayName()时，会发生两步搜索。首先，JavaScript 引擎会问：“person1 示例有 sayName 优点吗？”答案是没。然后，继续搜索并问：“person1 的蓝本有 sayName 优点吗？”答案是有。于是就返回了保存在蓝本上的那个表达式。在初始化 person2.sayName()时，会发生同样的搜索过程，而且也会返回相同的结果。这就是蓝本用作在多个第一类示例间共享优点和形式的原理。
蓝本链
重温呵呵缺省、蓝本和示例的亲密关系：每一缺省都有三个prototype对准蓝本第一类，蓝本第一类有三个constructor优点千孔缺省，而示例有三个外部指针对准蓝本。如果蓝本是另三个类型的示例呢？那就意味着那个蓝本本身有三个外部操作符对准另三个蓝本，相应地另三个蓝本也有三个操作符对准另三个缺省。这样就在示例和蓝本间构造了一条蓝本链。这就是蓝本链的基本构想。
function SuperType() {
this.property = true;
}
SuperType.prototype.getSuperValue = function () {
return this.property;
};
function SubType() {
this.subproperty = false;
}
// 承继 SuperType
SubType.prototype = new SuperType();
SubType.prototype.getSubValue = function () {
return this.subproperty;
};
let instance = new SubType();
console.log(instance.getSuperValue()); // true
SuperType 和 SubType这三个类型分别定义了三个优点和三个形式。这三个类型的主要区别是 SubType 透过建立 SuperType 的示例并将其表达式给自己的蓝本 SubTtype. prototype 实现了对 SuperType 的承继。那个表达式重写了 SubType 最初的蓝本，将其替换为SuperType 的示例。这意味着 SuperType 示例能出访的大部份优点和形式也会存在于 SubType. prototype。这样实现承继之后，代码紧接着又给 SubType.prototype，也就是那个 SuperType 的示例添加了三个新形式。最后又建立了 SubType 的实例并初始化了它承继的 getSuperValue()形式。
模拟new
使用new时，到底发生了什么？
建立三个空第一类，作为将要返回的第一类示例将那个空第一类的蓝本，对准了缺省的prototype优点将那个空第一类表达式给表达式外部的this关键字开始执行缺省外部的代码如果缺省返回三个第一类，那么就间接返回该第一类，否则返回建立的第一类也就是说，缺省外部，this指的是三个新生成的空第一类，大部份针对this的操作，都会发生在那个空第一类上。缺省之所以叫“缺省”，就是说那个表达式的目的，就是操作三个空第一类（即this第一类），将其“构造”为需要的样子。
function simulateNew() {
let newObject = null,result = null,
constructor = Array.prototype.shift.call(arguments)
// 参数判断
if (typeof constructor !== function) {
console.error(type error)
return
}
// 新建三个空第一类，第一类的蓝本为缺省的 prototype 第一类
newObject = Object.create(constructor.prototype)
// 将 this 对准新建第一类，并执行表达式
result = constructor.apply(newObject, arguments)
// 判断返回第一类
const flag =
result && (typeof result === object || typeof result === function)
// 判断返回结果
return flag ? result : newObject
}
/** 测试如下 */
function Person(name) {
this.name = name
}
const p1 = new Person(“p1”)
const p2 = simulateNew(Person, p2)
console.log(“p1”,p1, p1 instanceof Person);
console.log(p2, p2, p2 instanceof Person)
模拟instanceof
instanceof 主要的实现原理就是 「只要右边变量的」 prototype 「在左边变量的蓝本链上即可」。因此，instanceof 在搜寻的过程中会遍历左边变量的蓝本链，直到找到右边变量的 prototype，如果搜寻失败，则会返回 false，告诉我们左边变量并非是右边变量的示例。
function instanceOf(leftVaule, rightVaule) {
let rightProto = rightVaule.prototype; // 取右表达式的 prototype 值
leftVaule = leftVaule.__proto__; // 取左表达式的__proto__值
while (true) {
if (leftVaule === null) {
return false;
}
if (leftVaule === rightProto) {
return true;
}
leftVaule = leftVaule.__proto__
}
}
总结
出访第一类的三个优点，先在自身搜寻，如果没，会出访第一类的__proto__，沿着蓝本链搜寻，一直找到Object.prototype.__proto__。每一表达式都有prototype优点，会对准表达式的蓝本第一类。大部份表达式的蓝本第一类的__proto__，会对准Object.prototype。蓝本链的尽头是Object.prototype.__proto__，为null。有关JavaScript的蓝本链的分享就到这里了，如果阅读完本篇文章后，你对JavaScript的蓝本链有了更深一步地认知和认识的话，欢迎给笔者点赞鼓励 ！若有不对的地方也希望大家多多指正，一起进步~
