码迷,mamicode.com
首页 > 其他好文 > 详细

继承(构造函数+原型对象模拟实现继承)

时间:2020-02-28 20:47:42      阅读:58      评论:0      收藏:0      [点我收藏+]

标签:等于   利用   实例   bsp   共享   prot   运行   cal   构造   

继承

我们可以通过构造函数+原型对象模拟实现继承,被称为组合继承。
call()

调用这个函数, 并且修改函数运行时的this 指向

fun.call(thisArg, arg1, arg2, ...);call把父类的this指向子类

thisArg :当前调用函数this 的指向对象

arg1,arg2:传递的其他参数

利用构造函数实现子类的继承:

属性的继承

function Father (uname,age) {
            // this指向父类的实例对象
            this.uname = uname;
            this.age = age;
            // 只要把父类的this指向子类的this既可
        }
        function Son (uname, age,score) {
            // this指向子类构造函数
            // this.uname = uname;
            // this.age = age;
            // Father(uname,age);
            Father.call(this,uname,age);
            this.score = score;
        }
        Son.prototype.sing = function () {
            console.log(this.uname + ‘唱歌‘)
        }
        var obj = new Son(‘刘德华‘,22,99);
        console.log(obj.uname);
        console.log(obj.score);
        obj.sing();

方法的继承:

实现方法把父类的实例对象保存给子类的原型对象

一般情况下,对象的方法都在构造函数的原型对象中设置,通过构造函数无法继承父类方法。核心原理:

①将子类所共享的方法提取出来,让子类的prototype 原型对象= new 父类()  

②本质:子类原型对象等于是实例化父类,因为父类实例化之后另外开辟空间,就不会影响原来父类原型对象

③将子类的constructor指向原构造函数

把父类的实例对象赋值给子类的原型
function Father () {

        }
        Father.prototype.chang = function () {
            console.log(‘唱歌‘);
        }

        function Son () {

        }
        // Son.prototype = Father.prototype;
        Son.prototype = new Father();
        var obj = new Son();
        obj.chang();

        Son.prototype.score = function () {
            console.log(‘考试‘);
        }

        // obj.score();
        // console.log(Son.prototype);
        console.log(Father.prototype);

注意:一定要让Son指回构造函数

实现继承后,让Son指回原构造函数
实现继承后,让Son指回原构造函数

Son.prototype = new Father();

Son.prototype.constructor = Son;

总结:用构造函数实线属性继承,用原型对象实线方法继承

 

继承(构造函数+原型对象模拟实现继承)

标签:等于   利用   实例   bsp   共享   prot   运行   cal   构造   

原文地址:https://www.cnblogs.com/wtsx-2019/p/12378664.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!