你需要明白 IIFE 的原理,我简单说一下:
function foo() {...} // 这是定义,Declaration;定义只是让解释器知道其存在,但是不会运行。
foo(); // 这是语句,Statement;解释器遇到语句是会运行它的。
IIFE 并非必须,传统一点可以这么写:
function foo() {...}
foo();
那么为什么要 IIFE?
- 传统的方法啰嗦,定义和执行分开写;
- 传统的方法直接污染全局命名空间(浏览器里的
global
对象,如window
)
于是,开发者们想找一个可以解决以上问题的写法。那么像下面这么写行不行呢?
function foo(...){}();
当然是不能,但是为什么呢?因为 function foo(...){}
这个部分只是一个声明,对于解释器来说,就好像你写了一个字符串 "function foo(...){}"
,它需要使用解析函数,比如 eval()
来执行它才可以。所以把 ()
直接放在声明后面是不会执行,这是错误的语法。
如何把它变得正确?说起来也简单,只要把 声明 变成 表达式(Expression) 就可以了。
实际上转变表达式的办法还是很多的,最常见的办法是把函数声明用一对 ()
包裹起来,于是就变成了:
(function foo() {...}) // 这里是故意换行,实际上可以和下面的括号连起来
();
这就等价于:
var foo = function () {...}; // 这就不是定义,而是表达式了。
foo();
但是之前我们说不行的那个写法,其实也可以直接用括号包起来,这也是一种等价的表达式:
(function foo(){...}());
所以你问有没有区别?很简单:木有~
另外,刚才说过转变表达式的方式很多,的确还有很多别的写法,比如:
!function foo() {...}();
或者
+function foo() {...}();
这些都可以。
相关推荐
本文主要介绍了javascript立即执行函数表达式IIFE的相关知识。具有很好的参考价值,下面跟着小编一起来看下吧
主要介绍了JavaScript函数IIFE使用详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
口香糖一个Gulp插件,用于将JavaScript代码包装在立即调用的函数表达式(IIFE)中。安装$ npm install --save-dev gulp-iife用法var gulp = require ( "gulp" ) ;var iife = require ( "gulp-iife" ) ;gulp . task ...
登录 再次尝试 javascript,试图让 IIFE 工作。 它仍然让我感到困惑。
该插件可以将ES模块的输出转换为IIFE。 安装 npm install -D rollup-plugin-iife 用法 import iife from "rollup-plugin-iife" ; export default { input : [ "entry.js" , "entry2.js" ] , output : { dir : ...
davidBowie-IIFE:封装囊封IIFE
前端开源库-cjs2iifecjs2ife,commonjs模块到iffe代码
将ES模块转换为简单的IIFE。 特征 import语句解析为全局变量。 export语句作为全局变量导出。 在test/cases文件夹下还有更多示例。 用法 const { parse } = require ( "acorn" ) ; const { transform } = require...
本文主要对JavaScript的闭包、IIFE、apply、函数与对象进行详细介绍。有很好的参考价值,需要的朋友一起来看下吧
js 逆向实战之分离式 webpack 非 IIFE 改写
babel-plugin-typescript-iife-enum目的TypeScript转换为IIFE中的包装器枚举。目的目前,TypeScript将从enum Test { Key = 1} 到var Test ;( function ( Test ) { Test [ Test [ "Key" ] = 1 ] = "Key" ;} ) ( Test ...
Table of Contents generated with DocTocJavaScript装逼指南IIFE(自动执行函数)JavaScript装逼指南通
主要介绍了js中let能否完全替代IIFE,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,,需要的朋友可以参考下
前端开源库-gulp-iifeGulpIIfe,将JavaScript代码包装在立即调用的函数表达式中。
Mais JavaScript: IIFE,工厂功能,clojures,调试,销毁,休息,可迭代。 正则表达式: Principaispadrõesemétodos。Projeto do Curso 网站Animais Fantasticos 状态: Em desenvolvimento
IIFE (Immediately Invoked Function Expression): 避免变数污染到global scope Array: .push() , .splice() , .sort() , .filter() , .map() , .join() , .forEach() this & .bind() & Arrow Function JSON: ....
IIFE,实现控制私有作用域 由AMD降级为Window a simple FSM based on Javascript 参考Javascript Finite State Machine的Usage实现 Reference: FSM Wiki ##特性说明(较之Javascript FSM) ###新增特性 create函数...