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 相关文章推荐
网上抓的一个特效
May 11 Javascript
xml文档转换工具,附图表例子(hta)
Nov 17 Javascript
jQuery EasyUI API 中文文档 - Spinner微调器使用
Oct 21 Javascript
基于jquery的文章中所有图片width大小批量设置方法
Aug 01 Javascript
详解JavaScript中Date.UTC()方法的使用
Jun 12 Javascript
JS实现淘宝支付宝网站的控制台菜单效果
Sep 28 Javascript
jQuery封装的屏幕居中提示信息代码
Jun 08 Javascript
Js得到radiobuttonlist选中值的两种方法(推荐)
Aug 25 Javascript
关于javascript sort()排序你可能忽略的一点理解
Jul 18 Javascript
在小程序中使用腾讯视频插件播放教程视频的方法
Jul 10 Javascript
详解微信小程序开发(项目从零开始)
Jun 06 Javascript
vue 项目引入echarts 添加点击事件操作
Sep 09 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
PHP常用函数和常见疑难问题解答
2014/03/05 PHP
PHP输出一个等腰三角形的方法
2015/05/12 PHP
thinkphp 字母函数详解T/I/N/D/M/A/R/U
2017/04/03 PHP
插件:检测javascript的内存泄漏
2007/03/04 Javascript
JQUERY设置IFRAME的SRC值的代码
2010/11/30 Javascript
使用jquery为table动态添加行的实现代码
2011/03/30 Javascript
jquery 结合C#后台的数组对文章的关键字自动添加链接的代码
2011/07/15 Javascript
原生js实现移动端瀑布流式代码示例
2015/12/18 Javascript
使用JavaScript脚本判断页面是否在微信中被打开
2016/03/06 Javascript
jQuery实现图片向左向右切换效果的简单实例
2016/05/18 Javascript
js发送短信倒计时的简单实现方法
2016/09/08 Javascript
easyui tree带checkbox实现单选的简单实例
2016/11/07 Javascript
利用vue和element-ui设置表格内容分页的实例
2018/03/02 Javascript
JS限制输入框输入的实现代码
2018/07/02 Javascript
JavaScript中filter的用法实例分析
2019/02/27 Javascript
VUE+elementui组件在table-cell单元格中绘制微型echarts图
2020/04/20 Javascript
Python中input和raw_input的一点区别
2014/10/21 Python
python使用fileinput模块实现逐行读取文件的方法
2015/04/29 Python
python变量不能以数字打头详解
2016/07/06 Python
Python爬虫DOTA排行榜爬取实例(分享)
2017/06/13 Python
python中使用iterrows()对dataframe进行遍历的实例
2018/06/09 Python
python DataFrame 取差集实例
2019/01/30 Python
python使用MQTT给硬件传输图片的实现方法
2019/05/05 Python
PyInstaller的安装和使用的详细步骤
2020/06/02 Python
海外淘书首选:AbeBooks
2017/07/31 全球购物
Wojas罗马尼亚网站:波兰皮鞋品牌
2018/11/01 全球购物
网络安全方面的面试题
2015/11/04 面试题
介绍下Java中==和equals的区别
2013/09/01 面试题
车间工艺员岗位职责
2013/12/09 职场文书
中医临床专业自我鉴定范文
2014/01/15 职场文书
普罗米修斯教学反思
2014/02/06 职场文书
师德师风自我剖析材料
2014/09/27 职场文书
2016年度创先争优活动总结
2016/04/05 职场文书
有趣的二维码:使用MyQR和qrcode来制作二维码
2021/05/10 Python
图片批量处理 - 尺寸、格式、水印等
2022/03/07 杂记
Pytorch中使用ImageFolder读取数据集时忽略特定文件
2022/03/23 Python