js中扩展内置对象的正确姿势

错误的扩展

/*
* 这样做是不允许的,会污染原生对象Function 
*/
Function.prototype.checkUserName = function () { };
var f1 = function () { };
f1.checkUserName();/*
* 这样做是不允许的,会污染原生对象Function 
*/
Function.prototype.checkUserName = function () { };
var f1 = function () { };
f1.checkUserName();

正确的做法

Function.prototype.addMethod1 = function (name, fn) {
    this[name] = fn;
}
var f2 = function () { };
f2.addMethod1('checkUserName', function () {
    console.log('checkUserName');
})
f2.addMethod1('checkPhone', function () {
    console.log('checkPhone');
})
f2.checkUserName();
f2.checkPhone();

 链式调用(函数式调用方式)

Function.prototype.addMethod2 = function (name, fn) {
    this[name] = fn;
    // 这里返回this,是用于链式添加
    return this;
}
var f3 = function () { };
f3.addMethod2('checkUserName', function () {
    console.log('checkUserName');
    // 这里返回this,是用于链式调用
    return this;
})
    .addMethod2('checkPhone', function () {
        console.log('checkPhone');
        // 这里返回this,是用于链式调用
        return this;
    });
// 链式调用
f3.checkUserName().checkPhone();

链式调用(类式调用方式) 

Function.prototype.addMethod3 = function (name, fn) {
    // 放在原型对象上
    this.prototype[name] = fn;
    return this;
}
var f4 = function () { };
f4.addMethod3('checkUserName', function () {
    console.log('checkUserName');
    // 这里返回this,是用于链式调用
    return this;
}).addMethod3('checkPhone', function () {
    console.log('checkPhone');
    // 这里返回this,是用于链式调用
    return this;
});
// 使用的时候就需要注意了
var a = new f4();
a.checkUserName().checkPhone();