精华内容
下载资源
问答
  • 立即执行函数

    2021-05-14 17:07:26
    立即执行函数 1. 什么是立即执行函数 立即执行函数就是 将匿名函数或函数声明转化成函数表达式,再在函数后加()让其立即执行。这样的函数叫做立即执行函数 2. 立即执行函数的格式 在看立即执行函数格式之前,我们...

    立即执行函数

    1. 什么是立即执行函数

    立即执行函数就是 将匿名函数或函数声明转化成函数表达式,再在函数后加()让其立即执行。这样的函数叫做立即执行函数

    2. 立即执行函数的格式

    在看立即执行函数格式之前,我们先来看一下函数声明、函数表达式、匿名函数分别是什么。

    function test() {
        console.log('这是函数声明');  //函数声明
    }
    var func = function() {
        console.log('这是函数表达式');  //函数表达式
    };
    function() {
        console.log('这是匿名函数'); //匿名函数
    }
    

    立即执行函数的格式通常使用俩种,
    一种是

    (function() {
    })()
    

    另一种是

    (function() {}())
    

    其实都是在将匿名函数转化为函数表达式,再在后面加上()让其立即执行。

    3. 立即执行函数的特点

    所以,立即执行函数的格式特点有俩个:

    1. 必须是函数表达式
    2. 函数后面必须有()

    这时候我们可以想到,除了()还有其他方法也可以将匿名函数或函数声明转为函数表达式。

    //匿名函数
    (function(){alert('123')} ()) //123
    (function(){alert('123')}) () //123
    !function(){alert('123')}() //123
    +function(){alert('123')}()//123
    -function(){alert('123')}()//123
    ~function(){alert('123')}()//123
    void function(){alert('123')}()//123
    new function(){alert('123')}()//123
    
    //函数声明
    (function test(){alert('123')} ()) //123
    (function test(){alert('123')}) () //123
    !function test(){alert('123')}() //123
    +function test(){alert('123')}()//123
    -function test(){alert('123')}()//123
    ~function test(){alert('123')}()//123
    void function test(){alert('123')}()//123
    new function test(){alert('123')}()//123
    

    4. 立即执行函数的用处

    立即执行函数会创造一个私有的作用域,不会让这个作用域中的变量和方法污染到全局。
    如果想在此私有作用域中使用全局对象,将全局对象以参数形式传入进去即可。

    先看一个小栗子:

    for (var i = 0; i < 6; i++) {
        setTimeout(function() {
            console.log(i);
        }, 1);      // 因为var 和 setTimeout 的特殊机制 (原理不赘述了), 会输出 6, 6, 6, 6, 6, 6
    }
    //第一种解决办法, 将var 改完 let
    for (let i = 0; i < 6; i++) {
        setTimeout(function() {
            console.log(i);
        }, 1);      // 因为var 和 setTimeout 的特殊机制 (原理不赘述了), 会输出 0, 1, 2, 3, 4, 5
    }
    //第二种解决办法, 通过立即执行函数建立一个闭包环境
    for (var i = 0; i < 6; i++) {
        (function(i) {
            setTimeout(function() {
                console.log(i);
            }, 1);
        })(i);   // 0, 1, 2, 3, 4, 5
    }
    

    还有比如jQuery中也使用了立即执行函数:

    (function(window, undifined) {
       //jQuery code
    })(window)  //window就是全局对象
    
    展开全文

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 8,844
精华内容 3,537
关键字:

立即执行函数