javascript作用域

javascript的作用域一直以来是前端开发中比较难理解的知识点,对于javascript的作用域主要记住几句话.

一丶"javascript中无块级作用域"

在java或C#中存在块级作用域,既:大括号也是一个作用域.

public static void main ()
{
    if(1==1){
        String name = "seven";
    }
    System.out.println(name);
}
// 报错

public static void Main()
{
    if(1==1){
        string name = "seven";
    }
    Console.WriteLine(name);
}
// 报错

在javascript语言中无块级作用域

function Main(){
    if(1==1){
        var name = 'seven';
    }
    console.log(name);
}
// 输出： seven

补充;标题值所以添加双引号是应为javascript6中新引入了let关键字，用于指定变量属于块级作用域·　　

二丶javascript采用函数作用域

在javascript中每个函数作为一个作用域,在外部无法访问内部作用域中的变量·

function Main(){
         var innerValue = "server";
}

Main();

console.log(innerValue);


//报错;Uncaught ReferenceError: innerValue is not defined
　　

三丶javascript的作用域链

由于javascript中的每一个函数作为一个作用域，如果出现函数嵌套函数，则就会出现作用域链·

xo = "Wyc;

function Func(){
    var xo = "nihao";
    function inner(){
          var xo = "shijie";
          console.log(xo);
    }
    inner();
}
Func();

　如上述代码则出现三个作用域组成的作用域链,如果出现作用域链后,那么寻找变量时就会出现顺序,对于上述实列:

当执行console.log(xo)时,其寻找顺序为根据作用域链从内到外的优先级寻找,如果内层没有就逐步向上寻找,知道没找到抛出异常·

　

四丶javascript的作用域链 执行前已经创建

javascript的作用域在被执行之前已经创建，日前再去执行时只需要按照作用域链去寻找即可·

实列一:

xo = "wyc";

function Func(){
      var xo = "nihao";
      function inner(){
 
           console.log(xo);
      }
      return inner;
}


var ret = Func();
ret();

//输出结果   ;    "nihao"

上述代码,在函数呗调用之前作用域链已经存在;

    · 全局作用域   --》 Func函数作用域 --》inner函数作用域 

当执行[ret()]时,由于其代指的是inner函数,此函数的作用域链执行之前已经被定义为;全局作用域   --》Func函数作用域 --》inner'函数作用域,所以,在执行[ret();]时,会根据已经存在的作用链去寻找变量·

实列二:

xo = "Wyc";
function Func(){
    var xo = "nihao";
    function inner(){

          console.log(xo);
    }
    xo = "shijie";
    return inner;
}

var ret = Func();
ret();

//输出结果：      "shijie"

上述代码和实列一的目的相同,也是强调函数被调用函数之前作用域链就已经存在·

    · 全局作用域 -->Func函数作用域  -->inner函数作用域

不同的时,在执行[var ret = Func();]时,Func作用域中的xo变量已经由"nihao",被重置为"shijie",所以之后再执行[ret();]时,就只能找到"shijie"·

实列三:

xo = "Wyc";<br>
function Bar(){
    console.log(xo);
}

function Func(){
    var xo = "nihao";



    return Bar;
}

var ret = Func();
ret();

//输出结果:Wyc

上述代码,在函数被执行之前已经创建了两条作用域链;

   ·全局作用域 -->   Bar函数作用域

   ·全局作用域 -->   Func函数作用域

当执行[ret();]时,ret代指的Bar函数,而Bar函数的作用域链已经存在; 全局作用域 -->  Bar函数作用域,所以,被执行时会根据已经存在的作用域链去寻找·

五丶声明提前　　

在javascript中如果不创建变量,直接去使用,则报错:

console.log(xxoo);
//报错:Uncaught ReferenceError：xxoo is not defined

javascript中如果创建值而不赋值.则该值为 undefined,如：

var xxoo;
console.log(xxoo);
//输出；undefined

在函数内如果这么写:

function Foo(){
   console.log(xo);
   var xo = "seven"
}

Foo();
//输出:undefined

　上述代码,不报错而是输出 undefind,其原因是;javascript的函数在被执行之前.会将其中的变量全部声明,而不赋值.所以,相当于上述实列中，函数在"预编译"时,已经执行了var xo;所以上述代码中输出的是undefined·