欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

javascript創(chuàng)建函數(shù)的20種方式匯總

 更新時間：2015年06月23日 11:20:59   投稿：hebedich  
這篇文章主要介紹了javascript創(chuàng)建函數(shù)的20種方式匯總的相關資料,需要的朋友可以參考下

工作中常常會創(chuàng)建一個函數(shù)來解決一些需求問題，以下是個人在工作中總結出來的創(chuàng)建函數(shù)20種方式，你知道多少？

function sayHello(){
    console.log('hello');
}
function leave(){
    console.log('goodbye');
}
//test
sayHello();

為完成需求，趕緊聲明一個函數(shù)吧

 
var sayHello = function(){
    console.log('hello');
}
var leave = function(){
    console.log('goodbye');
}
//test
leave();

有求必應，函數(shù)表達數(shù)來解決

 
var Action = {
    sayHello : function(){
        console.log('hello');
    },
    leave : function(){
        console.log('goodbye');
    }
}
//test
Action.sayHello();

創(chuàng)建一個方法對象類看起來更整潔

 
var Action = function(){};
Action.sayHello = function(){
    console.log('hello');
}
Action.leave = function(){
    console.log('goodbye');
}
//test
Action.sayHello();

為單體添加屬性方法，凈化命名空間

 
var Action = function(){
    return {
        sayHello : function(){
            console.log('hello');
        },
        leave : function(){
            console.log('goodbye');
        }
    }
}
// //test
var a = Action();
a.leave();

返回新對象我們還有更多的事情可以做

 
var Action = function(){};
Action.prototype.sayHello = function(){
    console.log('hello');
}
Action.prototype.leave = function(){
    console.log('goodbye');
}
//test
var a = new Action();
a.sayHello();

原型鏈指向防止創(chuàng)建多次

 
var Action = function(){};
Action.prototype = {
    sayHello : function(){
        console.log('hello');
    },
    leave : function(){
        console.log('goodbye');
    }
}
//test
var a = new Action();
a.leave();

對象賦給原型看上去更整潔

 
var Action = function(){
    this.sayHello = function(){
        console.log('hello');
    }
    this.leave = function(){
        console.log('goodbye');
    }
}
//test
var a = new Action();
a.leave();

別忘了還可以在類的內部添加屬性

 
Function.prototype.sayHello = function(){
    console.log('hello');
}
Function.prototype.leave = function(){
    console.log('leave');
}
//test
var f = function(){};
f.sayHello();

基類原型拓展，新的一片空間

 
Function.prototype.addMethod = function(name, fn){
    this[name] = fn;
}
var methods = function(){};
methods.addMethod('sayHello', function(){
    console.log('hello');
});
methods.addMethod('leave', function(){
    console.log('leave');
});
//test
methods.sayHello();

通用定義方法函數(shù)使用更方便

 
Function.prototype.addMethod = function(name, fn){
    this.prototype[name] = fn;
}
var Methods = function(){};
Methods.addMethod('sayHello', function(){
    console.log('hello');
});
Methods.addMethod('leave', function(){
    console.log('leave');
});
//test
var a = new Methods();
a.leave();

原形賦值我們還可以用類操作

Function.prototype.addMethod = function(name, fn){
    this[name] = fn;
    return this;
}
var methods = function(){};
methods.addMethod('sayHello', function(){
    console.log('hello');
}).addMethod('leave', function(){
    console.log('leave');
});
//test
methods.leave();

鏈式操作有何不可

 
Function.prototype.addMethod = function(name, fn){
    this.prototype[name] = fn;
    return this;
}
var Methods = function(){};
Methods.addMethod('sayHello', function(){
    console.log('hello');
}).addMethod('leave', function(){
    console.log('leave');
});
//test
var a = new Methods();
a.leave();

原型+鏈式=更進一步

 
Function.prototype.addMethod = function(obj){
    for(var key in obj){
        this[key] = obj[key];
    }
}
var methods = function(){};
methods.addMethod({
    sayHello : function(){
        console.log('hello');
    },
    leave : function(){
        console.log('goodbye');
    }
});
//test
methods.leave();

添加對象一次做得更多

 
Function.prototype.addMethod = function(obj){
    for(var key in obj){
        this.prototype[key] = obj[key];
    }
}
var Methods = function(){};
Methods.addMethod({
    sayHello : function(){
        console.log('hello');
    },
    leave : function(){
        console.log('goodbye');
    }
});
//test
var a = new Methods();
a.leave();

原型有什么不可以

 
Function.prototype.addMethod = function(obj){
    for(var key in obj){
        this[key] = obj[key];
    }
    return this;
}
var methods = function(){};
methods.addMethod({
    sayHello : function(){
        console.log('hello');
    }
}).addMethod({
    leave : function(){
        console.log('goodbye');
    }
});
//test
methods.leave();

函數(shù)式添加對象也可以鏈式操作

 
Function.prototype.addMethod = function(obj){
    for(var key in obj){
        this.prototype[key] = obj[key];
    }
    return this;
}
var Methods = function(){};
Methods.addMethod({
    sayHello : function(){
        console.log('hello');
    }
}).addMethod({
    leave : function(){
        console.log('goodbye');
    }
});
//test
var a = new Methods();
a.leave();

類的鏈式操作也可以做得更多

 
Function.prototype.addMethod = function(){
    if(arguments.length < 1)
        return;
    var tostring = Object.prototype.toString;
    if(tostring.call(arguments[0]) === '[object Object]'){
        for(var key in arguments[0]){
            this[key] = arguments[0][key];
        }
    }else if(typeof arguments[0] === "string" && tostring.call(arguments[1]) === '[object Function]'){
        this[arguments[0]] = arguments[1];
    }
    return this;
}

函數(shù)添加封裝一下

 
Function.prototype.addMethod = function(){
    if(arguments.length < 1)
        return;
    var tostring = Object.prototype.toString;
    if(tostring.call(arguments[0]) === '[object Object]'){
        for(var key in arguments[0]){
            this.prototype[key] = arguments[0][key];
        }
    }else if(typeof arguments[0] === "string" && tostring.call(arguments[1]) === '[object Function]'){
        this.prototype[arguments[0]] = arguments[1];
    }
    return this;
}

類式添加追求的就是個性化

 
Function.prototype.addMethod = function(){
    if(arguments.length < 1)
        return;
    var cout = 0,
        tostring = Object.prototype.toString,
        that;
    if(typeof arguments[0] === "boolean" && arguments[0]){
        cout++;
        that = this;
    }else{
        that = this.prototype;
    }
    if(tostring.call(arguments[cout]) === '[object Object]'){
        for(var key in arguments[cout]){
            that[key] = arguments[cout][key];
        }
    }else if(typeof arguments[cout] === "string" && tostring.call(arguments[cout + 1]) === '[object Function]'){
        that[arguments[cout]] = arguments[cout + 1];
    }
    return this;
}
//text
var Text1 = function(){};
Text1
.addMethod('sayHello', function(){console.log('last say hello!')})
.addMethod('leave', function(){console.log('last goodbye!')});
var t = new Text1();
t.sayHello();
t.leave();
var test2 = function(){};
test2
.addMethod(true, 'sayHello', function(){console.log('last say hello!')})
.addMethod(true, 'leave', function(){console.log('last goodbye!')});
test2.sayHello();
test2.leave();

追求個性化，這么做不必說為什么

以上所述就是本文的全部內容了，希望大家能夠喜歡。

相關文章

  • webpack 從指定入口文件中提取公共文件的方法

    webpack 從指定入口文件中提取公共文件的方法

    這篇文章主要介紹了webpack 從指定入口文件中提取公共文件的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2018-11-11
  • Bootstrap學習筆記之js組件（4）

    Bootstrap學習筆記之js組件（4）

    這篇文章主要為大家詳細介紹了Bootstrap學習筆記之js組件,具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2016-06-06
  • JS實現(xiàn)超炫網(wǎng)頁煙花動畫效果的方法

    JS實現(xiàn)超炫網(wǎng)頁煙花動畫效果的方法

    這篇文章主要介紹了JS實現(xiàn)超炫網(wǎng)頁煙花動畫效果的方法,實例分析了javascript實現(xiàn)煙花動畫效果的技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-03-03
  • Hutia 的 JS 代碼集

    Hutia 的 JS 代碼集

    Hutia 的 JS 代碼集...
    2006-10-10
  • 微信小程序獲取手機驗證碼的方法

    微信小程序獲取手機驗證碼的方法

    這篇文章主要為大家詳細介紹了微信小程序獲取手機驗證碼的方法，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2022-05-05
  • 十分鐘教你上手ES2020新特性

    十分鐘教你上手ES2020新特性

    這篇文章主要介紹了十分鐘教你上手ES2020新特性，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2020-02-02
  • 一文詳解JavaScript中的replace()函數(shù)

    一文詳解JavaScript中的replace()函數(shù)

    replace方法的語法是stringObj.replace(rgExp, replaceText),其中stringObj是字符串(string),下面這篇文章主要給大家介紹了關于JavaScript中replace()函數(shù)的相關資料,需要的朋友可以參考下
    2023-01-01
  • 微信小程序登錄態(tài)和檢驗注冊過沒的app.js寫法

    微信小程序登錄態(tài)和檢驗注冊過沒的app.js寫法

    這篇文章主要介紹了小程序登錄態(tài)和檢驗注冊過沒的app.js寫法, 本文通過實例代碼給大家介紹的非常詳細，具有一定的借鑒價值，需要的朋友可以參考下
    2019-05-05
  • JavaScript中常用的字符串方法函數(shù)操作方法總結

    JavaScript中常用的字符串方法函數(shù)操作方法總結

    這篇文章主要介紹了JavaScript中所有的字符串函數(shù)操作方法整理匯總,包括字符串的長度、連接、查找、截取、替換、分隔、轉換等處理方法,以及網(wǎng)址中獲取文件名等等,需要的朋友可以參考下
    2023-12-12
  • firefox下javascript實現(xiàn)高亮關鍵詞的方法

    firefox下javascript實現(xiàn)高亮關鍵詞的方法

    “點睛”的廣告代碼，很牛B，本想從中找出在FireFox下如何實現(xiàn)findText及pasteHTML類似效果的，我看了大半天，楞是沒有看出個所以然來！還是自己慢慢研究吧。
    2007-07-07

最新評論