JS继承实现方式梳理

ES5中定义类

在ES5里面定义类，就是写一个方法，这个方法就是该类的构造函数，用来初始化实例对象

/**
         * @description: 定义Person类
         * @param {*} name
         * @param {*} age
         * @return {*}
         */        
        function Person(name,age){
            //定义属性
            this.name=name;
            this.age=age;
            //定义方法
            this.show=function(){
                alert(this.name)
            }
        }
        window.onload=function(){
            //实例化一个Person对象，并调用该实例的方法
            var p=new Person("张三",20)
            p.show();
        }

原型

1、js中一切皆对象，方法也是对象。
2、__proto__和prototype（[[Prototype]]就是_proto_）：
（1）普通对象：例如:{name:‘ls’}，普通对象身上只有__proto__属性，它默认指向Object类的原型对象
（2）实例化对象：实例化对象身上也是只有__proto__属性，它指向实例化它的类的原型对象
（3）方法对象：方法对象身上同时包含__proto__属性和prototype属性，其中__proto__指向一个方法ƒ () { [native code] }，prototype属性指向该方法的原型对象
3、 在原型对象中包含一个构造函数和所有实例化对象的公用属性和方法
4、proto叫做隐式原型，prototype叫做显示原型。
（1）js中创建一个函数的时候，函数身上就包含一个prototype属性，它指向这个函数的原型对象，原型对象里边包含着一个构造函数，还包含着所有实例化对象公用的属性和方法。用来实现基于原型的继承与属性的共享。
（2）在实例化一个对象的时候，它身上就包含一个proto属性，它指向用来实例化它的函数的原型对象。构成原型链，同样用于实现基于原型的继承。

			//实例化一个Person对象
            var p=new Person("张三",20)

            console.log("打印实例化对象的prototype：")
            console.log(p.prototype)//undefine,实例化对象身上是没有prototype属性的，只有__proto__属性

            console.log("打印实例化对象的__proto__：")
            console.log(p.__proto__)//ok,实例化对象的__proto__原型对象和该对象的构造函数的原型对象是一样的

            console.log("打印方法对象的prototype：")
            console.log(Person.prototype)//ok,方法的prototype原型对象和它所实例化的对象的__proto__原型对象是一样的

            console.log("打印方法对象的__proto__：")
            console.log(Person.__proto__)//ok

打印结果：

//验证实例化对象的__proto__和实例化该对象的类的原型对象
console.log(p.__proto__===Person.prototype)//true

原型链+对象冒充实现继承

使用组合模式的原因：如果只用原型链模式的话，虽然子类能够继承父类的构造函数里的的属性和方法，也能继承父类原型链上的属性和方法，但是，在实例化子类对象的时候无法给父类构造函数传参。如果只使用对象冒充的话，子类只能继承父类构造函数里面的属性和方法，而无法继承父类原型链上的属性和方法。

		/**
         * @description: 定义Person类
         * @param {*} name
         * @param {*} age
         * @return {*}
         */        
        function Person(name,age){
            //定义属性
            this.name=name;
            this.age=age;
            //定义方法
            this.show=function(){
                console.log(this.name)
            }
        }
        Person.prototype.showAge=function(){
            console.log(this.age)
        }
        /**
         * @description: 定义Femeal类
         * @param {*}
         * @return {*}
         */        
        function Femeal(name,age,ismarried){
            Person.call(this,name,age);//对象冒充实现继承父类私有属性和方法
            this.ismarried=ismarried;
        }
        Femeal.prototype=new Person();//实现继承父类原型上的属性和方法
        window.onload=function(){
            var f=new Femeal('张三',20,false);
            console.log(f.name)//张三
            f.showAge()//20
            console.log(f.ismarried)//false
        }