1.常规写法

 function fnName(){
console.log("常规写法");
}

2.匿名函数,函数保存到变量里

 var myfn = function(){
console.log("匿名函数,函数保存到变量里");
}

3.如果有多个变量,可以用对象收编变量

3.1 用json对象

 var fnobject1={
fn1:function(){
console.log("第一个函数");
},
fn2:function(){
console.log("第二个函数");
},
fn3:function(){
console.log("第三个函数");
}
11 }

3.2 声明一个对象,然后给它添加方法

 var fnobject2 = function(){};
fnobject2.fn1 = function(){
console.log("第一个函数");
}
fnobject2.fn2 = function(){
console.log("第二个函数");
}
fnobject2.fn3 = function(){
console.log("第三个函数");
}

3.3 可以把方法放在一个对象函数里

 var fnobject3 = function(){
return {
fn1:function(){
console.log("第一个函数");
},
fn2:function(){
console.log("第二个函数");
},
fn3:function(){
console.log("第三个函数");
}
}
};

4.可用类来实现,注意类的第二种和第三种写法不能混用,否则一旦混用,如在后面为对象的原型对象赋值新对象时,那么他将会覆盖掉之前对prototype对象赋值的方法

4.1 第一种写法

 var fnobject4 = function(){
this.fn1 = function(){
console.log("第一个函数");
}
this.fn2 = function(){
console.log("第二个函数");
}
this.fn3 = function(){
console.log("第三个函数");
}
};

4.2 第二种写法

 var fnobject5 = function(){};
fnobject5.prototype.fn1 = function(){
console.log("第一个函数");
}
fnobject5.prototype.fn2 = function(){
console.log("第二个函数");
}
fnobject5.prototype.fn3 = function(){
console.log("第三个函数");
}

4.3 第三种写法

 var fnobject6 = function(){};
fnobject6.prototype={
fn1:function(){
console.log("第一个函数");
},
fn2:function(){
console.log("第二个函数");
},
fn3:function(){
console.log("第三个函数");
}
}

4.4 第四种写法

var fnobject7 = function(){};
fnobject7.prototype={
fn1:function(){
console.log("第一个函数");
return this;
},
fn2:function(){
console.log("第二个函数");
return this;
},
fn3:function(){
console.log("第三个函数");
return this;
}
}

5.对Function对象类的扩展(下面三种只能用一种)

5.1 第一种写法(对象)

 Function.prototype.addMethod = function(name,fn){
this[name] = fn;
}
var methods=function(){};//var methods=new Function();
methods.addMethod('fn1',function(){
console.log("第一个函数");
});
methods.addMethod('fn2',function(){
console.log("第二个函数");
});
methods.addMethod('fn3',function(){
console.log("第三个函数");
});

5.2 链式添加(对象)

 Function.prototype.addMethod = function(name,fn){
this[name] = fn;
return this;
}
var methods=function(){};//var methods=new Function();
methods.addMethod('fn1',function(){
console.log("第一个函数");
}).addMethod('fn2',function(){
console.log("第二个函数");
}).addMethod('fn3',function(){
console.log("第三个函数");
});

5.3 链式添加(类)

Function.prototype.addMethod = function(name,fn){
this.prototype[name] = fn;
return this;
}
var Methods=function(){};//var methods=new Function();
methods.addMethod('fn1',function(){
console.log("第一个函数");
}).addMethod('fn2',function(){
console.log("第二个函数");
}).addMethod('fn3',function(){
console.log("第三个函数");
});

javascript函数的几种写法集合的更多相关文章

  1. Javascript函数的几种写法

    最近在看某个插件的源码时,总是看到各种不同风格的js函数的写法.(怪我只是初级水平,看的一头雾水) 于是想找点资料,总结总结,心里不清不楚的总是很别扭! 1.常规写法 // 函数写法 function ...

  2. javascript立即调用的函数表达式N种写法(第二篇)

    原文:javascript立即调用的函数表达式N种写法(第二篇) 上一篇博客我谈到将函数声明转换为函数表达式最常见的一种写法是:通过括号()将匿名函数声明转换为函数表达式即(function(){}) ...

  3. swap函数的四种写法

    swap 函数的四种写法 (1)经典型 --- 嫁衣法 void swap(int *a, int *b) { int temp; temp = *a; *a = *b; *b = temp; } ( ...

  4. JavaScript 函数的4种调用方法

    JavaScript 函数有 4 种调用方式. 每种方式的不同方式在于 this 的初始化. 作为一个函数调用 function myFunction(a, b) { return a * b; } ...

  5. swap()函数的几种写法及优劣

    试用几种方法实现swap函数,比较效率高低. 首先说结果,最快的是赋值交换. 原因分析 gcc开启O2优化后,三个函数的汇编代码一样.是的,除了第一行的文件名,一模一样. 附代码 void swap1 ...

  6. C++ 常用编程--Swap函数有几种写法?

    C++ 常用编程--Swap函数有几种写法? 在说C++模板的方法前,我们先想想C语言里面是怎么做交换的. 举个例子,要将两个int数值交换,是不是想到下面的代码: void swap(int& ...

  7. JavaScript 函数的两种声明方式

    1.函数声明的方式 JavaScript声明函数有两种选择:函数声明法,表达式定义法. 函数声明法 function sum (num1 ,num2){ return num1+num2 } 表达式定 ...

  8. JavaScript函数的4种调用方法详解

    在JavaScript中,函数是一等公民,函数在JavaScript中是一个数据类型,而非像C#或其他描述性语言那样仅仅作为一个模块来使用.函数有四种调用模式,分别是:函数调用形式.方法调用形式.构造 ...

  9. ASP.NET后台中调用前台Javascript函数的几种方法

    做web开发,用的技术是aspx.net,可是由于比较习惯于ASP现在做起来,觉得非常别扭,原因在于有很多功能其实在前台可以处理的,但是因为用到了很多webcontrol,导致不断postback.如 ...

随机推荐

  1. substring的用法

    public String substring(int beginIndex, int endIndex) 返回一个新字符串,它是此字符串的一个子字符串.该子字符串从指定的 beginIndex 处开 ...

  2. VS2013默认打开HTML文件没有设计视图的解决办法

    VS菜单->工具->选项->文本编辑器->文件扩展名,右侧输入html,再下拉列表选HTML(Web窗体)编辑器,点添加,确定. 重新打开html文件,就出现“设计”视图了

  3. 04. Web大前端时代之:HTML5+CSS3入门系列~HTML5 表单

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 一.input新增类型: 1.tel:输入类型用于应该包 ...

  4. 安卓与IOS移动段浏览器视频与音频的问题与总结

    1. 安卓.苹果移动浏览器上都不支持html5的视频与音频自动播放 2. 安卓.苹果移动浏览器要支持播放,前提是必须是用户触发的事件 3. 针对这个特殊的问题,代码需要在用户进来第一次屏幕触发中,去创 ...

  5. c 二叉树的使用

    简单的通过一个寻找嫌疑人的小程序 来演示二叉树的使用 #include <stdio.h> #include <stdlib.h> #include <string.h& ...

  6. grunt自定义任务——合并压缩css和js

    npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...

  7. 使用session页面控制登录入口及购物车效果的实现

          由于 Session 是以文本文件形式存储在服务器端的,所以不怕客户端修改 Session 内容.实际上在服务器端的 Session 文件,PHP 自动修改 Session 文件的权限,只 ...

  8. 用eclipse开发项目时遇到的常见错误整理,和配套解决方案(1)

    01. MyEclipse项目导入eclipse后,怎么发布不了? 今天导入了之前的一个MyEclipse项目,更改jdk后,发现发布不了.解决方案如下: 打开项目根目录,找到.settings文件夹 ...

  9. Apworks框架实战

    Apworks框架实战(一):Apworks到底是什么? Apworks框架实战(二):开始使用 Apworks框架实战(三):单元测试与持续集成 Apworks框架实战(四):使用Visual St ...

  10. 基于 HTML5 的 Web SCADA 报表

    背景 最近在一个 SCADA 项目中遇到了在 Web 页面中展示设备报表的需求.一个完整的报表,一般包含了筛选操作区.表格.Chart.展板等多种元素,而其中的数据表格是最常用的控件.在以往的工业项目 ...