753
麵向對象理論
麵向對象編程舉例
- 初步實現（麵向過程的方式）
- 函數封裝
- 對象封裝
創建對象的方式
- 字麵量
js var obj = { key: value, key1: value1 };//$().css({}) //$.ajax({}) //複用性差2. 內置構造函數js var obj = new Object(); obj.key = value; obj.key1 = value1;
//複用性差
3. 自定義構造函數
```js
function Person(){
this.key = value;
this.key1 = value1;
}
var p = new Person();
構造函數
什麼是構造函數
構造函數就是一個函數，他和普通函數的區別在於，他一般被用來初始化對象！！
構造函數的特點
- 首字母大寫
- 一般和new關鍵字一起使用
- 不需要寫return語句，默認返回new創建出來的對象
構造函數的執行過程
- 使用new關鍵字創建對象
- 調用構造函數，將構造函數中的this指向new創建出來的對象
- 執行構造函數中的代碼，通過this為創建的對象新增屬性和方法
- 默認的返回了new創建出來的對象
構造函數的注意事項
-
如果手動給構造函數寫了return語句
- 如果return的是值類型的數據，對默認返回值不會有任何影響
- 如果return的是引用類型的數據，則返回的是該引用類型的數據
-
如果把構造函數當做普通函數來調用
- this會指向window
- 返回值會和普通函數一樣
構造函數寫法存在的問題
function Person(){
this.name = "";
//每次創建對象都會重新執行一次函數聲明，也就是創建一個新的函數
//每個對象中都會有這麼一個方法，但是每個方法的功能都是一樣的，所以造成資源浪費
this.sayHello = function(){
};
}
//解決方案：
// 將方法的聲明提出來放到構造函數外麵，每次給對象的方法賦值的時候，直接將外麵聲明好的函數直接賦值給對象的方法，這樣，所有的對象就都共享同一個方法了
function sayHello(){}
funciton Person(){
this.name = "";
this.sayHello = sayHello;
}
//這麼解決會造成全局變量汙染以及代碼結構混亂的問題
原型
原型的概念
構造函數在創建出來的時候，係統會默認的幫構造函數創建並且關聯一個空對象，這個對象就是原型
原型的作用
在原型中的所有的屬性和方法，可以被和其關聯的構造函數創建出來的所有的對象共享！
原型的訪問方式
- 構造函數.prototype
- 對象.__proto__ (有兼容性問題)
原型的使用方式
- 利用對象的動態特性，給係統創建好的默認的原型中新增屬性和方法
js Person.prototype.name = ""; - 直接給構造函數.prototype屬性賦值一個新的對象！
原型的使用注意事項
- 一般將需要共享的內容放在原型當中，對象特有的東西放在對象本身中
- 使用對象.屬性獲取對象的屬性的時候，會先在對象本身進行查找，如果有就使用，如果沒有，就會去原型中進行查找
- 使用對象.屬性 = 值，給對象的屬性賦值的時候，會直接在直接在對象本身進行查找，如果有，就修改，如果沒有，就新增這個屬性
- 在使用構造函數.prototype=新的對象的時候， 賦值之前創建的對象和賦值之後創建的對象的原型不一樣
麵向對象的三大特性
- 封裝：將功能的具體實現封裝在對象內部，隻對外界暴露指定的接口，外界在使用的時候，隻需要關心接口如何使用，而不需要關心對象內部功能的具體實現，這就是封裝 （ATM，電腦）
- 繼承：自己沒有的東西，別人有，拿過來使用，就是繼承（js中的繼承是基於對象的！）
- 多態：js中沒有多態！
繼承的實現方式
- 混入式繼承（mix-in） ```js var obj = {}; var obj1 = { name: "", age: 18 }
for(var k in obj1){
obj[k] = obj1[k];
}
2. 原型繼承
* 直接將要繼承的對象，賦值給構造函數的prototype屬性，這樣創建出來的所有的對象能夠訪問的原型就是這個要繼承的對象，也就是說實現了繼承！
```js
function Person(){
}
var obj = {
name: "",
age: 18
}
Person.prototype = obj;
* 利用混入的方式，將要繼承的對象中的所有的方法和屬性，添加到構造函數默認的原型中去
function Person(){
}
var obj = {
name: "",
age: 18
}
for(var k in obj){
Person.prototype[k] = obj[k];
}
- 經典繼承 ```js //Object.create var obj1 = { name: "", age: 18 } var obj = Object.create(obj1); //創建出來一個新的對象obj，obj的原型就是obj1
function myCreate(obj){
if(Object.create){
return Object.create(obj);
}else{
function F(){}
F.prototype = obj;
return new F();
}
}
最後更新：2017-07-10 16:32:33