#面向對象之拷貝繼承
```
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的選項卡組件開發