js的继承分为构造函数的继承和非构造函数继承;其中继承的还有call、apply、Object.create(),ie8以下不支持Object.create()。
子能访问父的公有属性和方法,父不能访问子的

首先开头讲讲prototype,__proto__,constructor的关系:
   1.prototype只有函数才有(包含__proto__,constructor)
   2.proto__(ie是没有这个属性的),constructor函数对象都有

1.call和apply继承

function Animal(){
            this.species = '动物';
            Animal.prototype.notice='i am parent';
        }
        function Dog(name,color){
            Animal.apply(this,arguments);
            this.name = name;
            this.color = color;
        }
        var dog1 = new Dog('小白','白色');
        console.log(dog1.species);
        

2.通过建立空的构造函数作为桥接实现继承

function extend1(p,s){
            function F(){};
            F.prototype = p.prototype;
            console.log(typeof F);//function
            var f = new F();
            console.log(typeof f);//object
            console.log(f.constructor);
            s.prototype = f; //此时s.prototype.constructor指向Anmial()构造函数,为了避免继承缭乱,所以要把s.prototype.constructor指回本身。
            s.prototype.constructor = s;
        }
        extend1(Animal,Dog);
        var dog2 = new Dog('小黑','黑色');
        console.log('dog2'+ dog2.notice);
        

3.通过深拷贝(针对对象、数组和函数,浅拷贝只是引用,内存不变)来继承
(深拷贝可以使用递归赋值、call、apply、$.extend(true,{},{}..))

 function extend2(p,s){
            var parent = p.prototype;
            var son = s.prototype;
            for(var i in parent){
                son[i] = parent[i];
            }
        }
        extend2(Animal,Dog);
        var dog3 = new Dog('小粉','粉色');
        console.log('dog3'+ dog3.notice);

敏小静
55 声望3 粉丝

前端工程师