完美实现javascript继承

js的继承 主要是继承两个部分

一个是写在函数体内 通过 this 定义的方法和属性


代码

function parent(){
    this.name = 1;
    this.fuck = function(){
        
    }
}

继承这种方法需要在初始化的时候进行继承,我看许多其他的例子 是通过实例化之后 进行处理,我觉得这样写 就没有继承的样子了,而且子类无法进行属性和方法重写

所以我换了个方式


首先定义一个方法

function getParent(instance,parent,arg){
        instance.extend = parent;
        instance.extend.apply(instance,arg);//传递参数
        instance.extend = null;
        delete instance.extend;
    }

然后每次定义一个新的类,只需要在function体内的第一行,调用这个方法即可

完整的代码如下

function getParent(instance,parent,arg){
    instance.extend = parent;
    instance.extend.apply(instance,arg);//传递参数
    instance.extend = null;
    delete instance.extend;
}


function Parent(){
    this.name = '老王';
    this.daren = function(){
        console.log('我是'+this.name+',我要打人了');
    }
}

function Child(name){
    getParent(this,Parent,arguments);
    this.name = name;
}

var laoWang = new Parent();
laoWang.daren();

var xiaoMing = new Child('小明');
xiaoMing.daren();

var xiaoMing = new Child('小明的妹妹');
xiaoMing.daren();


运行结果





好上述的方法继承完毕,咱们还需要继承prototype中的方法,这个好办,咱们直接给Function写个扩展


Function.prototype.extend = function(parent){
    this.prototype = parent.prototype;
};



好完整的代码如下

function getParent(instance,parent,arg){
    instance.extend = parent;
    instance.extend.apply(instance,arg);//传递参数
    instance.extend = null;
    delete instance.extend;
}

Function.prototype.extend = function(parent){
    this.prototype = parent.prototype;
};

function Parent(){
    this.name = '老王';
    this.daren = function(){
        console.log('我是'+this.name+',我要打人了');
    }
}
Parent.prototype = {
    chuanmen:function(){
        console.log('我是'+this.name+',我去串门了');
    }
};

function Child(name){
    getParent(this,Parent,arguments);
    this.name = name;
}
Child.extend(Parent);

var laoWang = new Parent();
laoWang.daren();
laoWang.chuanmen();

var xiaoMing = new Child('小明');
xiaoMing.daren();
laoWang.chuanmen();

var xiaoMing = new Child('小明的妹妹');
xiaoMing.daren();
laoWang.chuanmen();

大家去试试看吧

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值