JavaScript匿名函数之模仿块级作用域


Posted in Javascript onDecember 12, 2015

匿名函数

函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途。

匿名函数:就是没有函数名的函数。

函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式

第一种:这也是最常规的一种

function double(x){
  return 2 * x;  
}

 第二种:这种方法使用了Function构造函数,把参数列表和函数体都作为字符串,很不方便,不建议使用。

var double = new Function('x', 'return 2 * x;');

 第三种:

var double = function(x) { return 2* x; }

 注意“=”右边的函数就是一个匿名函数,创造完毕函数后,又将该函数赋给了变量square。

JavaScript中是没有块级作用域概念的。也就是说,在块级语句中定义的变量,实际上是在包含函数中(外部函数)而非语句中创建的。

function outputNumber(count){ 
  for(var i=0;i<1000;i++){ 
    alert(i); 
  } 
  alert(i);  //count 
}

该函数在java、C#等语言中,变量i只会在for循环语句中有定义,循环结束,i也就被销毁了。但在JavaScript中,变量i是定义在outputNumber()活动对象中的,因此在它定义开始,就可以在函数内部访问它。即使重新声明同一个变量,也不会改变它的值。

function outputNumber(count){ 
  for(var i=0;i<1000;i++){ 
    alert(i); 
  } 
  var i;   //重新声明变量 
  alert(i);  //count 
}

匿名函数可以用来模仿块级作用域并避免这个问题,用作块级作用域(也称私有作用域)的匿名函数的语法如下:

(function(){ 
   //这是块级作用域 
})()

以上代码定义变调用了一个匿名函数,将函数声明包含在一个小括号里面,表示它是个函数表达式。紧跟其后的另一对小括号会立即调用这个函数。
无论什么时候,只要临时需要一些变量,就可以用私用作用域,例如:

function outputNumber(count){ 
  (function(){ 
  for(var i=0;i<1000;i++){ 
    alert(i); 
  })(); 
  alert(i);  //导致一个错误 
}

这样,我们在for循环外部插入了一个私有作用域。在匿名函数中定义的任何变量,都会在执行结束时被销毁。

这种技术经常在全局作用域中被用在函数外部,从而限制向全局作用域中添加过多的变量和函数。

一般来说,我们应该尽量减少向全局作用域中添加变量和函数。

这种做法可以减少闭包占用内存的问题,因为没有指向匿名函数的引用,只要函数执行完毕,就可以立即销毁其作用域链。

Javascript 相关文章推荐
XML的代替者----JSON
Jul 21 Javascript
JavaScript的类型简单说明
Sep 03 Javascript
jquery对象和DOM对象的区别介绍
Aug 09 Javascript
javascript判断两个IP地址是否在同一个网段的实现思路
Dec 13 Javascript
javaScript数组迭代方法详解
Apr 14 Javascript
Vue.js项目部署到服务器的详细步骤
Jul 17 Javascript
jquery插件开发之选项卡制作详解
Aug 30 jQuery
详解如何在React组件“外”使用父组件的Props
Jan 12 Javascript
vue实现跳转接口push 转场动画示例
Nov 01 Javascript
vscode 插件开发 + vue的操作方法
Jun 05 Javascript
Vue实现移动端拖拽交换位置
Jul 29 Javascript
Vue+Bootstrap收藏(点赞)功能逻辑与具体实现
Oct 22 Javascript
自定义Angular指令与jQuery实现的Bootstrap风格数据双向绑定的单选与多选下拉框
Dec 12 #Javascript
利用jQuery实现WordPress中@的ID悬浮显示评论内容
Dec 11 #Javascript
jQuery入门之层次选择器实例简析
Dec 11 #Javascript
jQuery使用$.ajax提交表单完整实例
Dec 11 #Javascript
jQuery使用$.ajax进行即时验证实例详解
Dec 11 #Javascript
JavaScript基础篇(6)之函数表达式闭包
Dec 11 #Javascript
jQuery弹簧插件编写基础之“又见弹窗”
Dec 11 #Javascript
You might like
PHP实现多条件查询实例代码
2010/07/17 PHP
php INI配置文件的解析实现分析
2011/01/04 PHP
PHP+sqlite数据库操作示例(创建/打开/插入/检索)
2016/05/26 PHP
Thinkphp5框架简单实现钩子(Hook)行为的方法示例
2019/09/03 PHP
JS类库Bindows1.3中的内存释放方式分析
2007/03/08 Javascript
jQuery 图片切换插件(代码比较少)
2012/05/07 Javascript
事件冒泡是什么如何用jquery阻止事件冒泡
2013/03/20 Javascript
简略说明Javascript中的= =(等于)与= = =(全等于)区别
2013/04/16 Javascript
jquery Validation表单验证使用详解
2020/09/12 Javascript
JS实现的新浪微博大厅文字内容滚动效果代码
2015/11/05 Javascript
jQuery手指滑动轮播效果
2016/12/22 Javascript
浅析从vue源码看观察者模式
2018/01/29 Javascript
使用vue-cli导入Element UI组件的方法
2018/05/16 Javascript
Angular6使用forRoot() 注册单一实例服务问题
2019/08/27 Javascript
JS实现导航栏楼层特效
2020/01/01 Javascript
在RedHat系Linux上部署Python的Celery框架的教程
2015/04/07 Python
用Python实现一个简单的能够上传下载的HTTP服务器
2015/05/05 Python
Django的分页器实例(paginator)
2017/12/01 Python
浅谈tensorflow1.0 池化层(pooling)和全连接层(dense)
2018/04/27 Python
Python多继承顺序实例分析
2018/05/26 Python
python获取指定字符串中重复模式最高的字符串方法
2018/06/29 Python
pycharm中显示CSS提示的知识点总结
2019/07/29 Python
详解一种用django_cache实现分布式锁的方式
2019/09/01 Python
pytorch 图像预处理之减去均值,除以方差的实例
2020/01/02 Python
python GUI库图形界面开发之PyQt5滚动条控件QScrollBar详细使用方法与实例
2020/03/06 Python
HTML5触摸事件实现移动端简易进度条的实现方法
2018/05/04 HTML / CSS
Alba Moda德国网上商店:意大利时尚女装销售
2016/11/14 全球购物
公司综合部的成员自我评价分享
2013/11/05 职场文书
社区工作者先进事迹
2014/01/18 职场文书
参观考察邀请函范文
2014/01/29 职场文书
就业推荐表自我鉴定
2014/03/21 职场文书
2014最新股权信托合同协议书
2014/11/18 职场文书
西部计划志愿者工作总结
2015/08/11 职场文书
简短清晨问候语
2015/11/10 职场文书
幼儿教师继续教育培训心得体会
2016/01/19 职场文书
基于HTML十秒做出淘宝页面
2021/10/24 HTML / CSS