我们在面试时，总会碰到一些奇奇怪怪的关于 作用域 的面试题，实在弄清楚道理，万变不离其宗，大部分的面试题都能够得 ‘姐’。
所以，本日我们来谈谈 JavaScript 的 作用域(javascript scope) ，这是陈词滥调的话题，这里我们会从 作用域 最先，会延伸到 预剖析划定规矩（预编译） 、 表达式 、 变量提拔 、 函数提拔 、 匿名函数表达式 、 签字函数表达式 等，完全搞邃晓作用域这些事 ?
概况，可查看我的博客 lishaoy.net
变量提拔和函数提拔
在最先论述之前，我们来看一段代码，看看效果是什么？
alert(a);
function a(){ alter(2); }
alert(a);
var a = 1
alert(a);
var a = 3;
alert(a);
function a(){ alter(4); }
alert(a);
a();这里先发表答案：
- 第一个
alert(a)弹出function a(){ alter(4); }函数体- 第二个
alter(a)弹出function a(){ alter(4); }函数体- 第三个
alter(a)弹出 1- 第四个
alter(a)弹出 3- 第五个
alter(a)弹出 3- 末了一行报错
a is not a function
下面来剖析一下这段代码：
实在在 javascript 最先实行代码之前，有一个 预剖析（预编译） 的历程，这个历程会发生 变量提拔 和 函数提拔 ，实在全部实行历程能够分为两部分，轻易明白：
- 预剖析
这个历程，会把 关键字 var 、 function 、 参数 提取出来
上面这段代码 预剖析 的历程是：
// 第1行，没有关键字 ， 不剖析
// 第2行，碰到 function 关键字，剖析到全局的头部
a = function a(){ alter(2); }
// 第3行，没有关键字 ， 不剖析
// 第4行，碰到关键字 var ， 剖析到全局的头部
a = undefined
// 第5行，没有关键字 ， 不剖析
// 第6行，碰到关键字 var ， 剖析到全局的头部
a = undefined
// 第8行，碰到 function 关键字，剖析到全局的头部
a = function a(){ alter(4); }
// 第9行，没有关键字 ， 不剖析
// 第10行，a() 函数挪用此时这里有4个同名变量 a ，依循划定规矩是：function 优先与 var, 同名的背面掩盖前面的
因而，a = function a(){ alter(2); } 替代掉下面的2个 a = undefined ，a = function a(){ alter(4); } 又替代掉 a = function a(){ alter(2); } ,终究只剩下 a = function a(){ alter(4); }
预剖析（预编译） 后的代码模样是如许的
var a = function a(){ alter(4); }
alert(a);
alert(a);
a = 1
alert(a);
a = 3;
alert(a);
alert(a);
a();- 实行代码
就是实行的这段代码，顺次从上到下实行，末了的 a() 函数挪用，这时候的 a 已被 表达式 赋值成 3 ，而报错 a is not a function
全局作用域和部分作用域
再看这段代码
var a = 1;
function fn1(){
alert(a);
var a = 2;
}
fn1();
alert(a);这里先发表答案：
- 第一个
alert(a)弹出undefined- 第二个
alert(a)弹出 1
JavaScript 的作用域只用两种，一个是全局的，一个是函数的，也称为 全局作用域 和 部分作用域 ；部分作用域 能够接见 全局作用域 。然则 全局作用域 不能接见 部分作用域
一样用 预剖析（预编译） 的方法来剖析这段代码
- 预剖析（预编译） 全局作用域
// 第1行，碰到 var 关键字，剖析到全局的头部
a = undefined
// 第2行，碰到 function 关键字，剖析到全局的头部
fn1 = function fn1(){
alert(a);
var a = 2;
}
// 第3行，没有碰到关键字，不剖析
// 第4行，没有碰到关键字，不剖析- 最先实行代码
第1行，碰到表达式 a = 1, a 被赋值成 1
第6行，碰到函数挪用 fn1() ,最先 预剖析（预编译） 部分
- 预剖析（预编译） 部分作用域
// 第3行，没有碰到关键字，不剖析
// 第4行，碰到 var 关键字，剖析到部分
a = undefined- 最先实行 部分 代码
第3行，弹出 undefined
第4行，碰到表达式，把部分 a 改成 2
- 部分实行完成，继承实行全局
第7行，弹出 1 ，因为全局和部分是两个自力的作用域
作用域链
假如，把上面?代码，稍作修正
var a = 1;
function fn1(){
alert(a);
a = 2;
}
fn1();
alert(a);去掉了 function 里的 var ，效果就会不一样
此次，输出的是：
- 第一个
alert弹出 1 - 第二个
alert弹出 2
因为在剖析部分是没有发明 var a ，如是在实行时，就会去全局查找，找到了全局的 a = 1 ，所以 第一个 alert 弹出 1 ，而不是 undefined ,这个就是 作用域连
匿名函数表达式、签字函数表达式
在来看看这段代码?
var a = 3;
function fn() {
foo();
function foo() {
console.log(1);
}
foo();
var foo = function() {
console.log(2);
};
foo();
var bar = function foo() {
if(a > 3) return;
console.log(++a);
foo();
};
foo();
bar();
}
fn();先发表答案：
- 第1个
foo()输出的是 1- 第2个
foo()输出的是 1- 第3个
foo()输出的是 2- 第4个
foo()输出的是 2- 末了的
bar()输出的是 4
以上代码包含了 函数声明 、 匿名函数表达式 、 签字函数表达式 ，匿名函数表达式 、 签字函数表达式 是把函数体赋值给一个变量，因而具有和变量雷同的特征 变量提拔 ，而 签字函数表达式 的函数名只能在函数内部运用。
了解了这些，再来剖析段代码
- 全局预剖析
a = undefined
fn = function fn(){
...
}- 实行代码
第1行，碰到表达式,把 a 的值改变成3
末了行，碰到函数挪用，从新 预剖析 部分
- 部分预剖析
// 第4行，碰到 function 关键字，剖析到部分的头部
foo = function(){
console.log(1);
}
// 第8行，碰到 var 关键字，剖析到部分的头部
foo = undefined
// 第12行，碰到 var 关键字，剖析到部分的头部
bar = undefined因为有两个同名变量 foo ，遵照 function 优先 var 因而， foo = undefined 被干掉
部分预剖析 完以后的代码应该是这个模样?
var a = 3
function fn() {
var foo = function foo() {
console.log(1);
}
var bar;
foo();
foo();
foo = function foo() {
console.log(2);
};
foo();
bar = function foo() {
if(a > 3) return;
console.log(++a);
foo();
};
foo();
bar();
}
fn();- 实行部分代码
第1个 foo() 输出的是 1
第2个 foo() 输出的是 1
第3个 foo() 输出的是 2
第4个 foo() 输出的是 2
注重 这个
foo()输出的是上面
foo = function foo() {console.log(2);}的内容，因为
签字函数表达式 的函数名只能在函数内部运用，在外部无法接见。
末了的 bar() 输出的是 4
这里才是输出
function foo() {if(a > 3) return;console.log(++a);foo();}里的内容，而且，这个函数体内也有本身的挪用，效果
a变量
+1 ，申明能够挪用，实在，能够用
bar.name输出的就是
foo
所以，注重：
bar = function foo(), 不要用这类写法不引荐运用 匿名函数表达式 ，有以下 ? 几个瑕玷
- 在追踪栈中没函数名，调试难题
- 假如须要援用本身，只能用非标准的
arguments.callee（ES5严厉形式禁用）
