js作用域总结

一、在ES5中，js 的作用域

      js作用域，只有全局作用域与函数作用域，没有块级作用域。

    1、全局作用域

  

var a = 10;
function aaa() {
alert（a）
}


function bbb(){
  var a=20;
   aaa()
}

bbb(); // 10

   a =10 是全局的  而a=20 是局部的

 

 2、变量的查找是就近原则，去寻找var定义的变量，当就近没有找到的时候就去查找外层。

   

var a=10
function aaa(){
     alert(a);
    var a=20
}
 
aaa();   // undefined，一是预解析，二是就近查找。

   

var a = 10
 function aaa(){
   alert(a)
    a=20
}
  aaa();  // 10

  这个虽然是就近原则，但是就近找var声明的变量，因为a= 20  没有var声明，只是修改了a 的值，所以到外面去找了，输出的是10。不过没错的是a=20后，a确实为20了，只不过alert的时候还没有执行到那~~

 

var a = 10
 function aaa(){
    a=20
   alert(a)
}
  aaa();  // 20

 

3、全局作用域与函数作用域：

var a=10
 function aaa(){
     bbb();
     alert(a);
    function bbb(){
       var a=20
  } 
}
   aaa();  // 10

 

 

4、当参数跟局部变量重名时，优先级是等同的。

       

var a=10;
 function aaa(a){
    alert(a)
    var a= 20;
}
 aaa(a)   // 10

 

   js 中传参时，基本类型传值，引用类型传引用。

 

 var a = 5;
 var b=a;
 b +=3
  alert(a); // 5

var a = [1,2,3]
var b=a;
b = [1,2,3,4];
alert(a); //[1,2,3]

var a = [1,2,3]
var b=a;
b.push(4);
alert(a); //[1,2,3,4]

 

参数与变量一样也是有作用域：

var a=10;
function aaa(a){
   a +=3
}
aaa(a)
alert(a) // 10

var a=10;
function aaa(a){
   a +=3

alert(a)

}
aaa(a)
 // 13

 

var a= [1,2,3]
  function aaa(a){
     a=[1,2,3,4]
}
aaa(a)
alert(a)  // 1,2,3

var a= [1,2,3]
  function aaa(a){
     a.push(4)
}
aaa(a)
alert(a)  // 1,2,3,4

 

   二、es6 中，块级作用域

          块作用域由{ }包括，if语句和for语句里面的{ }也属于块作用域。

           1、块作用域，var的变量外部是可以访问的。

     

{
    var a= 1;
     console.log(a)   // 1
}

console.log (a) // 1



( function A() {
     var b=2;
     console.log(b)  // 2
}) ();

 console.log(b); //报错


if（true）{
     var c=3
}

console.log(c) // 3

 

        2、 var 、 let 、 const 区别

            var定义的变量，没有块的概念，可以垮块访问，不能跨函数访问；

            let定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问；

            const 用来定义常量，使用时必须初始化（即必须赋值），只能在块作用域里访问，而且不能修改。

            

<script type="text/javascript">
    // 块作用域
    {
        var a = 1;
        let b = 2;
        const c = 3;
        // c = 4; // 报错
        var aa;
        let bb;
        // const cc; // 报错
        console.log(a); // 1
        console.log(b); // 2
        console.log(c); // 3
        console.log(aa); // undefined
        console.log(bb); // undefined
    }
    console.log(a); // 1
    // console.log(b); // 报错
    // console.log(c); // 报错

    // 函数作用域
    (function A() {
        var d = 5;
        let e = 6;
        const f = 7;
        console.log(d); // 5
        console.log(e); // 6  (在同一个{ }中,也属于同一个块，可以正常访问到)
        console.log(f); // 7  (在同一个{ }中,也属于同一个块，可以正常访问到)

    })();
    // console.log(d); // 报错
    // console.log(e); // 报错
    // console.log(f); // 报错
</script>