JS继承三
来源:互联网 发布:360软件助手不见了 编辑:程序博客网 时间:2024/06/16 21:07
3,继承工具函数三
1
2
3
4
5
6
7
/**
* @param {Function} subCls
* @param {Function} superCls
*/
function
extend(subCls,superCls) {
subCls.prototype =
new
superCls();
}
父类,按原型方式写,即属性和方法都挂在原型上。
1
2
3
4
5
6
7
/**
* 父类Person
*/
function
Person(){}
Person.prototype.nationality =
'China'
;
Person.prototype.getNationality =
function
() {
return
this
.nationality;}
Person.prototype.setNationality =
function
(n) {
this
.nationality = n;}
子类继承与父类
1
2
function
Man() {}
extend(Man,Person);
继承父类的属性和方法后,再添加子类自有属性,方法
1
2
3
Man.prototype.name =
'jack'
;
Man.prototype.getName =
function
() {
return
this
.name;}
Man.prototype.setName =
function
(n) {
this
.name=n;}
测试如下,
1
2
3
var
m =
new
Man();
console.log(m);
console.log(m
instanceof
Person);
可以看到这种写类方式,继承方式完全采用原型机制。
4,继承工具函数四
这种方式是目前比较流行的,51ditu网站的开发就是按照这种模式的。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
/**
* @param {Function} subCls 子类
* @param {Function} superCls 父类
*/
function
extend(subCls,superCls) {
//暂存子类原型
var
sbp = subCls.prototype;
//重写子类原型--原型继承
subCls.prototype =
new
superCls();
//重写后一定要将constructor指回subCls
subCls.prototype.constructor = subCls;
//还原子类原型
for
(
var
atr
in
sbp) {
subCls.prototype[atr] = sbp[atr];
}
//暂存父类
subCls.supr = superCls;
}
按 构造函数+原型 方式写类,即属性挂在this上,方法挂在prototype上。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
/**
* 父类Person
*/
function
Person(nationality){
this
.nationality = nationality;
}
Person.prototype.getNationality =
function
() {
return
this
.nationality;}
Person.prototype.setNationality =
function
(n) {
this
.nationality = n;}
/**
* 子类Man
*/
function
Man(nationality,name) {
Man.supr.call(
this
,nationality);
//很重要的一句,调用父类构造器
this
.name = name;
}
Man.prototype.getName =
function
() {
return
this
.name;}
Man.prototype.setName =
function
(n) {
this
.name=n;}
注意子类Man中要显示的调用父类构造器已完成父类的属性/字段拷贝。
extend调用,创建Man的实例
1
2
3
4
5
extend(Man,Person);
var
m =
new
Man(
'USA'
,
'jack'
);
console.log(m);
m.setName(
'lily'
);
console.log(m.name);
- JS继承三
- 浅谈JS继承(三)
- js学习(三)继承
- JS继承三种方式
- js继承封装(三)
- js实现继承的三种方式
- js常见三种继承及其优缺点
- js的三种继承方法
- js继承的三种方式
- js对象的三种继承方式
- 关于JS中的继承(三)
- JS面向对象的继承三种方法:原型继承,原型冒充继承,复制继承
- js的三种继承方式及其优缺点
- JS中继承机制的三种方法
- js的三种继承方式及其优缺点
- 浅谈js函数继承模式之三:共享原型模式
- 三.继承
- JS继承--组合继承
- JS继承一
- 单例模式
- JS继承二
- “快排”笔记
- Android 类ListView下拉刷新控件实现 .
- JS继承三
- 开机自检程序在FAT32上做的检查与修复工作
- Asp.net 图片验证码示例
- java中调用web浏览器类库之jdic的配置及简单运用
- JS继承四
- DatePicker日期选择器年月日
- 一个面试题:截取字符串的函数,输入为一个字符串和字节数,输出为按字节截取的字符串
- hdu 2795 Billboard(线段树点区)
- php实战第二十四天