两个示例介绍JavaScript的闭包
2016-07-22 22:43
501 查看
JavaScript的闭包有两个用途:一个是访问函数内部的变量;另一个是让变量的值在作用域内保持不变。函数是JavaScript 中唯一有作用域的对象,因此JavaScript的闭包依赖于函数实现,下面结合两则示例对JavaScript的闭包做简单说明。
1. 访问函数内部的变量 JavaScript中没有严格意义上的类,所以我们常用函数来模拟类。我们可以像下面这样模拟一个Counter类,并在其中定义一个count私有变量:
在JavaScript中,函数可以访问其外部定义的变量,而外部不能访问函数内部定义的变量。要访问函数内部定义的变量,需要在其内部分定义一个闭包函数,通过调用闭包函数达到访问函数内部变量的目的。 在上面示例中,count相当于一个“私有变量”,在Counter函数外部不能访问这个变量。在Counter中,还定义了increment 和 get两个“闭包函数”,这两个函数都保持着对Counter作用域的引用,因此可以访问到Counter作用域内定义的变量count。
2. 保持变量的作用域 ECMASceript 2015(ES6)之前,JavaScript中没有块级变量(ES6中可以使用let定义块级变量),使用var定义的变量都是全局或函数级变量。
在上面的代码中,我们期望的依次输出数字0到9,而实际是输出是十次10。这是因为JavaScript只有函数级作用域,没有块级作用域。要解决这个问题,就要为变量构建一个作用域。解决方案如下:
方案一:在循环中使用闭包
方案二:匿名函数中返回一个函数
以上两种方案都是通过闭包(匿名函数)实现的,外部函数执行后i作为参数传入,此时函数内e变量就拥有了i的一个拷贝。变量传入匿名函数后相当于有了一个闭包的作用域,然后就得到了我们想要的结果。
作者:头条号 / IT笔录
链接:http://toutiao.com/a6305505621249933570/
来源:头条号(今日头条旗下创作平台)
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
1. 访问函数内部的变量 JavaScript中没有严格意义上的类,所以我们常用函数来模拟类。我们可以像下面这样模拟一个Counter类,并在其中定义一个count私有变量:
在JavaScript中,函数可以访问其外部定义的变量,而外部不能访问函数内部定义的变量。要访问函数内部定义的变量,需要在其内部分定义一个闭包函数,通过调用闭包函数达到访问函数内部变量的目的。 在上面示例中,count相当于一个“私有变量”,在Counter函数外部不能访问这个变量。在Counter中,还定义了increment 和 get两个“闭包函数”,这两个函数都保持着对Counter作用域的引用,因此可以访问到Counter作用域内定义的变量count。
2. 保持变量的作用域 ECMASceript 2015(ES6)之前,JavaScript中没有块级变量(ES6中可以使用let定义块级变量),使用var定义的变量都是全局或函数级变量。
在上面的代码中,我们期望的依次输出数字0到9,而实际是输出是十次10。这是因为JavaScript只有函数级作用域,没有块级作用域。要解决这个问题,就要为变量构建一个作用域。解决方案如下:
方案一:在循环中使用闭包
方案二:匿名函数中返回一个函数
以上两种方案都是通过闭包(匿名函数)实现的,外部函数执行后i作为参数传入,此时函数内e变量就拥有了i的一个拷贝。变量传入匿名函数后相当于有了一个闭包的作用域,然后就得到了我们想要的结果。
作者:头条号 / IT笔录
链接:http://toutiao.com/a6305505621249933570/
来源:头条号(今日头条旗下创作平台)
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
相关文章推荐
- JavaScript DOM 总结(一)
- JavaScript面向对象及原型的理解及笔记整理【一】
- jsp内置对象和el表达式
- jsp 三大指令和动作标签
- w3c js笔记
- jsonp和xml格式生成与调用
- JS实现常用排序算法—经典的轮子值得再造
- js-表单验证
- JavaScriptCookie&PHPCookie实现用户登录信息自动填入
- javascript之单击获得单词
- jsp中的Cookie
- jsp七大动作指令
- js学习笔记(比较全)
- 在js中如何实现与脱拽,移动,还有吸附功能
- 拼图游戏的艺术
- JSP中文乱码总结
- javascript面向对象学习笔记——创建对象(转)
- 入坑,使用第三方SDK开发mavenJspWeb项目
- Gson将json转Map的那些坑
- 使用正则表达式解析Url字符串