JS闭包直接调用外层函数和把函数赋值给变量再调用有啥区别？

最新推荐文章于 2023-11-12 16:16:18 发布

转载最新推荐文章于 2023-11-12 16:16:18 发布 · 2.7k 阅读

JS 专栏收录该内容

72 篇文章

订阅专栏

本文探讨了JavaScript中函数表达式与函数声明的不同之处，包括执行时机、作用域提升及ES6中块级作用域的引入，并给出了具体示例。

    function f1(){
        n = 999;
        return function f2(){
            alert(n);
        }
    }
//    var result=f1();      //这里是调用了一个f1()函数, 但是f1()函数所返回的是一个函数引用
//    result(); // 999      //所以要赋值给result再加个括号() 调用一次方法.

//    f1()();   //以上两行等价于因为return返回的 是一个函数,所以 fn1() 得到一个函数.fn1()() 
        调用该函数

javascript中 ”匿名函数赋值给变量“与“直接命名函数”有什么不同的作用？

数赋值给变量“与“直接命名函数”有什么不同的作用？

两种写法最大的区别是：

var init = function() { }; 是函数表达式，函数在代码执行的到当前行的时候才被执行，init 才被赋值。

function init() {} 是函数的声明，和 var 一样，会被提前到代码最前面定义。

所以，下面的两个例子：

1

2

3

4

foo(); // 在函数声明之后调用 foo，可以正常调用。因为 foo 被提前到最前面定义了。
function foo() {
    return true;
}

1

2

3

4

foo(); // 在函数表达式之前调用函数，报错。因为这时候还没有 foo 这个变量。
var foo = function() {
    return foo;
};

ES5 规定，函数只能在顶级作用域和函数作用域中声明，否则是不合法的。例如：

1

2

3

4

5

6

if( true ) {
    // 非顶级和函数作用域内定义函数，是错误的，虽然可能浏览器不一定会抛出错误，但是是不规范的。
    function foo() {
        return true;
    }
}

ES6 引入了块级作用域的概念，这种定义方法就被允许了。在块级作用域里面声明的函数，作用域类似于使用 let 声明的变量，在块级作用域之外没有办法被调用。

例如：

1

2

3

4

5

6

{
    function foo() {
        return true;
    }
}
foo(); // 在函数声明的代码块之外调用函数，会抛出错误。