美文网首页
关于立即执行函数IIFE

关于立即执行函数IIFE

作者: 大水啊大水 | 来源:发表于2017-03-01 16:57 被阅读13次

[译] JavaScript:立即执行函数表达式(IIFE)

IIFE保存闭包的状态

就像当函数通过他们的名字被调用时,参数会被传递,而当函数表达式被立即调用时,参数也会被传递。一个立即调用的函数表达式IIFE可以用来锁定值并且有效的保存此时的状态,因为任何定义在一个函数内的函数都可以使用外面函数传递进来的参数和变量(这种关系被叫做闭包)。

// 它的运行原理可能并不像你想的那样,因为`i`的值从来没有被锁定。
// 相反的,每个链接,当被点击时(循环已经被很好的执行完毕),因此会弹出所有元素的总数,
// 因为这是 `i` 此时的真实值。

var elems = document.getElementsByTagName('a');
for(var i = 0;i < elems.length; i++ ) {
    elems[i].addEventListener('click',function(e){
        e.preventDefault();
        alert('I am link #' + i)
        },false);
}

// 而像下面这样改写,便可以了,因为在IIFE里,`i`值被锁定在了`lockedInIndex`里。
// 在循环结束执行时,尽管`i`值的数值是所有元素的总和,但每一次函数表达式被调用时,
// IIFE 里的 `lockedInIndex` 值都是`i`传给它的值,所以当链接被点击时,正确的值被弹出。

var elems = document.getElementsByTagName('a');
for(var i = 0;i < elems.length;i++) {
    (function(lockedInIndex){
        elems[i].addEventListener('click',function(e){
            e.preventDefault();
            alert('I am link #' + lockedInIndex);
            },false)
    })(i);
}

//你同样可以像下面这样使用IIFE,仅仅只用括号包括点击处理函数,并不包含整个`addEventListener`。
//无论用哪种方式,这两个例子都可以用IIFE将值锁定,不过我发现前面一个例子更可读

var elems = document.getElementsByTagName( 'a' );

for ( var i = 0; i < elems.length; i++ ) {
    elems[ i ].addEventListener( 'click', (function( lockedInIndex ){
        return function(e){
            e.preventDefault();
            alert( 'I am link #' + lockedInIndex );
        };
        })( i ),false);
    }

相关文章

  • JS重要概念之立即执行函数与闭包高级

    #立即执行函数表达式IIFE,简称“立即执行函数” 立即执行函数表达式,IIFE(immediately-invo...

  • 关于立即执行函数IIFE

    [译] JavaScript:立即执行函数表达式(IIFE) IIFE保存闭包的状态 就像当函数通过他们的名字被调...

  • 关于立即执行函数IIFE

    今天来简单聊一聊之前写毕设用的非常多的IIFE。首先来看一段javascript 这其实就是IIFE(立即执行的函...

  • 02- ES6 函数声明

    1、立即执行函数表达式 IIFE 用块级作用域写法,代替立即执行函数表达式IIFE。 IIFE写法: 用“块级作用...

  • javascript立即执行函数

    立即执行函数--IIFE (Immediately Invokable Function Expressions》...

  • IIFE(函数立即执行)

    >一般函数声明后,需要调用才能执行.IIFE是在函数后面加`()`,表示立即执行.>1.方式:+function(...

  • IIFE立即执行函数

    就是下面这样的的代码: 关于IIFE书写方式 第一种情况: 解释:JavaScript在解析代码时,当遇到func...

  • 立即执行函数(IIFE)

    IIFE (Immediately Invoked Function Expression) is a JavaS...

  • 立即执行函数(IIFE)

    翻译原文地址 在听到对流行的javascript术语“self-executing anonymous funct...

  • 立即执行函数

    IIFE(立即执行函数) 一个在定义时就会被立即执行的函数,这不仅避免了外界访问此 IIFE 中的变量,而且又不会...

网友评论

      本文标题:关于立即执行函数IIFE

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