JavaScript 申明函数的三种方法 每个函数就是一个对象(一)


Posted in Javascript onDecember 04, 2009

一、申明函数的三种方法 (Declaring a Function)
方法一:function functionName([parameters]){functionBody};

Example D1

function add(a, b) 
{ 
return a+b; 
} 
alert(add(1,2)); // produces 3

当我们这样申明函数时,函数的内容被解释(但没有执行,要我们调用该函数才会执行),同时,一个名为add的对象已经建立。

方法二:将一个未命名的函数function赋给一个指定变量(var)

Example D2

var add=function(a, b) 
{ 
return a+b; 
} 
alert(add(1,2)); // produces 3

这种申明的语法看起来怪异,但它可以帮助我们更好地理解“函数即对象”。通过这种方式申明的函数的内容,同样是被解释,而未被执行。
同时,我们还可以这样定义:

Example D2A:

var add=function theAdd(a, b) 
{ 
return a+b; 
} 
alert(theAdd(1,2)); // produces 3 
alert(add(1,2)); // also produces 3

由上面一个例子可以看出,我们既可以通过函数名theAdd调用函数,也可以通过指定的函数变量名add调用函数。

Example D2B:

var myObject=new Object(); 
myObject.add=function(a,b){return a+b}; 
// myObject now has a property/a method named "add" 
// and I can use it like below 
myObject.add(1, 2);

而这个例子表明,当我们需要将一个自定义函数作为某个对象的属性时,这种函数申明方法是非常有用的,它更接近OOP的思想。

方法三:使用new运算符申明函数

varName=new Function([param1Name, param2Name,...paramNName], functionBody);

Example D3:

var add=new Function("a", "b", "return a+b;"); 
alert(add(3,4)); // produces 7

这里有两个参数a和b,以及一个函数体,返回a+b。同时请注意,new Function(……),这里使用的是大写Function,而不是小写function,这就表明,我们是要建立一个Function对象(回想下new Object()建立一个Object对象)。同时,我们也可以看出,前面的参数名和后面的函数体都是通过字符串形式传递(注意:它们都加了双引号)。我们可以有许多个参数,JavaScript会自动判别函数体,通常是离右边括号最近的那一个参数。当然,我们不一定非得将所有的代码写在同一行,我们可以分多行写,中间使用“+”或者“\”进行联接。“+”和“\”告诉我们,JavaScript将要在下一行寻找剩余的代码。

Example D3A

var add=new Function("a", "b", 
"alert" + // chop string using "+" 
"('adding '+a+' and ' +b);\ // separate string using "\" 
return a+b;"); 
alert(add(3,4)); // produces 7

当然,通过这种方式申明函数,函数体没有被解释(要直到运行时才被解释),这样便导致了性能的降低。为什么呢?请看下面的例子:

Example D3B

function createMyFunction(myOperator) 
{ 
return new Function("a", "b", "return a" + myOperator + "b;"); 
} 
var add=createMyFunction("+"); // creates "add" function 
var subtract=createMyFunction("-"); // creates "subtract" function 
var multiply=createMyFunction("*"); // created "multiply" function 
// test the functions 
alert("result of add="+add(10,2)); // result is 12 
alert("result of substract="+subtract(10,2)); // result is 8 
alert("result of multiply="+multiply(10,2)); // result is 20 
alert(add);

这个例子比较有趣,它在执行时可以通过传递参数(myOperator)分别创建了三个不同的Function对象。然后解释器在意图解释createMyFunction的时候,对return中的“运算符”具体是什么不清楚,从而无法解释,这样,性能自然打了折扣。
当然,当我们有特殊用途,如允许用户去创建他们自定义的函数时,我们可以采用这种函数申明方式,不过我们还是应尽量避免这样使用。

Javascript 相关文章推荐
javascript 三种编解码方式
Feb 01 Javascript
HTML Color Picker(js拾色器效果)
Aug 27 Javascript
jQuery过滤选择器用法分析
Feb 10 Javascript
Javascript中String的常用方法实例分析
Jun 13 Javascript
理解javascript封装
Feb 23 Javascript
jQuery简单实现中间浮窗效果
Sep 04 Javascript
Jquery UI实现一次拖拽多个选中的元素操作
Dec 01 Javascript
jQuery实现table中两列CheckBox只能选中一个的示例
Sep 22 jQuery
vue.js使用v-pre与v-html输出HTML操作示例
Jul 07 Javascript
Vue实现点击当前元素以外的地方隐藏当前元素(实现思路)
Dec 04 Javascript
9种方法优化jQuery代码详解
Feb 04 jQuery
小程序实现上传视频功能
Aug 18 Javascript
javascript 跳转代码集合
Dec 03 #Javascript
javascript KeyDown、KeyPress和KeyUp事件的区别与联系
Dec 03 #Javascript
javascript json 新手入门文档
Dec 03 #Javascript
js 屏蔽鼠标右键脚本附破解方法
Dec 03 #Javascript
33种Javascript 表格排序控件收集
Dec 03 #Javascript
javascript 面向对象全新理练之原型继承
Dec 03 #Javascript
javascript 面向对象全新理练之继承与多态
Dec 03 #Javascript
You might like
PHP 遍历文件实现代码
2011/05/04 PHP
php实现上传图片保存到数据库的方法
2015/02/11 PHP
Laravel框架运行出错提示RuntimeException No application encryption key has been specified.解决方法
2019/04/02 PHP
HTTP头隐藏PHP版本号实现过程解析
2020/12/09 PHP
刷新时清空文本框内容的js代码
2007/04/23 Javascript
img标签中onerror用法
2009/08/13 Javascript
JSON+JavaScript处理JSON的简单例子
2013/03/20 Javascript
javascript表单验证使用示例(javascript验证邮箱)
2014/01/07 Javascript
JS基于FileSystemObject创建一个指定路径的TXT文本文件
2015/08/05 Javascript
JS实现先显示大图后自动收起显示小图的广告代码
2015/09/04 Javascript
JavaScript获取当前cpu使用率的方法
2015/12/15 Javascript
select下拉框插件jquery.editable-select详解
2017/01/22 Javascript
详解用Node.js实现Restful风格webservice
2017/09/29 Javascript
angular实现页面打印局部功能的思考与方法
2018/04/13 Javascript
Vue实现表格中对数据进行转换、处理的方法
2018/09/06 Javascript
node 文件上传接口的转发的实现
2019/09/23 Javascript
Python产生Gnuplot绘图数据的方法
2018/11/09 Python
python打包成so文件过程解析
2019/09/28 Python
python打印直角三角形与等腰三角形实例代码
2019/10/20 Python
Python栈的实现方法示例【列表、单链表】
2020/02/22 Python
Python 之 Json序列化嵌套类方式
2020/02/27 Python
使用Python将Exception异常错误堆栈信息写入日志文件
2020/04/08 Python
用纯css3实现的图片放大镜特效效果非常不错
2014/09/02 HTML / CSS
CSS3实现线性渐变用法示例代码详解
2020/08/07 HTML / CSS
调用HTML5的Canvas API绘制图形的快速入门指南
2016/06/17 HTML / CSS
canvas 橡皮筋式线条绘图应用方法
2019/02/13 HTML / CSS
介绍一下OSI七层模型
2012/07/03 面试题
Shell编程面试题
2012/05/30 面试题
护士自我评价
2014/02/01 职场文书
村干部承诺书
2014/03/28 职场文书
2014国庆节主题活动方案:快乐的国庆节
2014/09/16 职场文书
单位租房协议范本
2014/12/03 职场文书
2015年质检工作总结
2015/05/04 职场文书
运动会新闻报道稿
2015/07/22 职场文书
如何书写读后感?(附范文)
2019/07/26 职场文书
Django Paginator分页器的使用示例
2021/06/23 Python