• Js作用域与闭包


      在JavaScript中,作用域是执行代码的上下文。作用域有三种类型:全局作用域、局部作用域(或“函数作用域”)和eval作用域。

      在函数内部使用var定义的代码,其作用域是局部的。

      

    var foo = 0; // 全局作用域
    console.log(foo); // 0
    
    var myFunction = function() {
    console.log(foo); // undefined (下面var foo的声明在此作用域提升) var foo = 1; // 局部作用域 console.log(foo); // 1 var myNestedFunction = function() { var foo = 2; // 局部作用域 console.log(foo); // 2 } }

    eval('var foo = 3; console.log(foo);'); // eval()作用域 3

    console.log(foo); // 3

      JavaScript没有块作用域

    var foo = 1;
    
    if (true) {
      foo = 2;
      for (var i = 3; i <= 5; i++) {
        foo = i; 
        console.log(foo); // 3,4,5
      }
    }
    

      在函数中使用var声明变量,避免作用域陷阱

    var foo = function() {
      var boo = function() {
        console.log(doo) // undefined 声明提升
        var doo = 2; 
      }()
      console.log(doo); // ReferenceError: doo is not defined. doo在boo作用域中
    }()
    
    var foo = function() {
      var boo = function() {
        doo = 2; 
      }()
      console.log(doo); // 2, doo在全局作用域中
    }()
    

      作用域链

    var sayHiText = 'hi';
    
    var func1 = function() {
      var func2 = function() {
        console.log(sayHiText); // 在作用域链中寻找变量:func2-->func1-->global
      }()
    }()

    /*---------分割线------------*/

    var x = false;
    var foo = function() {
    var x = false;
    var bar = function() {
    var x = true;
    console.log(x);
    }()
    }

    foo(); // true, 当作用域链最近位置查找到变量时,查找即结束

      函数定义时确定作用域,而非调用时确认

    var foo = 'head'
    var parentFun = function() { var foo = 'foo' return function() { console.log(foo) } } var nestedFun = parentFun(); nestedFun(); // foo, 返回的函数可以通过作用域链访问foo

    var otherFun = function() {
    var foo = 'other'
    nestedFun(); // foo, 作用域链 parentFun --> global
    }()

      闭包是由作用域链引起的

    var countUpFromZero = function() {
      var count = 0;
      return function() {
        console.log(count++);
      }
    }();
    
    countUpFromZero (); // 0
    countUpFromZero (); // 1
    countUpFromZero (); // 2
    

      深入了解闭包:http://jibbering.com/faq/notes/closures/

  • 相关阅读:
    组合模式
    装饰者模式
    桥接设计模式
    Docker介绍
    适配器模式
    设计软件下载
    17种设计字体的创意方法
    less编译(mac版gulp)
    50种常用快捷键整理
    WebStorm设置手机测试服务器-局域网内其他设备访问
  • 原文地址:https://www.cnblogs.com/daqianduan/p/4384028.html
Copyright © 2020-2023  润新知