关于 javascript 匿名自执行函数

  • js的立即执行函数,在创建后立即执行:
    两种写法:
    1-( functon(){ } ) (参数项) 在外
    1-( functon(){ } (参数项) ) 在内

通常我们声明一个函数有以下几种方式:
1.声明函数f1

function f1() {
 console.log("f1");
}
// 通过()来调用此函数
f1();

2.一个匿名函数的函数表达式,被赋值给变量f2:

var f2 = function() {
 console.log("f2");
}
//通过()来调用此函数
f2();

3.一个命名为f3的函数的函数表达式(这里的函数名可以随意命名,可以不必和变量f3重名),被赋值给变量f3

var f3 = function f33() {
 console.log("f3");
}
//通过()来调用此函数
  • 如果你看过一些自定义控件的话你会发现他们大多数都是沿用这种写法:
(function() {
 // 这里开始写功能需求
 })(); 

.


这是我们常说的立即执行函数(IIFE),顾名思义,也就是说这个函数是立即执行函数体的,不需要你额外去主动的去调用,一般情况下我们只对匿名函数使用IIFE,这么做有两个目的

1- 是不必为函数命名,避免了污染全局变量

2-是IIFE内部形成了一个单独的作用域,可以封装一些外部无法读取的私有变量。


重点来了:

-从IIFE的运行原理说起。因为IIFE通常用于匿名函数,这里就用简单的匿名函数作为栗子:

var f=function( ){
 };
f() ;

这里的 f( ) 可以调用函数,如果我们直接把 f( ) 换成函数本身,可以实现立即调用么?

function (){
  consle.log('ok')
}()

结果: Uncaught SyntaxError: Unexpected token (

产生这个错误的原因是,Javascript引擎看到function关键字之后,认为后面跟的是函数声明语句,不应该以圆括号结尾。解决方法就是让引擎知道,圆括号前面的部分不是函数定义语句,而是一个表达式,可以对此进行运算,这里区分一下函数声明和函数表达式:
1-函数声明(一般我们都是 function(){ } 来声明函数)

function myfun(){
   alert("ok")
}

2-函数表达式(类似以这种的形式)

var myFunction = function () { /* logic here */ };
var myObj = {
 myFunction: function () { /* logic here */ }
};

小学我们就学过用()括起来的表达式会先执行,就像下面这样:

  • 1+(2+3) //这里先运行小括号里面的内容

  • 其实在javascript中小括号也有相似的作用,Javascript引擎看到function关键字会认为是函数声明语句,那么如果Javascript引擎优先看到小括号会怎么样:
    用小括号把函数包裹起来

(function(){
  console.log("f");  
})();

函数成功执行了:f //控制台输出

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 函数是一段可以反复调用的代码块。函数还能接受输入的参数,不同的参数会返回不同的值。 概述 函数的声明 JavaSc...
    许先生__阅读 3,251评论 0 1
  • 1 概述 1.1函数的声明 JavaScript 有三种声明函数的方法。 (1)function 命令 funct...
    徵羽kid阅读 3,060评论 0 1
  • 造梦者 链接 《造梦者》 以冬 是那只孤飞的蝶 迎着风与霞光潋滟 于末日残存的天边 夺目地翩跹 倘使棠梨的烂...
    九木木阅读 4,697评论 6 2
  • 弹指一挥间,我已经跨入了高中的校园,正式成为了一名高中生。高中的号角已经吹响,在这三年时间里,我们所能做的...
    婳飛阅读 1,774评论 0 0
  • 每个人,都有每个人的性格。性格不同,会创造不一样的人生。每个人,在生活中,总是会遇到很多事。遇到有些事的时候,会改...
    王玉笙阅读 1,369评论 0 0

友情链接更多精彩内容