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 相关文章推荐
一个js写的日历(代码部分网摘)
Sep 20 Javascript
Javascript 中的类和闭包
Jan 08 Javascript
jQuery事件 delegate()使用方法介绍
Oct 30 Javascript
javascript日期操作详解(脚本之家整理)
Sep 05 Javascript
JS实现网页游戏中滑块响应鼠标点击移动效果
Oct 19 Javascript
JavaScript实现瀑布流以及加载效果
Feb 11 Javascript
mui框架移动开发初体验详解
Oct 11 Javascript
基于vue展开收起动画的示例代码
Jul 05 Javascript
详解如何给React-Router添加路由页面切换时的过渡动画
Apr 25 Javascript
Vue 2.0 侦听器 watch属性代码详解
Jun 19 Javascript
vue 子组件watch监听不到prop的解决
Aug 09 Javascript
小程序实现tab标签页
Nov 16 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的ajax框架xajax入门与试用介绍
2010/12/19 PHP
PHP和C#可共用的可逆加密算法详解
2015/10/26 PHP
CodeIgniter分页类pagination使用方法示例
2016/03/28 PHP
php中替换字符串函数strtr()和str_repalce()的用法与区别
2016/11/25 PHP
php7 图形用户界面GUI 开发示例
2020/02/22 PHP
javascript XMLHttpRequest对象全面剖析
2010/04/24 Javascript
10个基于浏览器的JavaScript调试工具分享
2013/02/07 Javascript
jquery中通过父级查找进行定位示例
2013/06/28 Javascript
jquery组件使用中遇到的问题整理及解决
2014/02/21 Javascript
JS+CSS实现简单的二级下拉导航菜单效果
2015/09/21 Javascript
一个超简单的jQuery回调函数例子(分享)
2016/08/08 Javascript
Vue方法与事件处理器详解
2016/12/01 Javascript
Vue项目中最新用到的一些实用小技巧
2018/11/06 Javascript
C#程序员入门学习微信小程序的笔记
2019/03/05 Javascript
[57:38]2018DOTA2亚洲邀请赛3月30日 小组赛A组 OpTic VS OG
2018/03/31 DOTA
Python+django实现文件上传
2016/01/17 Python
多版本Python共存的配置方法
2017/05/22 Python
python实现报表自动化详解
2017/11/16 Python
Python实现判断给定列表是否有重复元素的方法
2018/04/11 Python
Python3爬虫学习之MySQL数据库存储爬取的信息详解
2018/12/12 Python
Python中super函数用法实例分析
2019/03/18 Python
python sorted函数的小练习及解答
2019/09/18 Python
Python如何省略括号方法详解
2020/03/21 Python
python快速安装OpenCV的步骤记录
2021/02/22 Python
Lookfantastic意大利官网:英国知名美妆购物网站
2019/05/31 全球购物
新加坡网上美容店:Hermo新加坡
2019/06/19 全球购物
给定一个时间点,希望得到其他时间点
2013/11/07 面试题
大学生毕业自我鉴定
2013/11/06 职场文书
公司新员工的演讲稿注意事项
2014/01/01 职场文书
医学生职业生涯规划书范文
2014/03/13 职场文书
中学生运动会新闻稿
2014/09/24 职场文书
财务部岗位职责
2015/02/03 职场文书
2016大学迎新欢迎词
2015/09/29 职场文书
PyTorch 如何检查模型梯度是否可导
2021/06/05 Python
ConstraintValidator类如何实现自定义注解校验前端传参
2021/06/18 Java/Android
SQL实现LeetCode(197.上升温度)
2021/08/07 MySQL