脚本宝典收集整理的这篇文章主要介绍了作用域与闭包，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

window.a  //得到的是全局定义的a变量；@H_406_93@
全局命名空间
库通常会在全局作用域中声明一个名字足够独特的变量，通常是一个对象。这个对象被用作
库的命名空间，所有需要暴露给外界的功能都会成为这个对象（命名空间）的属性，而不是将自己
的标识符暴漏在顶级的词法作用域中。
函数作用域的问题
我们已经知道，在任意代码片段外部添加包装函数，可以将内部的变量和函数定义“隐藏”起来，外
部作用域无法访问包装函数内部的任何内容。
虽然这种技术可以解决一些问题，但是它并不理想，因为会导致一些额外的问题。首先，必须声明
一个具名函数foo()，意味着foo这个名称本身“污染”了所在作用域（在这个例子中是全局作用域）。
其次，必须显式地通过函数名（foo()）调用这个函数才能运行其中的代码。

更加理想的方式

      

      
      button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="VAR a = 2;
(function foo(){ // <-- 添加这一行
    var a = 3;
    console.LOG( a ); // 3
})(); // <-- 以及这一行
console.log( a ); // 2" title="" data-original-title="复制">
      
      
var a = 2;
(function foo(){ // <-- 添加这一行
    var a = 3;
    console.log( a ); // 3
})(); // <-- 以及这一行
console.log( a ); // 2

以(function...而不仅是以function...开始。函数会被当作函数表达式而不是一个标准的函数声明 来处理。
函数声明和函数表达式之间最重要的区别是它们的名称标识符将会绑定在何处。foo被绑定在函数表达式自身的函数中而不是所在作用域中。
换句话说，(function foo(){ .. })作为函数表达式意味着foo只能在..所代表的位置中被访问，外

部作用域则不行。foo变量名被隐藏在自身中意味着不会非必要地污染外部作用域。
很多人都更喜欢另一个改进的形式：(function(){ .. }())。这两种形式在功能上是一致的。选择哪个全凭个人喜好.
块 作用域

      

      
      button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="for (var i=0; i<10; i++) {
console.log( i );
}" title="" data-original-title="复制">
      
      
for (var i=0; i<10; i++) {
console.log( i );
}
我们在for循环的头部直接定义了变量i，通常是因为只想在for循环内部的上下文中使用i，而忽
略了i会被绑定在外部作用域（函数或全局）中的事实。
JavaScript的ES3规范中规定try/catch的catch分句会创建一个块作用域，其中声明的变量仅在catch内部有效。

      

      
      
      
      
try {
undefined(); // 执行一个非法操作来强制制造一个异常
}c
atch (err) {
console.log( err ); // 能够正常执行！
} c
onsole.log( err ); // ReferenceError: err not found

ES6改变了现状，引入了新的let关键字，提供了除var以外的另一种变量声明方式
let关键字可以将变量绑定到所在的任意作用域中（通常是{ .. }内部）。只要声明是有效的，在声明中的任意位置都可以使用{ .. }括号来为let创建一个用于绑定的块。
为变量显式声明块作用域，并对变量进行本地绑定是非常有用的工具，可以让引擎清楚地知道没有必要继续保存那些变量（当块的变量没有被引用时就销毁）；
const
除了let以外，ES6还引入了const，同样可以用来创建块作用域变量，但其值是固定的（常量）。之后
任何试图修改值的操作都会引起错误。
提升
解析两个输出

      

      
      
      
      
a = 2;
var a;
console.log( a );//2

      

      
      
      
      
console.log( a ); //undefined
var a = 2;
编译器顺序
当你看到var a = 2;时，可能会认为这是一个声明。但JavaScript实际上会将其看成两个声 明：var a;和a =
2;。第一个定义声明是在编译阶段进行的。第二个赋值声明会被留在原地等待执 行阶段。
我们的第二个代码片段实际是按照以下流程处理的：

      

      
      @H_497_304@
      
      
var a;
console.log( a );
a = 2;
这个过程就好像变量和函数声明从它们在代码中出现的位置被“移动”到了最上面。这个过程就叫作 提升。
换句话说，先有蛋（声明）后有鸡（赋值）。
函数声明会优先于变量声明

      

      
      
      
      
foo(); // 1
var foo;
function foo() {
console.log( 1 );
} f
oo = function() {
console.log( 2 );
};
相当于

      

      
      
      
      
function foo() {
    console.log( 1 );
} 
foo(); // 1
foo = function() {
    console.log( 2 );
};
闭包
当函数可以记住并访问所在的词法作用域时，就产生了闭包，即使函数是在当前词法作用域之
外执行。
词法作用域就是定义在词法阶段的作用域。换句话说，词法作用域是由你在写代码时将 变量和块作用域写在哪里来决定的

      

      
      
      
      
function foo() {
    var a = 2;
function bar() {
    console.log( a );} r
    eturn bar;
} 
var baz = foo();
baz(); // 2 ———— 朋友， 这就是闭包的效果。

我们将bar()函数本身当作一个值类型进行传递。
函数bar()的词法作用域能够访问foo()的内部作用域。
在foo()执行后，其返回值（也就是内部的bar()函数）赋值给变量baz并调用baz()，实际上只是通过不同的标识符引用调用了内部的函数bar()。
因为我们知道引擎有垃圾回收器用来释放不再使用的内存空间。由于看上去foo()的内容不会再被使用，所以很自然地会考虑对其进行回收。在foo()执行后，通常会期待foo()的整个内部作用域都被销毁。
而闭包的“神奇”之处正是可以阻止这件事情的发生。事实上内部作用域依然存在，因此没有被回收。
谁在使用这个内部作用域？原来是bar()本身在使用。拜bar()所声明的位置所赐，它拥有涵盖foo()内部作用域的闭包，使得该作用域能够一直存活，以供bar()在之后任何时间进行引用。


bar()依然持有对该作用域的引用，而这个引用就叫作闭包。
无论通过何种手段将内部函数传递到所在的词法作用域以外，它都会持有对原始定义作用域的引
用，无论在何处执行这个函数都会使用闭包。
本质上无论何时何地，如果将函数（访问它们各自的词法作用域）当作第一级的值类型并到处传递，你就会看到闭包在这些函数中的应用。只要使用了回调函数，实际上就是在使用闭包！

一个神奇的例子

      

      
      
      
      
for (var i=1; i<=5; i++) {
    setTimeout( function timer() {
        console.log( i );
    }, i*1000 );
}

//每秒出现一个6

解析：延迟函数的回调会在循环结束时才执行。事实上，当定时器运行时即使每个迭代中执行的是setTimeout(..,
0)，所有的回调函数依然是在循环结束后才会被执行，因此会每次输出一个6出来。
我们试图假设循环中的每个迭代在运行时都会给自己“捕获”一个i的副本。但是根据作用域的工作原理，实际情况是尽管循环中的五个函数是在各个迭代中分别定义的，但是它们都被封闭在一个共享的全局作用域中，因此实际上只有一个i。

改进写法

      

      
      
      
      
for (var i=1; i<=5; i++) {
    (function(j) {
        setTimeout( function timer() {
            console.log( j );
        }, j*1000 );
    })( i );
}

//每秒从1到6依次输出
解析：在迭代内使用IIFE（自执行函数）会为每个迭代都生成一个新的作用域，使得延迟函数的回调可以将新的作用域封闭在每个迭代内部，每个迭代中都会含有一个具有正确值的变量供我们访问。
细说：

      

      
      
      
      
for (var i = 0; i <= 5; i++) {
       console.log(i)
}
我们都知道上面的代码可以输出1到6；因此可以明白

      

      
      
      
      
for (var i=1; i<=5; i++) {
    (function(j) {  })( i );
}

//这一层，是会不断的获取到正确的i值；
然后，由于延迟函数的回调 使用了闭包；每次闭包都会保存IIFE 的有正确值的作用域；
闭包的应用-- 模块
直接抄代码看：

      

      
      
      
      
function CoolModule() {
    var something = "cool";
    var another = [1, 2, 3];
    function DOSomething() {
        console.log( something );
    } 
    function doAnother() {
        console.log( another.join( " ! " ) );
    } 
    return {
        doSomething: doSomething,
        doAnother: doAnother
    };
} 
var foo = CoolModule();
foo.doSomething(); // cool
foo.doAnother(); // 1 ! 2 ! 3
很好理解，coolmodule（）返回一个对象，这个对象通过不同的标识符引用调用了内部的函数；这些函数就是coolmodule的闭包，具有访问coolmodule作用域的能力；
除了返回一个对象，还可以返回一个函数
从模块中返回一个实际的对象并不是必须的，也可以直接返回一个内部函数。jQuery就是
一个很好的例子。jQuery和$标识符就是jquery模块的公共API，但它们本身都是函数（由于函数也是对象，它们本身也可以拥有属性）。因此，jq的方法有两种，通过$.xxx() 运行的是jq的属性方法；通过$() 运行的是jq的函数方法；
闭包的应用-- 实现模块
模块模式需要具备两个必要条件。

必须有外部的封闭函数，该函数必须至少被调用一次（每次调用都会创建一个新的模块实例）。
封闭函数必须返回至少一个内部函数，这样内部函数才能在私有作用域中形成闭包，并且可以访问或者修改私有的状态。

单例模式

      

      
      
      
      
var foo = (function CoolModule() {
                var something = "cool";
                var another = [1, 2, 3];
                function doSomething() {
                console.log( something );
                } f
                unction doAnother() {
                console.log( another.join( " ! " ) );
                }return {
                doSomething: doSomething,
                doAnother: doAnother
                };
          })();
foo.doSomething(); // cool
foo.doAnother(); // 1 ! 2 ! 3
脚本宝典总结
       
以上是脚本宝典为你收集整理的作用域与闭包全部内容，希望文章能够帮你解决作用域与闭包所遇到的问题。
		
如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。
		
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。