js闭包的作用域以及闭包案列的介绍：

转载▼

标签： it

js闭包的作用域以及闭包案列的介绍：

 

首先我们根据前面的介绍来分析js闭包有什么作用，他会给我们编程带来什么好处？

闭包是为了更方便我们在处理js函数的时候会遇到以下的几种情况：

 

列1：

function f1(){var a=1;f2();}

function f2(){return a;}

f1();//a没有定义

 

或者说我想调用一个全局变量的时候却发现不能调用，或者没有这个变量，没有定义这个变量，还要在想调用的时候不能重复出现，怎么办呢？所以就有了闭包的出现?js闭包给我们更方便的提供怎么在js里去处理一个全局的变量或者全局的方法，下面我们来了解下闭包怎么去用？

 

比如说：

 

function f(){

var b="b";

return function(){

return b;

}

}

 

上面的代码是一个简单的闭包，我们很明显的看到在方法的内部有一个变量（var b），这个b就是在f()方法里的全局变量，也就是说我只要在f()方法的内部都可以调用它，而 return function(){ return b;}是f()方法的作用域，这个作用域是为了方便我们在调用f()方法下面的b的时候让b保留在输出的方法内部;

function f(){

var b="b";

return function(){

return b;

}

}

f()();

 

这样一来我们在调用f()输出b的时候就不会出现调用不到或者是在同一个方法中不想调用时重复出现的情况；很简单吧！！！

 

官方的结论：我们就可以说当一个函数指向了它的父作用域，就可以称之为闭包。

 

下面在给你们提个问题：

 

function f(arg){

var n =function(){

return arg;

}

arg++;

return n;

}

var m= f(123);

m();//124

 

上面是一个js的闭包，你能告诉我他的父作用域和子作用域吗？

不能说没关系，加我QQ我慢慢给你说（654028913）

 

怎么用闭包在循环中的应用？

 

来看一个错误的js闭包的介绍：

function f(){

var a =[];

var i;

for(i=0;i<3;i++){

a[i] = function(){

alert(i);

return i;

}

}

return a;

}

 

var a = f();

a[0]();//3

a[1]();//3

a[2]();//3

 

知道为什么是错误的吗？

照常理来说我们理想的值应该是0,1,2；但是却不是的，为什么呢？其实我们在循环的过程中忘记做一件事，那就是去保留原来在数组a[i]的值，它没有保留原来的值，而是把原来的值拿去循环了，所以循环后的最终结果就是a[i]要输出的最终结果，那我们要怎么正确的去写呢？来看代码：

 

function f() {

var a = [];

var i;

for(i = 0; i < 3; i++) {

a[i] = (function(x){

return function(){

alert(x);

return x;

}

})(i);

}

return a;

}

var a = f();

a[0]();//0

a[1]();//1

a[2]();//2

 

想知道为什么对了吗？我们可以看到，这串代码和刚才的代码我们多添加一个输出的方法，那是该闭包最后执行的作用域，我们把循环的结果都保存到(return function(){

alert(x);

return x;

})里面去这样一来我们的想要输出i的值就可以通过该闭包去输出,x是干什么的很多初学js的人不知道，没关系，x其实是我想代替i去执行的局部变量，明白了吧，是不是很简单啊，你们有没有发现父作用域和原来的不一样了，其实不是的，我只是在输出之前让i执行了一个自调用函数，不懂自调用函数的可以到时候问我，或者到官方js论坛去看；如果不明白上面的不要紧，我们来写个更简单的吧！！！看好了哦

 

function f() {

function makeClosure(x) {

return function(){

return x;

alert(x);

}

}

var a = [];

var i;

for(i = 0; i < 3; i++) {

a[i] = makeClosure(i);

}

return a;

}

 

 

from :http://blog.sina.com.cn/s/blog_8436db860101cggb.html