一、 说明
先浏览题目,判断自己对作用域、变量提升和闭包的掌握情况。然后了解概念和原理,再对照问题检查掌握情况。
二、 题目
- 下面代码输出的结果?(函数作用域)
var name = 'window';
console.log(name);
function outer() {
var name = 'outer';
console.log(name);
function inner() {
console.log(name);
}
inner();
}
outer();
第一个name是全局作用域,打印’window’,第二个name是函数作用域,打印’outer’,第三个name是函数作用域,inner里面未定义name因此上溯到outer函数中,打印结果也是’outer’。
- 下面代码执行的结果?(块级作用域)
function test() {
if (true) {
var a = 'true';
}
else {
var a = 'false';
}
console.log(a);
}
test();
function test1() {
if (true) {
const a = 'true';
}
else {
const a = 'false';
}
console.log(a);
}
test1();
test()执行结果是’true’,因为是函数作用域,在函数内声明的变量都可以访问到。test1()执行结果报错,因为const和let声明的变量定义在块级作用域,只有语句块({}括起来的区域)可以访问到。
- 下面代码执行的结果?(变量提升)
function test() {
console.log(a);
var a = 1;
console.log(a);
}
test();
function test1() {
console.log(a);
const a = 1;
console.log(a);
}
test1();
function test2() {
console.log(inner());
function inner() {
return 'inner';
}
}
test2();
function test3() {
console.log(inner());
var inner = function () {
return 'inner';
}
}
test3();
function test4() {
var a = 1;
function inner() {
console.log(a);
var a = 2;
}
}
写出变量提升后各个函数的等价形式不难得出结果。
test()结果是undefined、1
test1()结果是报错,因为const声明的变量不会提升,a访问不到
test2()结果是’inner’,因为函数声明提升了
test3()结果是报错,因为inner声明提前,但是定义没有提前,所以调用的时候取值是undefined
test4()结果是undefined,因为执行console.log(a)时候先在inner函数作用域内寻找,由于inner内部变量a提升,取值是undefined,因此打印undefined。
- 实现一个创建计数器的方法,支持增加计数和获取计数,对比下列两种实现方式。(闭包的应用场景)
/*方法1*/
var count = 0;
function createCounter() {
function increase() {
count++;
}
function getCount() {
return count;
}
return {
increase: increase,
getCount: getCount
};
}
var counter = createCounter();
counter.increase();
console.log(counter.getCount());
console.log(count);
/*方法2*/
function createCounter() {
var count = 0;
function increase() {
count++;
}
function getCount() {
return count;
}
return {
increase: increase,
getCount: getCount
};
}
var counter = createCounter();
counter.increase();
console.log(counter.getCount());
console.log(count);
答案见闭包的概念
- 下面各个代码段执行结果?(闭包练习)
// 代码段1
function test() {
var arr = [];
for(var i = 0; i <= 5; i++) {
arr[i] = function () {
console.log(i);
};
}
return arr;
}
var funcList = test();