#面向对象之拷贝继承
```
var a = {
name: '小明'
};
var b = a;
b.name = '小强';
alert(a.name); // 小强
```
```
var a = {
name: '小明'
};
var b = {};
for(var attr in a){
b[attr] = a[attr];
}
b.name = '小强';
alert(a.name); // 小明
```
```
var a = {
name: '小明'
};
var b = {};
extend(b, a);
b.name = '小强';
alert(a.name); // 小明
function extend(obj1, obj2) {
for (var attr in obj2) {
obj1[attr] = obj2[attr];
}
}
```
方法的继承:for in 拷贝继承(jquery也是采用拷贝继承 extend)
```
function CreatePerson(name, sex){ // 父类
this.name = name;
this.sex = sex;
}
CreatePerson.prototype.showName = function(){
alert(this.name);
};
var p1 = new CreatePerson('Mary', '女');
p1.showName(); // 小明
function CreateStar(name, sex, job){ // 子类
CreatePerson.call(this, name, sex);
this.job = job;
}
// CreateStar.prototype = CreatePerson.prototype;
extend(CreateStar.prototype, CreatePerson.prototype);
CreateStar.prototype.showSex = function(){
alert(this.sex);
};
var p2 = new CreateStar('黄晓明', '男', '演员');
p2.showName(); // 黄晓明
p1.showSex(); // 控制台报错:Uncaught TypeError: p1.showSex is not a function,这样说明就解决了面向对象继承引用的问题
p2.showSex(); // 未能弹出
function extend(obj1, obj2) {
for (var attr in obj2) {
obj1[attr] = obj2[attr];
}
}
```
上面是利用了函数的一个特性:只能被重新赋值,不能被修改。比如数组,既可以被重新赋值又可以被修改,如下:
```
var a = [1,2,3];
var b = a;
b.push(4); // 给b数组添加一个元素,说明b数组被修改了
alert(a); // 1,2,3,4 说明a数组也被修改了
```
```
var a = [1,2,3];
var b = a;
b = [1,2,3,4]; // 对b数组重新赋值
alert(a); // 1,2,3
```
- 01 JS面向对象及组件开发
- 02 传统的过程式编写选项卡
- 03 用面向对象封装通用选项卡
- 04 控制多个选项卡自动播放
- 05 用面向对象编写拖拽
- 06 JS面向对象及组件开发
- 07 hasOwnProperty和constructor的使用
- 08 instanceof运算符的使用
- 09 利用toString做类型判断
- 10 什么是面向对象的继承
- 11 面向对象之拷贝继承
- 12 编写继承的拖拽
- 13 继承的其他形式之类式继承
- 14 继承的其他形式之原型继承
- 15 组件开发是什么
- 16 给拖拽组件配置不同参数
- 17 封装弹框组件
- 18 使用对象标记已弹出弹框
- 19 复杂组件开发之自定义事件
- 20 原生JS实现自定义事件
- 21 自定义事件实例
- 22 基于JQ的选项卡组件开发