09 JavaScript中的作用域

技术交流QQ群:1027579432，欢迎你的加入！

欢迎关注我的微信公众号：CurryCoder的程序人生

1.作用域

• 通常来说，一段程序代码中所用到的名字并不是一直有效和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字的冲突。

2.JS中的作用域(ES6之前)

• 全局作用域：整个script标签或者一个单独的js文件；
• 局部作用域(函数作用域)：在函数内部就是局部作用域，这个代码的名字只在函数内部起效果和作用；

3.变量的作用域

• 变量作用域的分类
  • 在JS中，根据变量作用域的不同，变量可以分为两种：
    • 全局变量全局作用域下的变量，在整个全局下都可以使用。注意：如果在函数内部没有声明直接赋值的变量也属于全局变量。
    • 局部变量局部作用域下的变量。注意：函数的形参也可以看成是局部变量。

  var num = 10;  // num是一个全局变量
  console.log(num);
  
  function fun() {
      console.log(num);
      
  }
  fun()
  console.log(args);  // 函数形参是局部变量
  function Bar(args){
      var num1 = 200;  // num1就是局部变量，只能在函数内部使用
      num2 = 20;  // 全局变量
  }
  console.log(Bar());  // undefined
  // console.log(num1);  // 报错
  console.log(num2);
  

  • 从执行效率来看全局变量和局部变量
    • 全局变量只有在浏览器关闭的时候才会销毁，比较占内存；
    • 局部变量当程序执行完毕，就会销毁，比较节约内存资源；
• JS中没有块级作用域，在ES6之后才新增了块级作用域。
• 块级作用域{}，例如if{}、for{}等。

  if (3 <5) {
      var num = 20;
  }
  console.log(num);
  

4.作用域链

• 只要是代码，就至少有一个作用域；
• 写在函数内部的局部作用域；
• 如果函数中还有函数，那么在这个作用域中又可以诞生一个新的作用域；
• 根据在内部函数可以访问外部函数变量的这种机制，*用链式查找决定哪些数据能被内部函数访问，这就称为作用域链(就近原则)；

  var num = 666;
  function haha() {  // 外部函数
      var num = 888;
      function dana() {  // 内部函数
          console.log(num);
      }
      console.log(num);
      dana();
  }
  haha();
  

5.资料下载

• 笔记及代码，欢迎star,follow,fork......