深入理解js立即执行函数
看过jQuery源码的人应该知道,jQuery开篇用的就是立即执行函数。立即执行函数常用于第三方库,好处在于隔离作用域,任何一个第三方库都会存在大量的变量和函数,为了避免变量污染(命名冲突),开发者们想到的解决办法就是使用立即执行函数。
1.什么是立即执行函数(IIFE)
在了解立即执行函数之前先明确一下函数声明、函数表达式及匿名函数的形式,如下图:
接下来看立即执行函数的两种常见形式:( function(){…} )()和( function (){…} () ),一个是一个匿名函数包裹在一个括号运算符中,后面再跟一个小括号,另一个是一个匿名函数后面跟一个小括号,然后整个包裹在一个括号运算符中,这两种写法是等价的。要想立即执行函数能做到立即执行,要注意两点,一是函数体后面要有小括号(),二是函数体必须是函数表达式而不能是函数声明。先看下图:
从图中可以看出,除了使用()运算符之外,!,+,-,=等运算符都能起到立即执行的作用。这些运算符的作用就是将匿名函数或函数声明转换为函数表达式,如下图所示,函数体是函数声明的形式,使用运算符将其转换为函数表达式之后就可达到立即执行效果:
2.使用立即执行函数的好处
通过定义一个匿名函数,创建了一个新的函数作用域,相当于创建了一个“私有”的命名空间,该命名空间的变量和方法,不会破坏污染全局的命名空间。此时若是想访问全局对象,将全局对象以参数形式传进去即可,如jQuery代码结构:
其中window即是全局对象。作用域隔离非常重要,是一个JS框架必须支持的功能,jQuery被应用在成千上万的JavaScript程序中,必须确保jQuery创建的变量不能和导入他的程序所使用的变量发生冲突。
深入理解js立即执行函数的更多相关文章
- 直观理解js自执行函数
要在函数体后面加括号就能立即调用,则这个函数必须是函数表达式,不能是函数声明: Jslint推荐的写法: (function(){alert(1);}()); 针对函数声明,使用().!.+.-.=. ...
- js立即执行函数
一.JS立即执行函数的写法 方式1.最前最后加括号 (function(){alert(1);}()); 方式2.function外面加括号 (function(){alert(1);})(); ...
- js立即执行函数用法
js立即执行函数可以让你的函数在创建后立即执行,js立即执行函数模式是一种语法,可以让你的函数在定义后立即被执行,这种模式本质上就是函数表达式(命名的或者匿名的),在创建后立即执行. 一.JS立即执行 ...
- js自执行函数的常见写法
js自执行函数的常见写法 2016-12-20 20:02:26 1.关于自执行函数 1.1 写自执行函数的好处:独立的作用域,不会污染全局环境 (function() { })(); 1.2 理解重 ...
- Ajax:js自执行函数、jsonp、cros
一.js自执行函数 #(function(){alert(1);})(); (function(){ alert(1); } )(); 二.javascript同源策略 1. 什么是同源策略 理解跨域 ...
- 深入理解JS:执行上下文中的this(二)
目录 序言 Function.prototype.bind() 方法 箭头函数 参考 1.序言 在 深入理解JS:执行上下文中的this(一) 中,我们主要深入分析全局环境和函数环境中函数调用的 th ...
- 模板语言变量,js变量,js自执行函数之前嵌套调用
1.模板语言变量 前端html页面中展示 {{ nodeIp }} 2.js变量引用模板语言变量 把模板语言变量传递给js,js去执行页面操作(变量的转换,只适用于字符串) var IP = &quo ...
- js立即执行函数应用--事件绑定
js中立即执行函数的应用:应用到事件绑定上. 少说多做,直接运行代码(代码中有注释): <!DOCTYPE html> <html lang="zh"> & ...
- js 立即执行函数定义方法
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
随机推荐
- Entity Framework的优势和缺点
优点:简单说就是Entity Framework省事,做业务系统,管理系统会减少很多代码,程序员可以更关注业务实现本身. 缺点:当处理大数据量和高并发时,由于Entity Framework是自动化程 ...
- Nginx实战入门教程
Nginx 简介 Nginx是一个高性能的http和反向代理服务器,它看起来好像不太符合英文单词的拼写习惯,因为Nginx是由名为 伊戈尔·赛索耶夫 的俄罗斯人开发的.Nginx主要特点为占用内存小, ...
- Django学习---信号
Django学习之信号 如果我想对所有在数据库创建数据的时候记录一条日志. 比如我们在django中往数据库中增加一条数据,希望生成一条操作日志,或者在数据保存和数据保存之后都保存一条操作日志,那我们 ...
- 剖析tcp与udp及应用场景协议方案选择
什么是TCP和UDP TCP和UDP是TCP/IP协议中的两个传输层协议,它们使用IP路由功能把数据包发送到目的地,从而为应用程序及应用层协议(包 括:HTTP.SMTP.SNMP.FTP和Telne ...
- String(byte[] bytes, Charset charset) 和 getBytes() 使用
转自:https://techbirds.iteye.com/blog/1855960 @Test public void testBytes(){ //字节数 //中文:ISO:1 GBK:2 UT ...
- FireDAC 汉字字段名称过滤
[FireDAC][Stan][Eval]-107. Invalid character found [ 拼音码 like '%A%' ] 英文字段名称过滤正常 汉字字段名过滤报错. 莫非不支持汉字字 ...
- query简洁弹出层代码
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content=&q ...
- swarm调度
Swarm filters Configure the available filters 过滤器分为两类,即节点过滤器和容器配置过滤器. 节点过滤器对Docker主机的特性或Docker守护程序的配 ...
- MySql 关键字冲突解决办法
今天把项目发布到另一台机器上时,因为mysql版本不一致,出现了关键字冲突,virtual关键字,不清楚是不是mysql添加的新特性. select * from herb where name=&q ...
- 用jquery实现html5的placeholder功能
html5的placeholder功能在表单中经常用到,它主要用来提示用户输入信息,当用户点击该输入框之后,提示文字会自动消失. 我们用jquery实现类似的功能: 当输入框获得焦点时,清空输入框中的 ...