[JamTin]开门见山——JS作用域 (Scope)

开门见山——JS作用域 (Scope)

• 作用域指一个变量的作用的范围

• 在JS中一种有两种作用域：

  1. 全局作用域

     • 直接编写在script标签中的JS代码，都在全局作用域。
     • 全局作用域在页面打开时创建，页面关闭时销毁。
     • 在全局作用域中有一个全局对象window，我们可以直接使用。
     • 在全局作用域中创建的变量都会作为window对象的属性保存，函数则作为window对象的方法保存。
     • 当声明一个变量时没有使用var，则会是window.变量。例如: a === window.a

  2. 函数作用域

     • 调用函数时创建函数作用域，函数执行完后作用域销毁。
     • 每调用一次函数就会创建一个新的函数作用域，他们之间互相独立。
     • 函数作用域中可以访问到全局作用域的变量。
     • 全局作用域中无法访问到函数作用域的变量。

     function fun(){
         var a = 10;
     }
     console.log(a); // => error,a is not defined.
     

     • 当在函数作用域操作一个变量时，它会先在自身作用域中寻找，如果有就直接使用，没有则向上级作用域寻找。全局依然没找到就报错。

变量的声明提前

• 使用var关键字声明的变量会在所有代码执行前被声明（未赋值）。

  console.log("a = " + a);//下面 有var a所有不报错。但现在的值是undefined
  
  var a = 123;
  

• 在函数作用域中也有声明提前。

函数的声明提前

• 使用函数声明形式创建的函数 function 函数( ){ }，会在所有代码执行前被创建。所以在函数声明前可以调用函数。
• 使用函数表达式创建的函数不会被声明提前，因为它是变量被匿名函数赋值。
• 在函数作用域中也有声明提前。

---

作用域练习

说出以下代码的执行结果

=========================================

var a = 123;
function fun(){
alert(a);
}
fun();

答：alert(123);

=========================================

var a = 123;
function fun(){
alert(a);
var a = 456;
}
fun();
alert(a);

答：alert(123); alert(123);

=========================================

var a = 123;
function fun(){
alert(a);
a = 456;
}
fun();
alert(a);

答：alert(123); alert(456);

=========================================

var a = 123;
function fun(a){
alert(a);
a = 456;
}
fun();
alert(a);

答：alert(undefined); alert(123);

=========================================

var a = 123;
function fun(a){
alert(a);
a = 456;
}
fun(123);
alert(a);

答：alert(123); alert(123);