什麽是面向對象編程（OOP）？用對象的思想去寫代碼，就是面向對象編程。

面向對象編程的特點

• 抽象：抓住核心問題
• 封裝：只能通過對象來訪問方法
• 繼承：從已有對象上繼承出新的對象
• 多態：多對象的不同形態

對象的組成

• 屬性：對象下面的變量叫做對象的屬性
• 方法：對象下面的函數叫做對象的方法

一、使用Object函數或對象字面量都編程

var obj1=new Object();//創建一個空的對象
        obj1.name=‘小明‘;  //屬性
        obj1.showName=function(){   //方法
        alert(this.name);//this指向obj
 

 }
 obj1.showName();//小明

var obj2=new Object();//創建一個空的對象
        obj2.name=‘小灰‘;  //屬性
        obj2.showName=function(){   //方法
        alert(this.name);//this指向obj
 }
 obj2.showName();//小灰

缺點：創建多個對象時，會產生大量的重復代碼。

解決方法：工廠方式——面向對象中的封裝函數

二、工廠方式——面向對象中的封裝函數

//工廠方式 : 封裝函數
function createPerson(name){
    var obj = new
 
 Object();
    obj.name = name;
    obj.showName = function(){
        alert( this.name );
    };

    return obj;    
}
var p1 = createPerson(‘小明‘);
p1.showName();
var p2 = createPerson(‘小強‘);
p2.showName();

缺點：創建對象都是使用Object的原生構造函數來實現的，因此無法識別對象類型

解決方法：構造函數模式——給一個對象添加方法

三 、構造函數模式——給一個對象添加方法

//new 後面調用的函數叫構造函數
 

　　function CreatePerson(name){
　　　　this.name=name;
　　　　this.showName=function(){
　　　　　　alert(this.name);
　　　　}
　　}
　　var p1=new CreatePerson(‘小明‘);//當new去調用一個函數時，函數中的this就是創建出來的對象而函數中的返回值就是this
　　 p1.showName();
　　var p2=new CreatePerson(‘小強‘);
　　p2.showName();
　　//缺點
　　console.log( p1.showName == p2.showName )//false 他們值不同，地址不同

使用自定義的構造函數，定義對象類型的屬性和方法，與工廠方式的區別：

• 沒有顯式的創建對象
• 直接將屬性和方法賦給this對象
• 沒有return語句

缺點：就是在創建對象時，每個對象都有一套自己的方法，每定義一個函數都實例化了一個對象

解決方法：原型模式（prototype）——給一類對象添加方法

四、原型模式（prototype）——給一類對象添加方法

原型（prototype）：重寫對象下面公用的屬性或方法，讓公用的屬性或方法在內存中只存在一份（提高性能），也就是說所有在原型對象中創建的屬性或方法都直接被所有對象實例共享。

• 原型：類比css中的class
• 普通方法：類比css中的style

function CreatePerson(name){//普通方法
　　this.name=name;
}
CreatePerson.prototype.showName=function(){//原型
　　alert(this.name);
}
var p1=new CreatePerson(‘小明‘);
p1.showName();
var p2=new CreatePerson(‘小強‘);
p2.showName();
console.log( p1.showName== p2.showName);//true   

面向對象中this的問題

一般會出現問題的情況有兩種：

• 定時器
• 事件

//定時器
function Aaa(){
          var _this=this;//將當前this值保存
            this.a=12;
          setInterval(function(){//定時器中this指向window
                _this.show();
           },1000);
}
Aaa.prototype.show=function(){
           alert(this.a);
 }
var obj=new Aaa();//12

JS面向對象編程