JavaScript继承方式(2)
这篇开始写几个工具函数实现类的扩展。每个工具函数都是针对特定的写类方式(习惯)。这篇按照构造函数方式写类:属性(字段)和方法都挂在this上。以下分别提供了个类,分别作为父类和子类。
01
//? 父类Person
02
function
Person(nationality) {
03
????
this
.nationality = nationality;
04
????
this
.setNationality =
function
(n) {
this
.nationality=n;};
05
????
this
.getNationality =
function
() {
return
this
.nationality;};
06
}
07
08
// 类Man
09
function
Man(name) {
10
????
this
.name = name;
11
????
this
.setName =
function
(n){
this
.name=n;};
12
????
this
.getName =
function
(){
return
this
.name;};
13
}
?
1,继承工具函数一
1
/**
2
?
* @param {Function} subCls 子类
3
?
* @param {Function} superCls 父类
4
?
* @param {Object} param 父类构造参数
5
?
*/
6
function
extend(subCls,superCls,param) {
7
????
superCls.call(subCls.prototype,param);
8
}
使用如下
1
extend(Man,Person,
'China'
);
2
var
m =
new
Man(
'jack'
);
3
console.log(m.nationality);
//China
4
console.log(m.setNationality(
'Japan'
));
5
console.log(m.getNationality(
'Japan'
));
//Japan
输出可以看到Man继承了Person的属性及所有方法。这种继承方式于java的很不一样哦,
01
class
Animal {
02
????
int
legs;??
03
????
Animal(
int
l) {
04
????????
legs = l;
05
????
}
06
????
int
getLegs() {
07
????????
return
legs;
08
????
}
09
}
10
public
class
Person
extends
Animal{
11
????
//属性(字段)
12
????
String name;???
13
????
//构造方法(函数)
14
????
Person(
int
legs, String name) {
15
????????
super
(legs);
//调用父类构造器
16
????????
this
.name = name;
17
????
}??
18
????
//方法
19
????
String getName() {
20
????????
return
this
.name;
21
????
}
22
????
public
static
void
main(String[] args) {
23
????????
?24
????????
Person p =
new
Person(
2
,
"jack"
);???????
25
????????
System.out.println(p.legs);
26
????
}
27
}
Java中,子类Person在自身构造方法中调用父类构造方法super(legs),创建对象的时候直接将父类构造参数legs:2传进去,不仅仅只传自己的name:jack。上面JavaScript继承是在extend时传父类构造参数(extend函数的第三个参数),而不是在new Man时将父类构造参数传过去。好,模拟Java来实现下extend,这里巧妙的在子类上暂存了父类引用。
?
2,继承工具函数二
1
/**
2
?
* @param {Function} subCls
3
?
* @param {Function} superCls
4
?
*/
5
function extend(subCls,superCls) {?
6
????
subCls.supr = superCls;
7
}
还是以Person为父类,来实现子类Woman
1
function
Woman(nationality,name) {
2
????
Woman.supr.call(
this
,nationality);
//和java有点类似哦,在子类中调用父类构造器
3
????
this
.name = name;
4
????
this
.setName =
function
(n){
this
.name=n;};
5
????
this
.getName =
function
(){
return
this
.name;};
6
}<br>extend(Woman,Person);<br>
最后,创建对象的方式和java也类似,即new的时候同时将父类构造参数(nationality:Japan)传进去。
1
var
w =
new
Woman(
'Japan'
,
'lily'
);
2
console.log(w.nationality);
//Japan
3
w.setNationality(
'U.S.A'
);
4
console.log(w.getNationality());
//U.S.A