服务报价 | 域名主机 | 网络营销 | 软件工具| [加入收藏]
 热线电话: #
当前位置: 主页 > 开发教程 > JavaScript教程 >

javascript自执行函数

时间:2016-04-04 21:21来源:未知 作者:最模板 点击:
起因,今天在豪大大的JS开发群里有人问了一道题, vartest=(function(a){ this.a=a; returnfunction(b){ returnthis.a.e + this.a.f + b; }}(function(a,b){ return{ e:a, f:b };}(1,8)));console.log(test(4)); 对此有点似懂非懂

起因,今天在豪大大的JS开发群里有人问了一道题,

vartest=(function(a){
    this.a=a;
    returnfunction(b){
        returnthis.a.e + this.a.f + b;
    }
}(function(a,b){
    return{
        e:a,
        f:b
    };
}(1,8)));
console.log(test(4));

对此有点似懂非懂,于是就查阅了一番。

( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,然后再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来查看资料发现并非如此。要理解立即执行函数,需要先理解一些函数的基本概念。

函数声明、函数表达式、匿名函数,立即执行函数

函数声明(Function Declaration)的典型格式

functionfun(){
}

函数表达式(Function Expression)的典型格式

varfun=function(){
}

匿名函数function () {}; 使用function关键字声明一个函数,但未给函数命名,所以叫匿名函数

立即执行函数(Immediate Functions)的典型格式

(function(){
    alert('watchout!');
}());

这种定义匿名函数并立即在单个表达式中调用的写法非常常见,已经成为一种惯用法了。注意上面代码圆括号的用法,function之前的左圆括号是必须的,因为如果不写这个左圆括号, Javascript解析器会试图将关键字function解析为函数声明语句 。使用圆括号Javascript解析器才会正确的将其解析为 函数定义表达式 。使用圆括号是习惯用法,尽管有其他的不同表达方式。

可以看到 将函数声明转换成函数表达式 有多种不同方式

(function(a){
    console.log(a);//输出123,使用()运算符
})(123);
(function(a){
    console.log(a);//输出1234,使用()运算符
}(1234));
!function(a){
    console.log(a);//输出12345,使用!运算符
}(12345);
+function(a){
    console.log(a);//输出123456,使用+运算符
}(123456);
-function(a){
    console.log(a);//输出1234567,使用-运算符
}(1234567);
varfn=function(a){
    console.log(a);//输出12345678,使用=运算符
}(12345678)

关于立即执行函数的返回值

就像其它任何函数一样,一个立即执行函数也能返回值并且可以复制给其它变量

varresult=(function(){
    return1+2;
}());
varresult=function(){
     return1+2;
}();

这两个实现的功能是一样的。

这种语法是非常简单的,但它可能看起来有点令人误导; 如果没有注意到函数结束的括号,

一些人可能就会认为result指向一个函数; 实际上result指向立即执行函数的返回值,在这种情况下是数字 3 。

如下代码

vartest=(function(){
    vari=0;
    return{
        get:function(){
            returni;
        },
        set:function(val){
            i=val;
        },
        increment:function(){
            return++i;
        }
     };
}());
test.get();//0
test.set(3);
test.increment();//4

再返回到最开始

vartest=(function(a){
    this.a=a;
    returnfunction(b){
        returnthis.a.e + this.a.f + b;
    }
}(function(a,b){
    return{
        e : a,
        f : b
    };
}(1,8)));
console.log(test(4));

可以把

function(a,b){
    return{
        e : a,
        f : b
    };
}(1,8)

看作一个整体,返回

{
    e : 1,
    f : 8
}

return this.a.e + this.a.f + b;就是1+8+4 = 13了。

有错误的地方欢迎拍砖

(责任编辑:最模板)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
栏目列表
热点内容