JavaScript之闭包 上下文练习

// 闭包练习题
// 第1道
let foo = function(){
let i = 0;
return function(){
console.log(i++);
}
}
let f1 = foo();
let f2 = foo();
f1();// 0
f2();// 0
f1();// 1
// 第2道
let x = 100;
let y = 200;
let funA = function(x){
x += 1;
let y = 201;
let funB = function(){
console.log(x); // 102
console.log(y); // 201
}
return funB;
}
let f = funA(101);
f();
// 上下文练习/**
* 因为JS没有块级作用域,if里面的foo又是以var形式声明的,所以会被提升上去,
* 被赋值为undefined,之后undefined代表false,所以会进入if语句块,
* foo被赋值为10,所以下面会打印输出10
*/
var foo =1;

function bar(){
console.log(foo); // undefined
if(!foo){
var foo =10;
}
console.log(foo); // 10
}
bar();


// 练习2
/**
* 调用b函数的时候,由于b函数里面的a函数存在函数提升,
* 会提升到最上面,所以第一次打印是function a() 接下来a被赋值为10,
* 但是这个a只是一个函数上下文里面的局部变量,用完之后就会被销毁掉,
* 所以当外部打印a的时候,仍然打印出1
*/
var a =1;
function b(){
console.log(a); // function a
a =10;
return;
function a(){}
}
b();
console.log(a); // 1

// 练习3
// 执行fn函数以后,在全局上下文里面会生成一个c,局部环境下面会生成一个b,
// 在fn函数调用完毕之后,b就会被销毁,由于f为true,所以会进入if生成a变量

var f =true;
if(f===true){
var a =10;
}
function fn(){
var b =20;
c=30;

}
fn();
console.log(a); // 10
console.log(c); // 30
console.log(b); // 报错

// 练习4
/**
* 全局里面首先会存在a和b,值都为3,之后进入IIFE后,首先是执行的b = 5,
* 这个时候就会找到全局的b,将其修改为5,之后是var a = b,
* 这个a就是局部的a,所以全局的a不会受影响。
*/

var a =b=3;
(function(){
var a =b=5; // b=5; var a =b;

})()
console.log(a); //3
console.log(b); // 5

// 练习5
/**
* 在下面的foo函数会被提升,接下来第一条代码打印出来就是function foo 接下来foo被赋值为A,
* 所以打印输出为A,之后foo又被赋值为一个函数,所以打印输出为function foo,调用foo,输出B,后面是一样的
*/

console.log(foo); // function foo
var foo ='A';
console.log(foo);// A
var foo =function(){
console.log('B');
}
console.log(foo); // function foo
foo();
function foo(){
console.log('C');
}
console.log(foo);
foo();//B


// 练习 6
/**
* 主要就是要注意b函数里面的var a = 3存在变量提升,所以b函数里面第一个是undefined,
* 接下来依次赋值打印输出,但是由于是局部变量,所以对全局的a不影响
*/

var a =1;
function b(){
console.log(a); // undefined
a =2;
console.log(a);// 2
var a=3;
console.log(a);// 3
}
console.log(a);//1
b();
console.log(a);// 1



猜你喜欢

转载自www.cnblogs.com/fatingGoodboy/p/11488233.html
今日推荐