原型及原型链

相信好多人对JS原型以及原型链都有过懵逼的状态，我也一样。但如果稍微弄懂一些或是有点儿思路的时候，会感觉原型链也是非常有意思的。

• 不多说，先来张图捋一捋一下它们之间的关系

原型链关系图

• 看完图是否还觉的晕都转向呢？如果还觉得懵圈，没关系，请跟我一起往下走。

• 请阅读和思考以下几句话

1. 所有的实例都是对象数据类型的；
2. 每一个函数数据类型（函数、类）都天生自带一个prototype属性，prototype的属性值是一个对象数据类型的；
3. prototype 属性中天生自带一个constructor属性，属性值是当前原型所属的类；
4. 每一个对象数据类型值（对象、数组、arguments...）天生自带一个proto属性，属性值指向当前实例所属类的原型；
5. 所有的函数数据类型（普通函数、类（内置的、自定义））都是Function的一个实例；Function是所有函数的基类；
6. 所有的对象数据类型（实例、prototype、对象）都是Object的一个实例；Object是所有对象数据类型的基类；

• 读完这些是否焕然大悟呢？那么就让我们带着自己的理解做几道关于原型链的面试题吧

• 题一：

var A = function() {};
A.prototype.n = 1;
var b = new A();
A.prototype = {
   n: 2,
   m: 3
}
var c = new A();
console.log(b.n);//1
console.log(b.m);// undefined
console.log(c.n);//2
console.log(c.m)//3

• 题二

var F = function() {};
Object.prototype.a = function() {
    console.log('a');
};
Function.prototype.b = function() {
    console.log('b');
}
var f = new F();
f.a();//a
f.b();// f.b is not a function
F.a();//a
F.b();//b

• 题三

function Person(name) {
 this.name = name
}
let p = new Person('Tom');
//问题1：1. p.__proto__等于什么？
     //Person.prototype
//问题2：Person.__proto__等于什么？
   //Function.prototype
console.log(p)//Person {name: "Tom"}
console.log(p.__proto__)//{constructor: ƒ}

• 题四

var foo = {},
F = function(){};
Object.prototype.a = 'value a';
Function.prototype.b = 'value b';
console.log(foo.a);//value a
console.log(foo.b);//undefined
console.log(F.a);//value a
console.log(F.b);//value b

总结：

• A:
  构造函数解决了实例私有属性问题；
  原型模式解决了属性的公有问题；

• B: 原型模式：

1. 每一个函数数据类型（函数、类）都天生自带一个prototype属性，prototype的属性值是一个对象数据类型的；
2. prototype 属性中天生自带一个constructor属性，属性值是当前原型所属的类；
3. 每一个对象数据类型值（对象、数组、arguments...）天生自带一个proto属性，属性值指向当前实例所属类的原型；