0


js的继承的方式

1.对象冒充继承
使用 bind,call,apply 解决构造函数属性的继承
缺点:不能继承原型上的属性和方法

//-------------父类-------------functionPerson(name, age, sex){this.name = name;this.age = age;this.sex = sex;}Person.prototype.run=function(){
            console.log(`我${this.name},爱跑步!`);}//-------------子类-------------functionStudent(sNo, name, age, sex){//对象的冒充// bind,call,applyPerson.call(this, name, age, sex);//后面this.sNo = sNo;}var s1 =newStudent(10001,"刘德华",20,"男");
        console.log(s1);
        s1.run()

2.原型链继承
缺点:不能让构造函数的属性,初始化

//-------------父类-------------functionPerson(name, age){this.name = name;this.age = age;}Person.prototype.name ="刘德海";Person.prototype.run=function(){alert(123);}//-------------子类-------------functionStudent(){}//我只实现了原型继承,构造函数内部的属性,是无法设置初始值Student.prototype =newPerson();var s2 =newStudent();
      console.log(s2);// s2.run()
      console.log(s2.address);

3.组合继承(对象冒充+原型链继承)
缺点:原型中会有多余的属性,并且是undefined

//-------------父类-------------functionPerson(name, age){this.name = name;this.age = age;}Person.prototype.name ="刘德海";Person.prototype.run=function(){alert(123);}//-------------子类-------------functionStudent(){}//我只实现了原型继承,构造函数内部的属性,是无法设置初始值Student.prototype =newPerson();var s2 =newStudent();
      console.log(s2);// s2.run()
      console.log(s2.address);

4.寄生组合继承
寄生继承+对象冒充继承=寄生组合继承
寄生组合继承 Object.create(base.prototype);

// 寄生继承,解决原型问题// 寄生继承+对象冒充继承=寄生组合继承functioninherit_proto(base, child){// 1.创建父类原型,根据父类的原型,创建一个新的对象var basePrototype = Object.create(base.prototype);// 2.创建的原型对象,它的构造还是指向原来的构造函数// 我们就修改子类的构造器
            basePrototype.constructor = child
            // 3.让自己拥有父类的原型
            child.prototype = basePrototype
            console.log(basePrototype);}// 父类functionPerson(name, age, sex){this.name = name
            this.age = age
            this.sex = sex
        }Person.prototype.sayHi=function(){}// 子类functionStudent(sNo, name, age, sex){Person.call(this, name, age, sex)this.sNo = sNo
        }// 调用方法inherit_proto(Person, Student)var stu =newStudent("1001","小易",22,"女")
        console.log(stu);

5.ES6的类+extends继承

classPerson{constructor(name, age){this.name = name
                this.age = age
            }run(){return`跑步`}}classStudentextendsPerson{constructor(name, age, sex){super(name, age)this.sex = sex
            }// 重写:子类重写父类的方法run(){return`哈哈哈哈哈哈或`}}var p=newStudent("小易",22,"女")
        console.log(p.run());
        console.log(p);

本文转载自: https://blog.csdn.net/qq_46372132/article/details/133799103
版权归原作者 qq_46372132 所有, 如有侵权,请联系我们删除。

“js的继承的方式”的评论:

还没有评论