javascipt中的继承(js继承的几种方法)
在生活中,很多人可能想了解和弄清楚javascript 继承的几种写法总结的相关问题?那么关于javascript中的继承的答案我来给大家详细解答下。
js类的常用写法
1. prototype 继承父类
2. 修正 constructor
示例:
function Fn(name){
this.name=name;
}
Fn.prototype.getName=function(){
return this.name;
}
//继承
function SubFn(name){
Fn.call(this,name); //传递参数
}
SubFn.prototype=new Fn();
SubFn.prototype.constructor=SubFn;
var test=new SubFn("全栈前端");
test.getName();
//"全栈前端"
注:缺点是构造函数会执行两次
js类的终极写法
1. 调用父类构造函数
2. 继承-复制父类的 prototype
//封装方法:返回父类的 prototype 的复制
function inheritObject(o){
function Fn(){};
Fn.prototype=o.prototype;
return new Fn();
}
3. 修正 constructor
示例:
function Fn(name){
this.name=name;
}
Fn.prototype.getName=function(){
return this.name;
}
//继承
function SubFn(name){
Fn.call(this,name);
}
SubFn.prototype=inheritObject(Fn);
SubFn.prototype.constructor=SubFn;
var test=new SubFn("全栈前端");
test.getName();
//"全栈前端"
多继承
同上,js的多继承靠复制多个父类的原型对象实现。
//单继承,多继承皆可
function inheritObject(){
var
len=arguments.length,
extendPrototype={};
for(var i=0;i<len;i++){
var proto=arguments[i].prototype;
for(var j in proto){
extendPrototype[j]=proto[j];
}
}
return extendPrototype;
}
注:同名属性方法会被覆盖
文章到这里结束,后续更多干货,关注后可以收到文章推送
【关注一下不迷路~】
温馨提示:通过以上关于javascript 继承的几种写法总结内容介绍后,相信大家有新的了解,更希望可以对你有所帮助。