http://www.jb51.net/article/68285.htm

工作中常常会创建一个函数来解决一些需求问题,以下是个人在工作中总结出来的创建函数20种方式,你知道多少?

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

为完成需求,赶紧声明一个函数吧

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

有求必应,函数表达数来解决

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

创建一个方法对象类看起来更整洁

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();

原型链指向防止创建多次

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();

通用定义方法函数使用更方便

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();

函数式添加对象也可以链式操作

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;
}

函数添加封装一下

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();

追求个性化,这么做不必说为什么

javascript创建函数的20种方式汇总的更多相关文章

  1. JavaScript创建函数的三种方式

    ㈠函数(function) ⑴函数也是一个对象 ⑵函数中可以封装一些功能(代码),在需要时可以执行这些功能(代码) ⑶函数中可以保存一些代码在需要的时候调用 ⑷使用typeof检查一个函数对象时,会返 ...

  2. javascript创建类的6种方式

    javascript创建类的7种方式 一 使用字面量创建 1.1 示例 var obj={}; 1.2 使用场景 比较适用于临时构建一个对象,且不关注该对象的类型,只用于临时封装一次数据,且不适合代码 ...

  3. JS中创建函数的三种方式及区别

    1.函数声明 function sum1(n1,n2){ return n1+n2; }; 2.函数表达式,又叫函数字面量 var sum2=function(n1,n2){ return n1+n2 ...

  4. JavaScript创建表格的两种方式

    方式一: var data = [ { id: 1, name: "first", age: 12 }, { id: 2, name: "second", ag ...

  5. javaScript定义函数的三种方式&amp;变量的作用域

    一.函数定义 方式1.普通方式定义函数 function 函数名(參数n){ 函数体 } function add(a,b){ return a+b; } 方式2.直接量定义函数 var 函数名=fu ...

  6. JavaScript创建类的三种方式

    //第一种 创建类方法. // 用方法模拟 构造函数. function classobj() { this.name = 'xiaoming'; } classobj.text = 'text'; ...

  7. JavaScript定义函数的三种方式

    直接定义函数 function f1(x,y){ return x+y; } 使用Function构造函数 var f2=new Function("x","y" ...

  8. javascript中构造函数的三种方式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. JS创建对象,数组,函数的三种方式

    害怕自己忘记,简单总结一下 创建对象的3种方法 ①:创建一个空对象   var obj = {}; ②:对象字面量 var obj = { name: "Tom", age: 27 ...

随机推荐

  1. gene Ontology (基因本体论)

    gene ontology为了查找某个研究领域的相关信息,生物学家往往要花费大量的时间,更糟糕的是,不同的生物学数据库可能会使用不同的术语,好比是一些方言一样,这让信息查找更加麻烦,尤其是使得机器查找 ...

  2. Spring源码阅读(三)

    上一讲我们谈到单例生产关键方法getSingleton.getSingleton方法由DefaultSingletonBeanRegistry类实现.我们的抽象工厂AbstractBeanFactor ...

  3. highchart应用示例1--2个不同类型变量2个y轴

    1.ajax调用接口和处理数据 function getCityData() { var date1 = $('#datetimepicker1').val(); var date2 = $('#da ...

  4. json.dumps(),json.loads(),json.dump(),json.load()方法的区别

    1. json.dumps() json.dump()是将字典类型转化成字符串类型. import json dic = {'a':'1111','b':'2222','c':'3333','d':' ...

  5. winscp中使用sudo的方法

    用截图了解如何在 WinSCP 中使用 sudo. 首先你需要检查你尝试使用 WinSCP 连接的 sftp 服务器的二进制文件的位置.你可以使用以下命令检查 SFTP 服务器二进制文件位置: [ro ...

  6. 在虚拟机上安装gho、esd(wim)系统镜像文件

    gho.esd(wim)等文件不能被虚拟机识别,但如果把它们打包成iso就可以了. 另外,还需用到能在虚拟机上运行的WinPE的iso文件,本文用的是微PE. 注意:安装虚拟机提示operating ...

  7. 简单了解一下php的迭代生成器yield

    yield是从PHP5.5开始有的,关于yidle的说明鸟哥的博客做了详细说明,我觉得是有点复杂,在看了几篇其他的帖子还有案例,我大概知道yield的作用就是在做大量数据循环处理的时候,能节省很大一部 ...

  8. python的shutil模块-文件的移动、复制、打包、压缩、解压等

    参考https://www.cnblogs.com/xiangsikai/p/7787101.html os模块提供了对目录或者文件的新建.删除.查看文件属性,还提供了对文件以及目录的路径操作,比如说 ...

  9. VMware无法读取USB文件

    今天碰到虚拟机内的Mac OS无法读取USB,经过一番查看,是Windows的服务里面的vmware usb arbitration service服务没有启动,再点击启动的时候,报错,提示本地文件找 ...

  10. Nginx入门简介

    Nginx入门简介 Nginx 介绍 Nginx (engine x) 是一个高性能的HTTP和反向代理服务,也是一个IMAP/POP3/SMTP服务.Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二 ...