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 相关文章推荐
jQuery结合Json提交数据到Webservice,并接收从Webservice返回的Json数据
Feb 18 Javascript
js控制浏览器全屏示例代码
Feb 20 Javascript
js动态修改整个页面样式达到换肤效果
May 23 Javascript
jQuery中:only-child选择器用法实例
Jan 03 Javascript
PHP+jQuery+Ajax实现多图片上传效果
Mar 14 Javascript
JavaScript文档碎片操作实例分析
Dec 12 Javascript
Jquery实现简单的轮播效果(代码管用)
Mar 14 Javascript
Angular工具方法学习
Dec 26 Javascript
微信小程序page的生命周期和音频播放及监听实例详解
Apr 07 Javascript
elementUI Vue 单个按钮显示和隐藏的变换功能(两种方法)
Sep 04 Javascript
在vue项目中使用Jquery-contextmenu插件的步骤讲解
Jan 27 jQuery
JavaScript小技巧带你提升你的代码技能
Sep 15 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运行环境配置与开发环境的配置(图文教程)
2013/06/04 PHP
ThinkPHP中I(),U(),$this->post()等函数用法
2014/11/22 PHP
Thinkphp调用Image类生成缩略图的方法
2015/03/07 PHP
[原创]php简单防盗链验证实现方法
2016/07/09 PHP
基于php+MySql实现学生信息管理系统实例
2020/08/04 PHP
一个js写的日历(代码部分网摘)
2009/09/20 Javascript
节点的插入之append()和appendTo()的用法介绍
2014/01/13 Javascript
Lua表达式和控制结构学习笔记
2014/12/15 Javascript
基于Jquery代码实现手风琴菜单
2015/11/19 Javascript
完美实现bootstrap分页查询
2015/12/09 Javascript
JS实现alert中显示换行的方法
2015/12/17 Javascript
jquery实现简单的遮罩层
2016/01/08 Javascript
Html5+jQuery+CSS制作相册小记录
2016/12/30 Javascript
详解在Angularjs中ui-sref和$state.go如何传递参数
2017/04/24 Javascript
js canvas实现适用于移动端的百分比仪表盘dashboard
2017/07/18 Javascript
javascript实现Emrips反质数枚举的示例代码
2017/12/06 Javascript
实例讲解JavaScript截取字符串
2018/11/30 Javascript
微信小程序实现批量倒计时功能
2020/11/01 Javascript
vue 解决addRoutes多次添加路由重复的操作
2020/08/04 Javascript
JavaScript实现简单日历效果
2020/09/11 Javascript
JavaScript中arguments的使用方法详解
2020/12/20 Javascript
利用 JavaScript 实现并发控制的示例代码
2020/12/31 Javascript
[01:28:24]NAVI vs VG Supermajor 败者组 BO3 第三场 6.5
2018/06/06 DOTA
python 的列表遍历删除实现代码
2020/04/12 Python
Python数据类型详解(一)字符串
2016/05/08 Python
如何使用 Pylint 来规范 Python 代码风格(来自IBM)
2018/04/06 Python
Django的models模型的具体使用
2019/07/15 Python
Python实用库 PrettyTable 学习笔记
2019/08/06 Python
python批量生成条形码的示例
2020/10/10 Python
Python random模块的使用示例
2020/10/10 Python
HTML5 textarea高度自适应的两种方案
2020/04/08 HTML / CSS
小型女装店的创业计划书
2014/01/09 职场文书
暑期培训班策划方案
2014/08/26 职场文书
2014年小学生教师节演讲稿范文
2014/09/10 职场文书
导游词之上海杜莎夫人蜡像馆
2019/11/22 职场文书
Java Dubbo框架知识点梳理
2021/06/26 Java/Android