1. 什么是IIFE?
IIFE :Imdiately Invoked Function Expression 立即执行的函数表达式。
例如:
+function ($) { ... }(window.jQuery);
这种写法称为 IIFE。
2. 函数表达式和函数声明?
函数表达式(Function Expression):var test = function() {};
函数申明(Function Declaration):function test() {};
3. 函数声明
函数声明时必须有函数名。
function a(){ alert('Function declaration'); } a();
4. 函数表达式
函数表达式中的函数可以为匿名函数,也可以有函数名,但是该函数实际上不能直接使用,只能通过表达式左边的变量 a 来调用。例如:
var a = function(){ alert('Function expression'); } var b = new a();
通过一元操作符+变成了函数表达式。也可以使用 - ~ !等其他一元运算符或者括号,目的是为了引导解析器,指明运算符附近是一个表达式。以下是三种经典方式 :
+function () { ... }; (function () { ... }); void function() { ... };
函数表达式通过 末尾的() 来调用并运行。
+function () { }(); (funtion () { })();
也可以传递参数:
+function (x) { console.log(x); }(3); +function ($) { ... }(window.jQuery);
5. 使用IIFE的好处
提升性能、有利于压缩、避免冲突、依赖加载。
例如:
!function (win,d) { var title = "苏宁二手优品_放心的二手交易市场 –苏宁易购二手优品"; // 旧的页面title var newTitle = "10004-null-100039/null-苏宁二手优品/放心的二手交易市场/苏宁易购二手优品-null-null-null"; //新的页面规则 if (win.sndevice.isApp) { // 易购APP if (win.sndevice.isAndroid) { // android d.addEventListener("deviceready", function() { baseApi.setNewPageTitle(newTitle); }, false); } if (win.sndevice.isIOS) { // IOS d.addEventListener("SNNativeClientReady", function() { if (win.SNNativeClient.setNewPageTitle) { win.SNNativeClient.setNewPageTitle(title, newTitle); } }, false); } } }(window, document);
相关推荐
前端开源库-cjs2iifecjs2ife,commonjs模块到iffe代码
该插件可以将ES模块的输出转换为IIFE。 安装 npm install -D rollup-plugin-iife 用法 import iife from "rollup-plugin-iife" ; export default { input : [ "entry.js" , "entry2.js" ] , output : { dir : ...
将ES模块转换为简单的IIFE。 特征 import语句解析为全局变量。 export语句作为全局变量导出。 在test/cases文件夹下还有更多示例。 用法 const { parse } = require ( "acorn" ) ; const { transform } = require...
js 逆向实战之分离式 webpack 非 IIFE 改写
口香糖一个Gulp插件,用于将JavaScript代码包装在立即调用的函数表达式(IIFE)中。安装$ npm install --save-dev gulp-iife用法var gulp = require ( "gulp" ) ;var iife = require ( "gulp-iife" ) ;gulp . task ...
babel-plugin-typescript-iife-enum目的TypeScript转换为IIFE中的包装器枚举。目的目前,TypeScript将从enum Test { Key = 1} 到var Test ;( function ( Test ) { Test [ Test [ "Key" ] = 1 ] = "Key" ;} ) ( Test ...
davidBowie-IIFE:封装囊封IIFE
最近,我写了一篇关于syntax of Java’s IIFE pattern的文章,来解释为什么我们用现在的方式来写立即执行函数表达式。少数的读者批评文章过时了,都在争论在ECMA 2015中介绍的块级作用域变量使IIFE变得过时了。 恰恰...
主要介绍了JavaScript函数IIFE使用详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
本文主要介绍了javascript立即执行函数表达式IIFE的相关知识。具有很好的参考价值,下面跟着小编一起来看下吧
前端开源库-gulp-iifeGulpIIfe,将JavaScript代码包装在立即调用的函数表达式中。
目录 一、闭包(Closure) 1.1、闭包相关的问题 ...3.5、立即执行函数表达式 (IIFE) 3.5.1、匿名函数与匿名对象 3.5.2、函数与函数表达式 3.5.3、立即执行函数表达式与匿名对象 3.5.4、各种IIFE的写法 3.5.5、参数
西兰花 Broccoli 过滤器将文件包装在(IIFE) 中。 安装 npm install --save broccoli-iife 用法 var iife = require ( 'broccoli-iife' ) ; var iifeTree = iife ( sourceTree ) ;
因果报应包装的预处理程序Karma预处理程序将文件内容包装在具有完整源映射支持的IIFE中安装npm install --save karma-wrap-iife-preprocessor用法学分执照国际学习中心
budgetapp 使用香草js(IIFE)
登录 再次尝试 javascript,试图让 IIFE 工作。 它仍然让我感到困惑。
release/image-preview目录是为不同的模块系统构建的,包括AMD,CommonJS,ES6,UMD,IIFE。 您可以选择一种适合您的项目。 例 。 进口 脚本(在iife或umd模块系统中,使用名称空间imagePreviewModule): < ...
知识点 01-面向对象 后续在 React 过程中大量用到面向对象编程思想 重点讲解 ES6 的面向对象 类的概念 ES6 提出的 class 类的...ES5 里没有模块化编程,全局作用域和函数作用域,模块作用域我们使用 IIFE 来实现