前置
画原型图软件：gliff
一、prototype（原型）
在一切开始之前回顾一下类、实例、prototype、__proto__的关系
function Person(nick, age){
this.nick = nick;
this.age = age;//这里并不是函数的属性，而是定义的实例this，new个空对象后会对this（实质上也是对这个空对象）进行初始化，
//函数返回赋值给p1
}
Person.prototype.sayName = function(){
console.log(this.nick);
}//在函数中的prototype增加新的公共属性
var p1 = new Person();
p1.sayName(); //通过实例对象p1去调用
image
总结：
我们通过函数定义了类Person，类（函数）自动获得属性prototype
每个类的实例都会有一个内部属性proto，指向类的prototype属性
二、原型链
先看一个有趣的现象：
我们定义一个数组，调用其valueOf方法
[1, 2, 3].valueOf(); // [1, 2, 3]
很奇怪的是我们在数组的类型Array中并不能找到valueOf的定义，根据之前的理论那么极有可能定义在这个实例的proto（也就是函数（类）Array的prototype（原型））中用于实例共享方法，查看一下
image
一个有趣的现象是我们在Object实例的proto属性（也就是Object的prototype属性）中找到了找到了这个方法
image
那么我们可以知道一些现象，以下图来做解释：
image
- |新对象： 用字面量的方式写一个数组[1,2,3](数组实质也是一个对象），实际上是创建一个实例，即一个new Array（new 了一个对象），当然内部也会自动添加一个属性proto
- 函数： 而这个数组[1,2,3]就是函数Array创建的，proto指向函数Array内部中自动添加属性prototype。这个prototype里有很多方法，你只要：函数名.prototype 就会出现很多方法
- 基本对象的函数：由于任何类（函数）的prototype本质上都是个类（对象）Object的实例（生成的一个对象），所以prototype也和其它实例一样也有个proto内部属性，指向其类型Object的prototype。而此时，函数Array的prototype中的proto同样指向object.prototype。
此时，函数Array.prototype.proto=object.prototype
总结：
（1）查找思路（一个对象的寻址过程）：
new的对象自身的proto——函数原型.proto——原型的原型。
层层向上查找，最后还没有就返回undefined
（2）【重点了解】原型链的指向：
new对象——类函数（函数的原型对象）——function函数（任何函数都是由function函数创建）——object函数（任何含有{key：value}的基本对象都是object函数创建）
（3）节选于若愚老师的方法（真的很有效哦反正我是会了）
几句话能解释一切关于原型方面的问题：
- 当 new 一个函数的时候会创建一个对象，『函数.prototype』 === 『被创建对象.proto』
- 一切函数都是由 Function 这个函数创建的，所以『Function.prototype === 被创建的函数.proto』
- 一切函数的原型对象都是由 Object 这个函数创建的，所以『Object.prototype === 一切函数.prototype.proto』
三、instanceof 对象类型判断
instanceof操作符，专门用来判断对象，判断一个对象是不是某个类型的实例
1 instanceof Number; // false
[1, 2, 3] instanceof Array; //true
可以看到[1, 2, 3]是类型Array的实例
[1, 2, 3] instanceof Object; //true
这个结果有些匪夷所思，怎么又是Array的实例，又是Object的实例，这不是乱套了？其实这个现象在日常生活中很常见其实，比如我们有两种类型：类人猿、动物
我们发现黑猩猩既是类人猿的物种（实例），也是动物类型（实例）
是不是悟出其中的门道了，类人猿是动物的一种，也就是说我们的两个类型之间有一种父子关系。这就是传说中的继承，JavaScript正是通过原型链实现继承机制的
另外：
不是对象的数据类型，可以通过new一个对象进行包装成为一个包装对象
如b=1，是无法调用任何属性的，因为1不是对象
那么new Number(1)就将一个数字包装成一个对象
网友评论