闭包(Closure)

本文聚焦于回答2个问题:

  1. 在全局作用域中,如何读取函数内部的局部变量?
  2. 在全局作用域中,如何修改函数内部的局部变量?

变量作用域

JavaScript语言的作用域,一句话概括就是:内层函数可以访问外层函数的变量,而外层函

数不可以访问内层函数的变量。

在内层函数中定义的变量如果没使用var关键词,则该变量变为全局变量。通过这种方法定义

的全局变量,要在此函数执行后才有效。请看下面代码:

function outer() {
n = 820; function inner() {
he = 835;
} return inner;
} // console.log(n);
// n is not defined
// 上面的错误会打断程序执行,如要测试下面的代码,需注释掉上面的代码 outer();
console.log(n); // 820 // console.log(he);
// n is not defined (outer())();
console.log(he); // 835

如何从外部读取局部变量

通过闭包可以实现在全局作用域中访问函数内部变量。

function outer() {
var n = 820; function inner() {
return n;
} return inner;
} var k = (outer())();
console.log(k); // 820

outer()函数执行一次,将返回inner()函数的引用,再执行一次inner()

函数,就成功的把局部变量n返回出来。从而实现从外部读取内部变量。

如何从外部修改局部变量

通过闭包可以实现在全局作用域中修改函数内部变量。

var n = "hello";

function outer() {
var n = 820; function get() {
return n;
} function inc() {
n++;
} return {
n: n,
get: get,
inc: inc
};
} var result = outer(); console.log( result.n ); // 820
console.log( result.get() ); // 820 result.inc();
console.log( result.get() ); // 821
result.inc();
console.log( result.get() ); // 822 console.log( result.n ); // 820

outer()函数返回一个对象,这个对象有1个属性,2个方法。正常情况下一个

函数调用完毕,其内部的变量将会被垃圾回收机制(garbage collection)回收。

也就是说这些变量已经不存在内存中,也没有办法读取这些变量的值,更没法修改。

但是,我们把outer()函数的返回值赋给了一个全局变量,全局变量是始终存在

内存中的,而这个全局变量result又使用到了outer()函数的局部变量,所以

outer()函数的局部变量,不会被清除,将一直保存在内存中。

因此,只要我们执行一次result.inc(), outer()函数里面的n就会增加1。

而我们通过result.get()就可以访问到outer()函数里面的n

要注意result.n的值始终是820,这里面的820只是n变量的一个副本,一旦

outer()函数执行完毕,result.n就和n没有关系了。

注意事项

由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包

,否则会造成网页的性能问题。

参考资料

http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html

闭包(Closure)基础分析的更多相关文章

  1. JavaScript闭包(Closure)

    JavaScript闭包(Closure) 本文收集了多本书里对JavaScript闭包(Closure)的解释,或许会对理解闭包有一定帮助. <你不知道的JavsScript> Java ...

  2. 聊一下JS中的作用域scope和闭包closure

    聊一下JS中的作用域scope和闭包closure scope和closure是javascript中两个非常关键的概念,前者JS用多了还比较好理解,closure就不一样了.我就被这个概念困扰了很久 ...

  3. python 函数对象(函数式编程 lambda、map、filter、reduce)、闭包(closure)

    1.函数对象 作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 秉承着一切皆对象的理念,我们再次回头来看函数(function).函 ...

  4. 深入理解JavaScript闭包(closure)

    最近在网上查阅了不少javascript闭包(closure)相关的资料,写的大多是非常的学术和专业.对于初学者来说别说理解闭包了,就连文字叙述都很难看懂.撰写此文的目的就是用最通俗的文字揭开Java ...

  5. [转] Java内部类之闭包(closure)与回调(callback)

    闭包(closure)是一个可调用的对象,它记录了一些信息,这些信息来自于创建它的作用域.通过这个定义,可以看出内部类是面向对象的闭包,因为它 不仅包含外围类对象(创建内部类的作用域)的信息,还自动拥 ...

  6. JavaScript 进阶(四)解密闭包closure

    闭包(closure)是什么东西 我面试前端基本都会问一个问题"请描述一下闭包".相当多的应聘者的反应都是断断续续的词,“子函数”“父函数”“变量”,支支吾吾的说不清楚.我提示说如 ...

  7. [转载]学习Javascript闭包(Closure)

    学习Javascript闭包(Closure)     源地址: http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures ...

  8. Swift语言精要-闭包(Closure)

    闭包(Closure)这个概念如果没学过Swift的人应该也不会陌生. 学过Javascript的朋友应该知道,在Javascript中我们经常会讨论闭包,很多前端工程师的面试题也会问到什么是闭包. ...

  9. 【Python】闭包Closure

    原来这就是闭包啊... 还是上次面试,被问只不知掉js里面的闭包 闭包,没听过啊...什么是闭包 回来查了下,原来这货叫闭包啊...... —————————————————————————————— ...

  10. 闭包(Closure)和匿名函数(Anonymous function)/lambda表达式的区别

    闭包(Closure)和匿名函数(Anonymous function)/lambda表达式的区别 函数最常见的形式是具名函数(named function): function foo(){ con ...

随机推荐

  1. 把angular项目整合到.net mvc中

    之前的开发选择的是完全舍弃服务端,仅保留最简单web服务器提供angular经打包的静态资源,此外所有的业务与数据请求都访问一个分离的WebApi来实现.不过最近碰到一个需求,有必要使用多个客户端,而 ...

  2. js判断一个数组是否为空

    var s = []; if(s.length == 0){ alert('空数组'); }

  3. php几行代码实现CSV格式文件输出

    //适用于不需要设置格式简单将数据导出的程序,多多指教...... $str .= 'pro_code'.','.'words'.'\n';//首先写入表格标题栏 foreach($is_error ...

  4. 门控开关项目--整流桥分析,LED限流电阻选择

    完整的原理图 常见电阻 常见的精度分为5% 和1%精度,碳膜电阻5%精度,金属膜电阻1%精度. 常见的阻值有 10R, 100R, 330R, 1K, 2K, 3K, 5.1K, 10K, 15K, ...

  5. Wireshark初步入门

    第一次捕获数据包 为了能让Wireshark得到一些数据包,你可以开始你的第一次数据包捕获实验了.你可能会想:"当网络什么问题都没有的时候,怎么能捕获数据包呢?" 首先,网络总是有 ...

  6. vijos1051题解

    题目: 圣诞老人回到了北极圣诞区,已经快到12点了.也就是说极光表演要开始了.这里的极光不是极地特有的自然极光景象.而是圣诞老人主持的人造极光. 轰隆隆--烟花响起(来自中国的浏阳花炮之乡).接下来就 ...

  7. View学习(二)-View的测量(measure)过程

    在上一篇文章中,我们介绍了DecorView与MeasureSpec, 下面的文章就开始讨论View的三大流程. View的三大流程都是通过ViewRoot来完成的.ViewRoot对应于ViewRo ...

  8. Jenkins-FQA

    1.svn url不能设置成文件路径,而应该是"文件夹"路径,也就是说必须是目录. 示例: Checking out https://svn.gw.com.cn:10000/svn ...

  9. SSH中的Invalid action class configuration that references an unknown class named.......

    最近用SSH框架做项目的时候页面提交数据到后台,遇到了这个问题,百度了一下,网上的解决办法无非两种: 1.检查struts.xml  ,applicationContext.xml的配置是否正确 2. ...

  10. 无法启动 IIS Express Web 服务器

    问题描述:我用的是vs2015,有时候打开自己的项目,点击调试运行,会失败,弹出窗口,告诉我,无法启动 IIS Express Web 服务器,我就纳闷了,刚才还好好,怎么这会就不行了,各种试,都不行 ...