有趣的JavaScript闭包
1、变量的作用域
函数内部可以直接读取全局变量
var n=999; function f1(){ alert(n); } f1(); // 999 在函数的外部无法读取局部变量的值
function f1(){ var n=999; } alert(n); // error 注意：函数内部声明变量一定要使 用var，否则会是全局变量
function f1(){ n=999; } f1(); alert(n); // 999 那么如何从外部读取局部变量的，下面给出一例子
function f1(){ n=999; function f2(){ alert(n); // 999 } } 在上面的代码中，函数f2就被包括在函数f1内部，这时f1内部的所有局部变量，对f2都是可见的。但是反过来就不行，f2内部的局部变量，对f1 就是不可见的。这就是Javascript语言特有的“链式作用域”结构（chain scope）。子对象会一级一级地向上寻找所有父对象的变量。所以，父对象的所有变量，对子对象都是可见的，反之则不成立。既然f2可以读取f1中的局部变量，那么只要把f2作为返回值，我们不就可以在f1外部读取它的内部变量
function f1(){ n=999; function f2(){ alert(n); } return f2; } var result=f1(); result(); // 999 2、闭包的概念
简单的理解， 闭包 就是能够读取其他函数内部变量的函数。
由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。
所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。
闭包的用途：
- 读取函数内部的局部变量
- 让变量的值始终保持在内存中
如下代码：
function f1(){ var n=999; nAdd=function(){n+=1} function f2(){ alert(n); } return f2; } var result=f1(); result(); // 999 nAdd(); result(); // 1000 注意 ：使用闭包要注意的问题
- 由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题
- 闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象（object）使用，把闭包当作它的公用方法（Public Method），把内部变量当作它的私有属性（private value），这时一定要小心，不要随便改变父函数内部变量的值
当内部函数 在定义它的作用域 的外部 被引用时,就创建了该内部函数的闭包 ,如果内部函数引用了位于外部函数的变量,当外部函数调用完毕后,这些变量在内存不会被 释放,因为闭包需要它们。
代码如下：
function outerFun() { var a=0; function innerFun() { a++; alert(a); } return innerFun; //注意这里 } var obj=outerFun(); obj(); //结果为1 obj(); //结果为2 var obj2=outerFun(); obj2(); //结果为1 obj2(); //结果为2 为了更好的理解闭包。下面在看看几组代码
function outerFun() { var a =0; alert(a); } var a=4; outerFun(); alert(a); 结果是 0,4 . 因为在函数内部使用了var关键字 维护a的作用域在outFun()内部. function outerFun() { //没有var a =0; alert(a); } var a=4; outerFun(); alert(a); 结果为 0,0 真是奇怪,为什么呢?
作用域链是描述一种路径的术语,沿着该路径可以确定变量的值 .当执行a=0时,因为没有使用var关键字,因此赋值操作会沿着作用域链到var a=4; 并改变其值.
如何创建一个闭包呢？通过如下代码理解
function a() { var i = 0; function b() { alert(++i); } return b; } var c = a(); c(); 在执行完var c=a()后，变量c实际上是指向了函数b，再执行c()后就会弹出一个窗口显示i的值(第一次为1)。这段代码其实就创建了一个闭包，为什么？因为函数a外的变量c引用了函数a内的函数b，就是说：
当函数a的内部函数b被函数a外的一个变量引用的时候，就创建了一个闭包。
参考：http://www.jb51.net/article/24101.htm
正文到此结束
热门推荐
相关文章
Loading...
![[HBLOG]公众号](http://www.liuhaihua.cn/img/qrcode_gzh.jpg)
