JS OOP 中的三种继承方法:
很多读者关于js opp的继承比较模糊,本文总结了oop中的三种继承方法,以助于读者进行区分。
<继承使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法。(继承的两方,发生在两个类之间)>
一、通过object实现继承
1:定义父类
function Parent(){}
2:定义子类
funtion Son(){}
3:通过原型给Object对象添加一个扩展方法。
Object.prototype.customExtend = function(parObj){
for(var i in parObj){
// 通过for-in循环,把父类的所有属性方法,赋值给自己
this[i] = parObj[i];
}
}
4:子类对象调用扩展方法
Son.customExtend(Parent);
// 1.定义父类
function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
alert(this.name+":"+this.age);
}
}
// 2.定义子类
function Student(no){
this.no = no;
this.add = function(a,b){
alert(a+b);
}
}
function Programmer(lang){
this.lang = lang;
this.codding = function(){
alert("我爱敲代码!敲代码使我快乐!");
}
}
// 3.通过原型给Object对象添加一个扩展方法。
Object.prototype.customExtend = function(parObj){
for(var i in parObj){
// 通过for-in循环,把父类的所有属性方法,赋值给自己
this[i] = parObj[i];
}
} var p = new Person("小明","18");
var s = new Student("0001");
s.customExtend(p);//现在s继承了p的所有属性和方法。
console.log(s) var pro = new Programmer("JavaScript");
pro.customExtend(p);
console.log(pro)
二、使用call和apply进行继承
首先,了解一下call和apply:通过函数名调用方法,强行将函数中的this指向某个对象;
call写法: func.call(func的this指向的obj,参数1,参数2...);
apply写法: func.apply(func的this指向的obj,[参数1,参数2...]);
call与apply的唯一区别:在于接收func函数的参数方式不同。call采用直接写多个参数的方式,而apply采用是一个数组封装所有参数。
② 使用call和apply
1:定义父类
funtion Parent(){}
2:定义子类
function Son(){}
3:在子类中通过call方法或者apply方法去调用父类。
function Son(){
Parent.call(this,....);
}
function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
alert("我叫:"+this.name+";今年:"+this.age+"岁");
}
}
function Student(no,stuName,stuAge){ this.no = no;
Person.call(this,stuName,stuAge);
}
var stu = new Student(12,"zhangsan",14);
stu.say(); console.log(stu)
三、使用原型继承
③ 使用原型继承
1:定义父类
function Parent(){}
2:定义子类
function Son(){}
3:把在子类对象的原型对象声明为父类的实例。
Son.prototype = new Parent();
function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
alert("我叫:"+this.name+";今年:"+this.age+"岁");
}
}
function Student(no){
this.no = no;
} Student.prototype = new Person("张三",14) var stu = new Student(12); stu.say(); console.log(stu)
希望以上代码能够帮助读者解决继承的问题!