四个例子理解闭包

/**
* 闭包原理
* @date   2017-04-10 14:04:17
* @version 1
*/
//理解作用域、作用域链
//内部作用域可以通过作用域链引用外部作用域的变量
// function(){}() functionName() 立即执行函数

//例一
function exp1() {
var a = 1;
var b = function() {
//console.log(0); //exp1函数被调用的时候,0不会输出;b函数被调用时,0才输出。
console.log(a); 
}; //b是函数,被调用的时候输出才执行,通过作用域链找到a值。
a = a + 3;
return b;
}
var res1 = exp1(); //[function]
res1(); //调用函数执行输出,a值已经被修改为4
console.log('------------------------');
//本质:exp1函数已执行完, b函数才被调用

//例二
function exp2() {
var a = 1;
var b = function() {
console.log(a); 
}(); //b是数值,匿名函数立即执行输出a值为1
a = a + 3;
return b;
}
var res2 = exp2(); //1
console.log('------------------------');

//例三
function exp3() {
var a = 1;
var b = function() {
return function(){
console.log(a); 
};
}(); //再加一层闭包保持b是函数。外层匿名函数立即执行返回函数,b是函数,被调用的时候输出才执行,通过作用域链找到a值。
a = a + 3;
return b;
}
var res3 = exp3(); //[function]
res3();//调用函数执行输出,a值已经被修改为4
console.log('------------------------');

//例四
function exp4() {
var a = 1;
var b = function(num) {//参数num被赋值为1
return function(){
console.log(num);
};
}(a);//再加一层闭包保持b是函数,外层匿名函数传参立即执行。立即执行外层匿名函数返回函数,b是函数,被调用的时候输出才执行,通过作用域链找到num值。
a = a + 3;
return b;
}
var res4 = exp4(); //[function]
res4();//调用函数执行输出,num值为1
console.log('------------------------');

//拓展
function exp5() {
var b = [];
for (var i = 0; i < 4; i++) {
b[i] = function() {
console.log(i);
};
}
return b;
}
var res5 = exp5(); //[[function],[function],[function],[function]]
res5[1](); //4
console.log('------------------------');
function exp6() {
var b = [];
for (var i = 0; i < 4; i++) {
b[i] = function(num) {
return function(){
console.log(num);
};
}(i);
}
return b;
}
var res6 = exp6(); //[[function],[function],[function],[function]]
res6[1](); //1

全部评论

相关推荐

点赞 评论 收藏
分享
不愿透露姓名的神秘牛友
11-13 11:07
点赞 评论 收藏
分享
5 17 评论
分享
牛客网
牛客企业服务