闭包

作者: 普通市民王二狗 | 来源:发表于2018-06-03 10:29 被阅读0次

    提升

    • 1 变量提升

    console.log(a);
    var a = 1;
    // var a;
    // console.log(a);
    // a = 1;
    // var a;编译阶段的任务;a = 1;执行阶段的任务;
    
    • 2 函数表达式

    • 函数表达式的提升 === 变量提升
    a(); 
    var a = function(){...};
    // TypeError: a is not a function
    // 函数表达式不会被提升
    // var a;
    // a();
    // a = function(){};
    
    • 3 函数声明

    func();
    function func(){ console.log(1); }
    var func = function(){ console.log(2); }
    func();
    // function func(){ console.log(1); }
    // var func;
    // func();
    // func = function(){ console.log(2); }
    // func();
    // 函数优先,当同时存在变量和函数声明,最先提升函数声明,其次才是变量。
    // var func;由于是重复声明,被忽略。
    
    • demo

    function func(){
        a = 1;
        console.log(window.a);  //  ?
        console.log(a);         //  ?
        var a = 2;
        console.log(a);         //  ?
    }
    func();
    

    执行环境&词法作用域

    • 变量、函数表达式——变量声明,默认赋值为undefined;
    • this——赋值;
    • 函数声明——赋值;

    这三种数据的准备情况我们称之为“执行上下文”或者“执行上下文环境”。

    词法作用域在函数定义时就已经确定了。而不是在函数调用时确定。

    var a = 10;
    function fn() {
        console.log(a);
    }
    function bar(f) {
        var a = 20;
        f()
    }
    bar(fn);
    // 执行环境
    // 1 全局执行环境
    // 2 fn执行环境
    // 3 bar执行环境
    
    • demo

    var a = 10;               // 1
    var b = 200;    
    function fn() {     
        var b = 20;
        function bar() { 
            console.log(a + b);
        }
        bar();                 // 3
    }
    fn();                    // 2
    
    
    var a = 10;               // 1
    var b = 200;    
    function fn() {     
        var b = 20;
        function bar() { 
            console.log(this.a + this.b);
        }
        bar();                 // 3
    }
    fn();                    // 2
    
    

    闭包

    函数作为返回值,函数作为参数传递。

    function fn () {
        var max = 10;
        return function bar(x) {
            if (x > max) {
                console.log(x); // ?
            }
        }
    }
    var f1 = fn();
    var max = 100;
    f1(15);
    
    for (var i = 0;i < 5;i ++) {
      setTimeout(() => {
        console.log(i); // ?
      },0);
    }
    // 延迟函数的回调在循环后执行
    // 实际上,5个函数在一个共享作用域中,共享同一个i
    for (var i = 0;i < 5;i ++) {
      (function(i){
        setTimeout(() => {
          console.log(i); // ?
        },0);
      })(i)
    }
    for (let i = 0;i < 5;i ++) {
      setTimeout(() => {
        console.log(i); // ?
      },0);
    }
    

    相关文章

      网友评论

          本文标题:闭包

          本文链接:https://www.haomeiwen.com/subject/oyfjsftx.html