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 相关文章推荐
JS控制表格隔行变色
Jun 26 Javascript
验证javascript中Object和Function的关系的三段简单代码
Jun 27 Javascript
XENON基于JSON变种
Jul 27 Javascript
json字符串之间的相互转换示例代码
Aug 21 Javascript
JavaScript中几种排序算法的简单实现
Jul 29 Javascript
js实现动态创建的元素绑定事件
Jul 19 Javascript
模板视图和AngularJS之间冲突的解决方法
Nov 22 Javascript
JavaScript基于扩展String实现替换字符串中index处字符的方法
Jun 13 Javascript
vuejs+element-ui+laravel5.4上传文件的示例代码
Aug 12 Javascript
JS实现问卷星自动填问卷脚本并在两秒自动提交功能
Jun 17 Javascript
vue中导出Excel表格的实现代码
Oct 18 Javascript
vue项目实现设置根据路由高亮对应的菜单项操作
Aug 06 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
一个域名查询的程序
2006/10/09 PHP
PHP fastcgi模式上传大文件(大约有300多K)报错
2014/09/28 PHP
php设计模式之单例模式实例分析
2015/02/25 PHP
Laravel实现ApiToken认证请求
2019/10/14 PHP
利用try-catch判断变量是已声明未声明还是未赋值
2014/03/12 Javascript
JavaScript设置body高度为浏览器高度的方法
2015/02/09 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
2016/08/05 Javascript
巧用数组制作图片切换js代码
2016/11/29 Javascript
js模糊查询实例分享
2016/12/26 Javascript
JavaScript获取URL参数的方法之一
2017/03/24 Javascript
Jquery EasyUI $.Parser
2017/06/02 jQuery
angularJS利用ng-repeat遍历二维数组的实例代码
2017/06/03 Javascript
浅谈JS对html标签的属性的干预以及对CSS样式表属性的干预
2017/06/25 Javascript
Vue监听事件实现计数点击依次增加的方法
2018/09/26 Javascript
vue 判断元素内容是否超过宽度的方式
2020/07/29 Javascript
推荐下python/ironpython:从入门到精通
2007/10/02 Python
python实现的一个p2p文件传输实例
2014/06/04 Python
Web服务器框架 Tornado简介
2014/07/16 Python
Python读取图片属性信息的实现方法
2016/09/11 Python
python实现发送邮件及附件功能
2021/03/02 Python
python下10个简单实例代码
2017/11/15 Python
python并发编程之线程实例解析
2017/12/27 Python
python之pandas用法大全
2018/03/13 Python
如何利用python查找电脑文件
2018/04/27 Python
python实现将文件夹下面的不是以py文件结尾的文件都过滤掉的方法
2018/10/21 Python
python try 异常处理(史上最全)
2019/03/07 Python
python文档字符串(函数使用说明)使用详解
2019/07/30 Python
python 常见的反爬虫策略
2020/09/27 Python
CSS3 filter(滤镜)实现网页灰色或者黑色模式的代码
2020/11/30 HTML / CSS
Geekbuying波兰:购买中国电子产品
2019/10/20 全球购物
销售行业个人求职自荐信
2013/09/25 职场文书
大学生入党自我鉴定
2013/10/31 职场文书
六一儿童节主持词
2014/03/21 职场文书
植物生产学专业求职信
2014/08/08 职场文书
Goland使用Go Modules创建/管理项目的操作
2021/05/06 Golang
只需要100行Python代码就可以实现的贪吃蛇小游戏
2021/05/27 Python