关于原型与原型链，需要知道的

写在前面

遑遑之间已经毕业三年有余，毕业半年的时候我开始自学前端知识，在第一家公司实习并且呆了两年，基本的学习模式就是边工作边学习，以工作中遇到的难点、需要的新的技术栈向外发散学习，学了js、jquery、h5、微信小程序、vue。这样时间长了感觉自己并没有学到多少东西，反而基础显得不够扎实。第二家公司用的是angular，于是开始学习angular，虽然有了前面的学习基础，学起来也还算挺快，可是基础的不牢固总会成为后面更深度学习的桎梏。
嗯，从现在开始重新温故基础，望后来之人少走弯路。
故挑选重要知识整理成为博客，以备后用

关于对象

提到原型链不先从对象（大家的对象）说起。
javascript每创建一个对象时都会创建一个原型，指向它的原型对象。

var obj = {
	name: 'xiaoyu',
	sex: 'man'
}

当通过obj.xxx去访问对象的属性时，javascript引擎会先在这个对象上查找xxx属性，如果没有查到就会在上溯到Object.prototype对象查找，如果还是没找到就会返回一个undefined，这样就形成一个原型链：

obj ----> Object.prototype ---->  null

同样的创建一个数组：

arr = [1, 1, 1]

其原型链为：

arr ---->  Array.prototype -----> Object.prototype -----> null

创建一个函数时

function  foo(name) {
	this.name = name
	this.said = function() {
		return this.name
	}
}

这个函数的原型链为

foo ---->Function.prototype  -----> Object.prototype -----> null

其中，Function.prototype上定义了apply()，call()这些方法，因此所有的函数都可以调用这些方法。
同样的，如果我们在Function.prototype定义新的方法：如

Function.prototype.format = function(){
	...
}

那么，所有的函数就都可以调用的这个自定义的方法，Array.prototype 、Date.prototype 等同样如此。

注意：原型链越长，查找一个对象花费的时间就越长（原型链不宜过长）

构造函数

什么是构造函数呢？
拓展：构造函数的创建方式与普通函数并无区别，主要区别在于：

1. 构造函数命名上习惯首字母大写
2. 构造函数调用方式不一样，作用不同，构造函数用来创建新的实例对象
   普通调用方式：直接调用 foo()
   构造函数调用方式： 使用new关键字调用 new Foo()
3. 构造函数的函数名与类名相同：Foo( ) 这个构造函数，Foo 既是函数名，也是这个对象的类名
4. 内部用this 来构造属性和方法
5. 普通函数如果没有返回值，则为undefined，构造函数会马上创建一个新对象，并将该新对象作为返回值返回
   构造函数实例如下：

function Person(name,job,age)
{
     this.name=name;
     this.job=job;
     this.age=age;
     this.sayHi = function(){
        return this.job;
     }
 } 

可以用new关键字调用这个函数

const person = new Person('xiaoyu','web','25')
person.name; // xiaoyu
person.sayHi(); // web

返回的person是一个对像-----它绑定的this指向新创建的对象，并默认返回this（这个对象），也就是说，不需要在最后写return this;
那么，新创建的person的原型链是

person ---->  Person.prototype -----Object.prototype -----> null

person 的原型指向构造函数Person的原型，如果后续在创建person1、person2同样指向Person的原型
用new Person()创建的对象还从原型上获得了一个constructor属性，它指向函数Person本身：

person.constructor === Person.prototype.constructor; // true
Person.prototype.constructor === Person; // true

需要注意的一点；

const person = new Person('xiaoyu','web','25'),
	  person1 = new Person('xiaoyuan','word','25');
person.sayHi === person1.sayHi  //false
person.sayHi() === person1.sayHi() //false

person和person1的sayHi函数是两个不同的函数，虽然函数名称和内容都是一样的;

修改一下写法：

function Person(name,job,age)
{
     this.name=name;
     this.job=job;
     this.age=age;
 } 
Person.prototype.sayHi = function(){
     return this.job;
}
const person = new Person('xiaoyu','web','25'),
	  person1 = new Person('xiaoyuan','word','25');
person.sayHi === person1.sayHi  //ture
person.sayHi() === person1.sayHi() //false

此时，sayHi这个函数在person、person1共同指向的原型上，也就是Person.prototype，所以是相等的，
这样，我们使用new Person()创建新的对象时就共享了一个函数、可以节省很多内存。

注意：调用构造函数一定要用 new，否则可能报各种各样的错误。