面向?qū)ο缶幊蹋ㄉ希?/h2>

面向?qū)ο缶幊蹋∣bject-oriented programming，OOP）是一種程序設(shè)計范型。它將對象作為程序的基本單元，將程序和數(shù)據(jù)封裝其中，以提高程序的重用性、靈活性和擴(kuò)展性。

1.用對象收編變量

對象有屬性和方法，我們要訪問它的屬性或者方法時，可通過點(diǎn)語法向下遍歷查詢得到。
例如：我們可以創(chuàng)建一個檢測對象，然后把我們的方法放在里面。

var CheckObject = {
    checkName: function() {
        //驗(yàn)證姓名
    },
    checkEmail: function() {
        //驗(yàn)證郵箱
    },
    checkPassword: function() {
        //驗(yàn)證密碼
    }
}

使用它們很簡單，比如檢測姓名：CheckObject.checkName();

2.對象的另一種形式

var CheckObject = function() {};
CheckObject.checkName = function() {
    //驗(yàn)證姓名
}
CheckObject.checkEmail = function() {
    //驗(yàn)證郵箱
}
CheckObject.checkPassword = function() {
    //驗(yàn)證密碼
}

使用和前面的方式是一樣的，但這個對象不能復(fù)制一份，或者說這個對象類在用new關(guān)鍵字創(chuàng)建新的對象時，新創(chuàng)建的對象是不能繼承這些方法的。

3.真假對象

如果想簡單地復(fù)制一下對象，可以將方法放在一個函數(shù)對象中。

var CheckObject = function() {
    return {
        checkName: function() {
            //驗(yàn)證姓名
        },
        checkEmail: function() {
            //驗(yàn)證郵箱
        },
        checkPassword: function() {
            //驗(yàn)證密碼
        }
    }
}

當(dāng)每次調(diào)用這個函數(shù)的時候都返回了一個新對象，這樣每個人在使用時就互不影響了。
例如檢測郵箱：

var a = CheckObject();
a.checkEmail();

4.類也可以

上面并不是一個真正意義上類的創(chuàng)建方式，并且創(chuàng)建的對象a和對象CheckObject沒有任何關(guān)系（返回出來的對象本身與CheckObject對象無關(guān)）。

var CheckObject = function() {
    this.checkName = function() {
        //驗(yàn)證姓名
    },
    this.checkEmail = function() {
        //驗(yàn)證郵箱
    },
    this.checkPassword = function() {
        //驗(yàn)證密碼
    }
}

上面這樣的對象就可以看成類了，用類創(chuàng)建對象需要用到關(guān)鍵字new。

var a = new CheckObject();
a.checkEmail();

5.一個檢測類

上面的類把所有的方法放在函數(shù)內(nèi)部，通過this定義，所以每一次通過new關(guān)鍵字創(chuàng)建新對象的時候，新創(chuàng)建的對象都會對類的this上的屬性進(jìn)行復(fù)制，所以這些新創(chuàng)建的對象都會有自己的一套方法，然而有時候這么做造成的消耗是很奢侈的，我們需要處理一下。

var CheckObject = function() {};
CheckObject.prototype = {
    checkName: function() {
        //驗(yàn)證姓名
    },
    checkEmail: function() {
        //驗(yàn)證郵箱
    },
    checkPassword: function() {
        //驗(yàn)證密碼
    }
}

這樣創(chuàng)建對象實(shí)例的時候，創(chuàng)建出來的對象所擁有的方法就都是一個了，因?yàn)樗鼈兌家蕾噋rototype原型依次尋找，而找到的方法都是同一個，它們都綁定在CheckObject對象類的原型上。

6.方法還可以這樣用

使用上面方式定義的類如下：

var a = new CheckObject();
a.checkName();
a.checkEmail();
a.checkPassword();

調(diào)用了3個方法，但是對象a書寫了3遍，這是可以避免的，需要在聲明的每一個方法末尾處將當(dāng)前對象返回，在JS中this指向的就是當(dāng)前對象。

var CheckObject = {
    checkName: function() {
        //驗(yàn)證姓名
        return this;
    },
    checkEmail: function() {
        //驗(yàn)證郵箱
        return this;
    },
    checkPassword: function() {
        //驗(yàn)證密碼
        return this;
    }
}
CheckObject.checkName().checkEmail().checkPassword();

當(dāng)然同樣的方式還可以放到類的原型對象中。

7.函數(shù)的祖先

prototype.js是一款JS框架，里面為我們方便地封裝了很多方法，它最大的特點(diǎn)就是對源生對象（Function、Array、Object等）的拓展。
比如你想給每一個函數(shù)都添加一個檢測郵箱的方法：

Function.prototype.checkEmail  = function() {
    //驗(yàn)證郵箱
}

var f = function() {};
f.checkEmail();

或者

var f = new Function();
f.checkEmail();

注意，這么做是不允許的，因?yàn)槟阄廴玖嗽鷮ο驠unction，所以別人創(chuàng)建的函數(shù)也會被你創(chuàng)建的函數(shù)所污染，造成不必要的開銷，但是你可以抽象出一個統(tǒng)一添加方法的功能方法。

Function.prototype.addMethod = function(name, fn) {
    this[name] = fn;
}

var methods = function() {};

或者

var methods = new Function();

methods.addMethod('checkEmail', function() {
    //驗(yàn)證郵箱
});
methods.checkEmail();

這樣只有methods對象才有checkEmail方法。

8.鏈?zhǔn)教砑臃椒?/strong>

Function.prototype.addMethod = function(name, fn) {
    this[name] = fn;
    return this;
}
var methods = function() {};
methods.addMethod('checkName', function() {
    //驗(yàn)證姓名
}).addMethod('checkEmail', function() {
    //驗(yàn)證郵箱
});

注意上面只是鏈?zhǔn)教砑臃椒?，不能鏈?zhǔn)绞褂?，如果使?code>methods.checkName().checkEmail()只會執(zhí)行checkName()方法并報如下錯誤：Cannot read property 'checkEmail' of undefined.
如果想要鏈?zhǔn)绞褂?，添加的每個方法需要將this返回。

var methods = function() {};
methods.addMethod('checkName', function() {
    //驗(yàn)證姓名
    return this;
}).addMethod('checkEmail', function() {
    //驗(yàn)證郵箱
    return this;
});

現(xiàn)在methods.checkName().checkEmail()就可以正常運(yùn)行了。

9.用類式調(diào)用方式使用方法

添加方法跟上面一樣，但在使用的時候要注意了，不能直接使用，要通過new關(guān)鍵字來創(chuàng)建新對象。

var m = new Methods();
m.checkEmail();

最后編輯于 ：2018.01.12 10:09:00

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。