Javascript闭包

看了很多关于闭包的介绍,感觉阮一峰写的还是比较容易理解的,本文也参考了阮一峰的《学习Javascript闭包(Closure)》
闭包其中一个用途就是可以读取函数内部的变量。Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量。想更好的理解闭包需要先从变量的作用域入手

一、变量的作用域
变量的作用域无非就是两种:全局变量和局部变量。
Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量。

Js代码:
  1. function f1(){
  2.     alert(n);
  3.   }
  4. f1();//999
复制代码

另一方面,在函数外部自然无法读取函数内的局部变量。
Js代码: 
  1. function f1(){
  2.   var n=999;
  3. }
  4. alert(n); // error
复制代码
 
 
这里有一个地方需要注意,函数内部声明变量的时候,一定要使用var命令。如果不用的话,你实际上声明了一个全局变量!
Js代码
  1. function f1(){
  2.     n=999;
  3.   }
  4. f1();
  5. alert(n); // 999
复制代码
--------------------------------------------------------------------------------------------------------------------------------

二、如何从外部读取局部变量?
出于种种原因,我们有时候需要得到函数内的局部变量。但是,前面已经说过了,正常情况下,这是办不到的,只有通过变通方法才能实现。
那就是在函数的内部,再定义一个函数。
Js代码
  1. function f1(){
  2.   n=999;
  3.   function f2(){
  4.   alert(n); // 999
  5.    }
  6.   }
复制代码
 
在上面的代码中,函数f2就被包括在函数f1内部,这时f1内部的所有局部变量,对f2都是可见的。但是反过来就不行,f2内部的局部变量,对f1 就是不可见的。这就是Javascript语言特有的“链式作用域”结构(chain scope),
子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
既然f2可以读取f1中的局部变量,那么只要把f2作为返回值,我们不就可以在f1外部读取它的内部变量了吗!
Js代码:
  1. function f1(){
  2. n=999;
  3. function f2(){
  4.   alert(n);
  5. }
  6. return f2;
  7. }
  8. var result=f1();
  9. result(); // 999
复制代码

--------------------------------------------------------------------------------------------------------


三、.什么是闭包?
闭包 是指有权访问另一个函数作用域中的变量的函数。好像有点抽象,看下面的图

dfe7.tmp.png 

在f1中,一个局部变量 n,一个函数 f2,f2 里面可以访问到 n 变量,f2就是闭包。也就是说,「函数」和「函数内部能访问到的变量」(也叫环境)的总和,就是一个闭包。
那么问题来了:

(1)为什么要函数套函数呢?

我们有时候我需要得到函数的内的局部变量,正常情况下是做不到的,于是就通过在函数的内部在定义一个函数的方法来实现。
(2)为什么要 return f2呢?

如果不return f2,我们就无法使用这个闭包。当然,把 return f2 改成 window.f2 = f2 也是一样的
--------------------------------------------------------------------------------------------------------

四、闭包的用途
闭包常常被用来“间接访问一个变量”

假设我们在做一个抢购火车票,在写其中关于「还剩几张火车票」的代码。
如果不用闭包,你可以直接用一个全局变量:
window.tickets = 30 // 还有三十张票
这样看起来很不妥。万一不小心把这个值改成 0了怎么办。为了不让别人直接访问这个变量,就用局部变量,并且这个局部变量可以被别人访问。
于是我们可以写一个函数,让别人也能间接访问
代码如下:

  1. !function train(){
  2.   var tickets= 50
  3.   window.addTickets  = function(){
  4.     tickets += 1
  5.   }
  6.   window.deleTickets = function(){
  7.     tickets -= 1
  8.   }
  9. }()
复制代码
那么在其他的 JS 文件,就可以使用window.addTickets() 来增加票数,使用window.deleTickets来减少票数。

参考文献:Javascript闭包——懂不懂由你,反正我是懂了_知识库_博客园  http://kb.cnblogs.com/page/110782/

学习Javascript闭包(Closure) - 阮一峰的网络日志  http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html
原文地址:https://www.cnblogs.com/haoerlv/p/7234726.html