JS前端开发那些事儿JavaScript入门教程

JavaScript立即执行函数

2021-08-01  本文已影响0人  微语博客

在JavaScript中,我们使用function关键字加函数名定义一个函数,比如这样:function myFun(){ // 函数体 },然后通过函数名加括号myFun()可以调用执行。如果我们在定义函数的时候就让函数执行,而且后面不需要再次调用,这种函数就可以使用匿名函数。匿名函数,顾名思义就是定义函数的时候没有函数名,但是在JavaScript中,没有函数名的函数会报错,这里就有了立即执行函数,也叫函数自执行。立即执行函数就是声明函数的时候立即调用的意思,它最重要的作用就是创建了一个独立的作用域,而且很多的第三方库都大量的用到了立即执行函数。

函数的声明与调用

下面我们使用标准的写法定义和调用一个函数

function myFun() {
    alert("Hello World!");
}
myFun();//Hello World!

正如上面,当我们调用函数的时候,函数执行出现Hello World弹框,如果我们要它立即执行,写法如下:

function(){
    alert("Hello World!");
}
// 报错了

上面的函数没有函数名所以报错,我们把它看作一个整体用小括号包裹,后面再用小括号调用就是立即执行函数了。

(function(){
    alert("Hello World!");
})();

立即执行函数表达式

上面的立即执行函数是标准的写法,此外还可以写成立即执行函数表达式的语法,就是把匿名函数加括号执行看作一个整体,然后用小括号将他们括起来。

(function(){
    alert("Hello World!");
}());

看着很相似,其实效果也一模一样,只是把执行函数的括号放到里面了,也是立即执行函数的另一种写法。

参数和返回值

立即执行函数的返回值其实也就是立即执行函数本身,我们可以用变量将返回值储存。

var str = (function(){
    return "Hello World!";
})();
console.log(str);//Hello World!

立即执行函数和普通函数一样,可以通过调用的括号来传递参数

var i = "Hello World!";
(function(j){
    alert(j);
})(i);

其中i是实参,在全局中赋值为 Hello World! ,而j是形参,用于匿名函数内部传递。

私有作用域

文章开始也提到过,立即执行函数最重要的作用就是可以创建一个独立的作用域。对于原本不支持私有属性的JavaScript而言,我们可以使用立即执行函数模拟私有空间。比如上篇文章讲闭包的案例可以优化一下

var math = (function () {
    return {
        add : function (x,y) {
            return x + y;
        },
        multi : function (x,y) {
            return x * y;
        }
    };
})();

console.log(math.add(2,5));//7
console.log(math.multi(2,5));//10
上一篇下一篇

猜你喜欢

热点阅读