JavaScript的原型、原型链与继承

函数对象

所有的引用类型（函数，数组，对象）都有__proto__属性（隐式原型）
所有的函数都拥有prototype属性（原型）
原型对象：拥有prototype属性的对象，在定义函数时就被创建

为什么需要原型

构造器创建对象的时候, 实际上会有成员重复
如果使用 构造器 this.方法名 = function … 方式创建对象. 那么每一个对象对应的方法就会重复。
在js中就有解决该问题的方法那就是原型。
每一个函数 都有一个属性 prototype 该属性指向一个对象。
每一个由该函数作为构造器创建的对象，都会默认连接到该对象上。如果访问对象的方法，而对象没有定义，就在在函数的prototype所表示的对象中去寻找。

__proto__和prototype之间的关系

早期的浏览器不支持__proto__,火狐最开始使用了该属性，但是并非标准
现在基本的新版本浏览器都支持该属性
访问：
使用构造函数就使用prototype属性访问原型
使用实例对象，就使用 非标准的__proto__属性访问

继承

什么是继承

JavaScript中继承是一种允许我们在已有类的基础上创建新类的机制；它为子类提供了灵活性，可以重用父类的方法和变量。子类可以使用父类的所有功能，并且对这些功能进行扩展。继承的过程，就是从一般到特殊的过程。

原型与实例对象

在js中，方法定义在原型对象中，而属性定义在对象中，调用方法的时候，实例对象本身是没有成员的，但是依旧可以调用该方法，就好像这个方法就是该实例对象的一样，因此可以认为实例对象继承自原型对象
任何一个实例，都是继承其原型对象的

为什么需要继承

编程的发展的需要，我认为是可以减少代码的重复性，提高程序运行的效率。

属性访问原则

1.对象在调用方法或者访问属性的时候，首先是在当前的对象中去查找，如果当前对象有则直接返回并停止查找
2.如果当前对象没有该属性则在其原型对象中去查找，如果有就返回，并停止查找
3.如果还没找到就会在该对象的原型对象的原型对象中去找如此往复。。。。。。
4.最终会找到object.prototype上，如果最终还是没找到则返回undefined。

如果去修改原型对象中的属性值会怎么样？

如果给当前对象的原型提供的属性赋值，实际上是给当前对象添加了该属性的新成员并不会对对象中的成员进行修改。

继承的方法

 let a={name:'chunchun'}
    let b={sex:'男'}
    //利用简单的赋值，可以将一个对象中的成员加到另一个对象中
    a.sex=b.sex;
    console.log(a);

还可以使用混入：

// 考虑需要执行, 写函数即可
	// 由于将 一个 对象混入到 另一个对象. 所以有两个参数
	function __mix__ ( obj, obj1 ) {
		//通过循环来遍历，获得obj1中的所有成员
		for ( var  k in obj1 ) {
			obj[ k ] = obj1[ k ];
		}
	}

混合式继承

混合就是将多个对象的功能混合到一起，加到构造函数的原型对象中，那么该构造函数创建的实例就继承了多个对象的功能

 var Person={
             
             sayHello:function(){
                 console.log('我是'+this.name+'今年'+this.age);
             }
         } 
         function Student(name,age){//student构造函数
             this.name=name;
             this.age=age;
         }
         Student.prototype.extend=function(obj){
             for(var k in obj){
                 this[k]=obj[k];
             }
         }
 
         var s1=new Student('lilei',18);//根据Student构造函数创建一个实例对象s1.
         var s2=new Student('lllli',18);//根据Student构造函数创建一个实例对象s2.
         //这样就是Student构造函数继承了Person对象。所有Student构造函数创建的实例都要Pserson对象的方法
         Student.prototype.extend(Person); 
         //这样就是Student构造函数的实例s1继承了Person对象。其他Student构造函数创建的实例都没有Pserson对象的方法
         // s1.extend(Person);
         s1.sayHello();
         s2.sayHello();

ES5中的object.create 继承的最经典的结构

   function a(){}
   function b(){}
   b.prototype=new a()

语法:
新对象 Object.create( 原对象 );

原型链

在js中对象都有原型
构造函数 person创建的对象a有原型person.prototype
person.prototypes是对象，它也有原型

1. Person.prototype 是 实例 p 的原型对象, 使用 proto 可以访问对象的原型对象
2. Person.prototype 的 原型对象是 Person.prototype.proto
3. Person.prototype.proto 里的 constructor 是 Object. 所以Person.prototype.proto 就是 Object.prototype
4. Object.prototype.proto 是 null. 因此表明 Object.prototype 就是最顶层.

思维导图：