js oop 封裝

讀者朋友們好，前面咱們已經講解了有關javascript的基礎，從今天的內容開始，咱們就要開始講有關封裝的內容了，這裏，咱們就一點一點地接觸到OOP（面向對象編程）了，若是做爲一門語言使用的程序員連OOP都不知道是什麼，或者只據說過，本身沒有去領悟，不能寫出面向對象的代碼，那麼也沒有學習程序的必要了，下面我先會給你們詳細的介紹面向對象是什麼，面向過程是什麼，要想弄明白麪向對象，首先咱們就必須知道面向過程。在你已經弄明白了面向過程以後，咱們也不能盲目地爲了OOP而OOP，那樣只會是作一些徒勞的事，由於在大多數時候，咱們寫一些代碼只是爲了解決一小事情，那麼，咱們就不必寫OOP了，只須要寫一些面向過程的代碼就能夠了，用個詞來形容「因地制宜」。

　　咱們就先從面向過程開始，先來解釋一下過程是什麼意思，咱們平時所說的「程序」二字其實過程，執行一個程序，也就是執行一個過程，例如：上班，就是一個程序，其中的過程通過是，9點準時到公司，作一些本身應該完成的事，下午6點無論作成什麼樣，上班的過程作完了，離開公司，這就是過程；再來個更具體的例子，取款，執行的過程咱們就寫得更明白一點：

1、帶上銀行卡到ATM

2、插入銀行卡

3、輸入密碼

4、輸入取款數目

5、ATM吐鈔

6、把錢放入本身兜裏

6、若是發現沒有取到本身想要數，返回第4步

7、若是要打印回執單，就點擊打印回執單；若是不打印，就省略該步驟

8、退卡

9、程序完畢

從上面的步驟咱們能夠看出，從第一步到最後一步，這就是執行順序，第4到第6步就是一個循環過程，第7步是個分支過程，這就是過程，也就是程序。咱們寫代碼的目的就是模擬一些行爲過程，用計算機的高速運算的特色爲咱們的生活服務。

咱們就能夠把取款封裝成一個函數，這樣，這就是一個獨立的過程，在須要的時候，咱們就能夠調用這個函數，就能完成咱們的工做須要，下面咱們就用一個最簡單的例子來表達一個最簡單的程序過程
複製代碼

function KissWife(whoseWife){
    console.log(whoseWife+"把臉湊過來");
    console.log("我把嘴脣印上去");
    console.log("木啊一聲");
    console.log("親"+whoseWife+"一次完成");
}

KissWife("我老婆");

複製代碼

看圖說話，在合適的時候，咱們調用KissWife函數，輸入合適參數，咱們執行完一個過程了。

　　OOP的目的就是提升代碼的重用率，用最少的代碼幹盡可能多的事，使用參數，也是面向對象編程的一種體現，咱們來舉個反例，若是咱們在不使用參數的狀況下，咱們在想親別人老婆的時候，就要從新寫一個KissWife函數，這樣，咱們就寫了大量重複的代碼，不方便代碼管理，諸多不便，方法不順溜，就算在親別人老婆的時候被發現的機率就大大增長了，帶來了一些沒必要要的麻煩。

這時候有同窗想問了，我以爲，我以爲我不習慣使用參數，就是不想傳遞參數，代碼管理哪裏會出現不方便管理呢？好，這個問題問得至關的到位。

我來解釋一下吧，若是在這個過程執行過程當中，咱們發現有不合理的地方，須要修改，例如，我還想伸個舌頭啥的，咱們就要在親本身老婆的函數中修改（麻煩），還要在親別人老婆的函數中修改（麻煩+1），當咱們有不少個相似的函數的時候，是否是要所有作修改（麻煩+n）；第二個壞處就是修改次數多了，你能保證一次性所有修改都不會出錯嗎（容易失誤），這就能體現出了，若是咱們只是徹底寫一些重複性的代碼，工做效率大打折扣。

　　經過上面的講解，其實新手讀者們仍是沒能理解什麼是OOP（面向對象編程），咱們如今就從對象（object）開始講解，這裏的對象，不能單純地理解成談戀愛時所處的男女友，對象是指世間的萬事萬物，太陽，大海，人，寵物……；每一種咱們能夠想獲得的事物，每個對象都有本身的屬性，行爲。

咱們就能夠像上圖這樣來理解，鳥就是一個對象，它有本身屬性，有本身的行爲，下面咱們就用具體代碼來封裝一個關於鳥的類。（注：在javascript語言中function關鍵字中僅僅用來定義函數，也能夠定義類，它不能像高級語言那樣使用Class關鍵字，後面咱們講繼承的時候，咱們還會用特殊方法來實現繼承）
複製代碼

 
//聲明一個鳥類
function Bird(){
    this.name = "鴿子";
    this.color = "灰色";
    this.habitat = "籠子";
    this.weight = "500克";
}

//使用原型鏈的方式，來定義鳥的行，也能夠用來定義屬性，可是，屬性通常用this關鍵字來聲明
//行爲和屬性，其實同一個級別的，後面咱們用for in來給你們驗證

//鳴叫
Bird.prototype.Sing = function(){
    console.log("咕咕咕");
}
//進食
Bird.prototype.Eat = function(){
    console.log("吃了一粒玉米");
}
//飛翔
Bird.prototype.Fly = function(){
    console.log("在天空中飛翔着");
}
//孵蛋
Bird.prototype.Brood = function(){
    cossole.log("正在孵化鴿子蛋");
}

複製代碼

如今咱們類已經聲明好了，可是咱們，怎麼使用它呢？如今它只是一個類，還不是實例，就是我口頭上所說的鴿子，實例，就是一隻具體的鴿子，怎麼才能獲得一隻具體的鴿子呢？看下面的代碼

//用new 關鍵字來得到一個實例
var gezi = new Bird();

如今咱們就能夠調用它的屬性，以及方法了

經過這樣的方法咱們所獲得的每個鴿子其實都是同樣的，咱們要怎麼才獲得有本身特徵的鴿子呢？有本身獨有特徵，其實就是屬性不同，那們咱們就來改造一下函數的聲明
複製代碼

//其實咱們只須要在這裏小小地修改一下
function Bird(_color,_habitat,_weight){
    this.name = "鴿子";
    this.color = _color;
    this.habitat = _habitat;
    this.weight = _weight;
}

複製代碼

而後咱們來看一下實例化一個鴿子的時候，怎麼作

//咱們如今就實例化了兩個鴿子
var gezi_A = new Bird("白色","野外","300克");
var gezi_B = new Bird("灰白色","溫室","550克");

這樣，咱們就能夠構造出有本身特徵的鴿子出來了，從上面的例子，咱們其實已經不難看出，封裝，其實就是把咱們能夠形容的對象用類來表示，咱們就可經過new關鍵字來實例化出對象，這個對象就有本身獨立的屬性，行爲，這樣的一個對象，咱們就能夠方便的供咱們操做，封裝就是一種體現OOP的方法，咱們先是封裝一個類，而後，再new 出實例，這樣寫就比咱們直接用代碼來構造兩次鴿子類少了不少的代碼，若是咱們還構造第3只鴿子，就再new 一次就能夠了，構造對象的時候，就感受一句代碼的事。提升代碼的重用率，OOP就這樣體現出來了。

　　這時候，有人問了，只是在說咱們用OOP的好處 ，尚未看到不用OOP的代碼到底怎麼寫，那們就來一個不用OOP的方式，一樣以鴿子爲例
複製代碼

//聲明一個鴿子
function GeZi_C(){
    console.log("種類是鴿子");
    console.log("顏色是藍色");
    console.log("住在樹梢上");
    console.log("體重400克");
    console.log("在天空中飛翔着");
}
//執行一次
GeZi_C();

複製代碼

若是咱們要再聲明100個鴿子，是否是要寫大量重複相似上面這樣的代碼呀，這就是面向過程的代碼。相信新手朋友們已經有一個模糊的OOP概念了吧，慢慢體會，這種感受不一兩天就能弄明白的，一口吃不成大胖子，後面咱們還會繼續講OOP思想的繼承和多態。

繼續先前在聲明Bird類的時候，說的屬性和行爲是同一級別，並且是能夠用兩種方式來聲明，屬性在構造函數裏面用 this 關鍵字聲明，行爲函數用 prototype 關鍵字來聲明，prototype就是函數原型鏈的標準擴展，咱們之因此這樣來寫，就是把javascript語言的使用代入高級語言的範疇，用來模擬高級語言的使用，扯遠了，咱們先來驗證一下Bird實例對象中是否是擁有在同一級別的屬性跟行爲函數
複製代碼

//咱們如今是用的前面的沒有參數的Bird類
var obj = new Bird();

//逐一打印出來
for(var pro in obj){
      console.log(pro + " : " + obj[pro]);
}

複製代碼

看到了吧，for...in就做用就是用來循環遍歷對象的屬性以及數組的下標，行爲函數的名稱其實也是對象的屬性，如今就驗證了前面的說法，相信你們如今對OOP的封裝思想有必定的認知了。

總結一下，今天咱們所講的東西其實就是把事物給抽象的擬態一下，而後，把這些屬性行爲給封裝成一個類，使用new關鍵字實例化出具體對象，這樣大大地提升了代碼的使用率，提升了工做效率