JavaScript中匿名函数的用法及优缺点详解


Posted in Javascript onJune 01, 2016

匿名函数可以有效的保证在页面上写入Javascript,而不会造成全局变量的污染。

这在给一个不是很熟悉的页面增加Javascript时非常有效,也很优美。

一、什么是匿名函数?

在Javascript定义一个函数一般有如下三种方式:

函数关键字(function)语句:

function fnMethodName(x){alert(x);}

函数字面量(Function Literals):

var fnMethodName = function(x){alert(x);}

Function()构造函数:

var fnMethodName = new Function('x','alert(x);')

上面三种方法定义了同一个方法函数fnMethodName,

第1种就是最常用的方法,后两种都是把一个函数复制给变量fnMethodName,而这个函数是没有名字的,即匿名函数。

实际上,相当多的语言都有匿名函数。

二、函数字面量和Function()构造函数的区别

虽然函数字面量是一个匿名函数,但语法允许为其指定任意一个函数名,当写递归函数时可以调用它自己,使用Function()构造函数则不行。

var f = function fact(x) { if (x < = 1) return 1; else return x*fact(x-1); };

Function()构造函数允许运行时Javascript代码动态的创建和编译。在这个方式上它类似全局函数eval()。

Function()构造函数每次执行时都解析函数主体,并创建一个新的函数对象。所以当在一个循环或者频繁执行的函数中调用Function()构造函数的效率是非常低的。相反,函数字面量却不是每次遇到都重新编译的。

用Function()构造函数创建一个函数时并不遵循典型的作用域,它一直把它当作是顶级函数来执行。

var y = "global";

function constructFunction() { var y = "local"; return new Function("return y"); // 无法获取局部变量 } alert(constructFunction()()); // 输出 “global”和函数关键字定义相比Function()构造器有自己的特点且要难以使用的多,

所以这项技术通常很少使用。

而函数字面量表达式和函数关键字定义非常接近。

考虑前面的区别,虽然有消息说字面量的匿名函数在OS X 10.4.3下的某些webkit的引擎下有bug,

但我们平常所说的匿名函数均指采用函数字面量形式的匿名函数。

三、匿名函数的代码模式

错误模式:其无法工作,浏览器会报语法错。

function(){ alert(1); }();

函数字面量:首先声明一个函数对象,然后执行它。

(function(){ alert(1); } ) ( );

优先表达式:

( function(){ alert(2); } ( ) );

void操作符:

void function(){ alert(3); }()这三种方式是等同的,hedger wang因为个人原因比较喜欢第3种,而在实际应用中我看到的和使用的都是第1种。

四、匿名函数的应用

《Javascript的一种模块模式》中的第一句话就是“全局变量是魔鬼”。

配合var关键字,匿名函数可以有效的保证在页面上写入Javascript,而不会造成全局变量的污染。

这在给一个不是很熟悉的页面增加Javascript时非常有效,也很优美。

实际上,YUI以及其相应的范例中大量使用匿名函数,其他的Javascript库中也不乏大量使用。

Javascript的函数式编程(functional programming)的基石。

具体请看《用函数式编程技术编写优美的 JavaScript》和《函数式JavaScript编程指南》。

以上这篇JavaScript中匿名函数的用法及优缺点详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQuery的html(data)方法与&amp;lt;script&amp;gt;脚本块的解决方法
Mar 09 Javascript
使用jQuery的attr方法来修改onclick值
Jul 07 Javascript
JavaScript实现的内存数据库LokiJS介绍和入门实例
Nov 17 Javascript
angularjs中的e2e测试实例
Dec 06 Javascript
JavaScript简介
Feb 15 Javascript
jQuery中的Deferred和promise 的区别
Apr 03 Javascript
jQuery之简单的表单验证实例
Jul 07 Javascript
JQuery判断正整数整理小结
Aug 21 jQuery
react router 4.0以上的路由应用详解
Sep 21 Javascript
vue scroller返回页面记住滚动位置的实例代码
Jan 29 Javascript
ElementUI Tree 树形控件的使用并给节点添加图标
Feb 27 Javascript
vue 解决provide和inject响应的问题
Nov 12 Javascript
Bootstrap 折叠(Collapse)插件用法实例详解
Jun 01 #Javascript
Bootstrap 附加导航(Affix)插件实例详解
Jun 01 #Javascript
JS未跨域操作iframe里的DOM
Jun 01 #Javascript
jQuery实现的简单分页示例
Jun 01 #Javascript
jQuery简单实现上下,左右滑动的方法
Jun 01 #Javascript
jQuery实现背景弹性滚动的导航效果
Jun 01 #Javascript
jQuery Chart图表制作组件Highcharts用法详解
Jun 01 #Javascript
You might like
PHP4实际应用经验篇(6)
2006/10/09 PHP
PHP使用SOAP调用.net的WebService数据
2013/11/12 PHP
List Information About the Binary Files Used by an Application
2007/06/11 Javascript
Jquery CheckBox全选方法代码附js checkbox全选反选代码
2010/06/09 Javascript
js类型检查实现代码
2010/10/29 Javascript
避免回车键导致的页面无意义刷新的解决方法
2011/04/12 Javascript
js 输出内容到新窗口具体实现代码
2013/05/31 Javascript
jquery取消选择select下拉框示例代码
2014/02/22 Javascript
解决jquery版本冲突的有效方法
2014/09/02 Javascript
jQuery实现统计输入文字个数的方法
2015/03/11 Javascript
jQuery实现的左右移动焦点图效果
2016/01/14 Javascript
jQuery中Ajax全局事件引用方式及各个事件(全局/局部)执行顺序
2016/06/02 Javascript
JS命令模式例子之菜单程序
2016/10/10 Javascript
Node.JS中快速扫描端口并发现局域网内的Web服务器地址(80)
2017/09/18 Javascript
微信小程序基于slider组件动态修改标签透明度的方法示例
2017/12/04 Javascript
iview日期控件,双向绑定日期格式的方法
2018/03/15 Javascript
ES6与CommonJS中的模块处理的区别
2018/06/13 Javascript
axios对请求各种异常情况处理的封装方法
2018/09/25 Javascript
vue element-ui el-date-picker限制选择时间为当天之前的代码
2019/11/07 Javascript
原生js实现点击按钮复制内容到剪切板
2020/11/19 Javascript
JS实现页面侧边栏效果探究
2021/01/08 Javascript
[02:47]DOTA2亚洲邀请赛 HR战队出场宣传片
2015/02/07 DOTA
[01:06]DOTA2小知识课堂 Ep.02 吹风竟可解梦境缠绕
2019/12/05 DOTA
python实现mysql的单引号字符串过滤方法
2015/11/14 Python
python查看文件大小和文件夹内容的方法
2019/07/08 Python
Django url,从一个页面调到另个页面的方法
2019/08/21 Python
Python爬取破解无线网络wifi密码过程解析
2019/09/17 Python
Python assert关键字原理及实例解析
2019/12/13 Python
html5 css3实例教程 一款html5和css3实现的小机器人走路动画
2014/10/20 HTML / CSS
html5+css3进度条倒计时动画特效代码【推荐】
2016/03/08 HTML / CSS
信息与工商管理职业规划范文:为梦想而搏击
2014/09/11 职场文书
一份文言文检讨书
2014/09/13 职场文书
学生自我评语
2015/01/04 职场文书
生产车间主任岗位职责
2015/04/08 职场文书
信贷客户经理岗位职责
2015/04/09 职场文书
Mysql中mvcc各场景理解应用
2022/08/05 MySQL