JS中 (function(){...})()立即执行函数
(function(){...})()
(function(){...}())
这是两种js立即执行函数的常见写法。
基本概念:
函数声明:function fname(){...}; 使用function关键字声明一个函数,再指定一个函数名。
函数表达式:var fname=function(){...}; 使用function关键字声明一个函数,但未给函数命名,最后将匿名函数赋予给一个变量。
匿名函数:function(){}; 使用function关键字声明一个函数,但未给函数命名。(匿名函数也属于函数表达式。)
(匿名函数作用很多,赋予一个变量则创建函数,赋予一个事件则成为事件处理程序等。。)
关于函数声明和函数表达式的区别:
1:函数声明的Function declaration Hoisting(换成人话就是函数声明提升),函数表达式不具备这点,它需要被js代码解析到当前这行时才可以调用。
2:函数表达式后边加 ()立即调用该函数,函数声明不可以,它只能以fname()调用。
例子:
fName();
function fName(){...}//正确,函数声明提升,所以 fName()可以写在函数声明之前。 fName();
var fName=function(){...}//错误,函数表达式不具备函数声明提升。 var fName=function(){...}();//正确,函数表达式后边加()立即调用函数。 function fName(){...}();//错误,函数声明必须用fName()调用。
//这行代码被解析为两部分: 1函数声明 function fName(){...}, 2分组表达式(),这表达式有误,因为括号内没有表达式, function (){...}();//匿名函数不可以这么调用,因为function(){...}被当做了声明,声明不可以直接()调用。
顺便说下立即调用IIFE(Immediately Invoked Function Expression):
(function(){...})() 和 (function(){...}()) 是没区别的!
传统的定义函数为:
function foo(){...} //这是定义,Declaration,只是让解释器知道其存在,不会运行 foo(); //这是语句,解释器遇到语句会运行它
为什么要IIFE呢? 1:传统的方法啰嗦。 2:传统的方法污染全局命名空间
于是 我们这么写 function foo(){...}(); 这样写行么。。不行,为啥,因为function foo(){...}这部分只是声明,对解释器来说,像是你写了串字符串“function foo(){...}”,它需要的是解析函数,可以用比如eval()来执行它才可以。所以把()直接放声明后边是不行的,错误语法!
然而,我们距离成功相当接近,只需要把函数声明变成函数表达式就可以了。方法非常多,最常见的方法是用一对() 包裹起来。 (function foo(){...})();
这就等价于
var foo= function(){...};
foo();
当然 还有很多别的方法可以把声明变成表达式:
!function foo(){...}();
+function foo(){...}();
void function() {...}();
需要全局对象的时候,可以这么传, 举例:
void function(global){
console.log("a's value is: "+global.aa); //可以获取全局对象中aa的值
}(this)
var aa=10;
(function(a){
console.log("hello world"+a);
})(aa);
JS中 (function(){...})()立即执行函数的更多相关文章
- 【repost】js中(function(){…})()立即执行函数写法理解
摘要: javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ...
- js中(function(){…})()立即执行函数写法理解
文章摘自https://my.oschina.net/u/2331760/blog/468672?p={{currentPage+1}} 摘要: javascript和其他编程语言相比比较随意,所以j ...
- js中(function(){…})()立即执行函数写法理解(转载oschina)
( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到 ...
- IIFE-js中(function(){…})()立即执行函数写法理解
介绍IIFE IIFE的性能 使用IIFE的好处 IIFE最佳实践 jQuery优化 在Bootstrap源码(具体请看<Bootstrap源码解析>)和其他jQuery插件经常看到如下的 ...
- 深入理解js中的立即执行函数(function(){…})()
javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ( f ...
- JS中的自执行函数
本来规划的是2013年,狠狠的将JS学习下,谁知计划赶不上变化,计划泡汤了.13年的我对JS来说可以说是属于跟风,对它的理解和认识也仅仅是皮毛而已,也是因为要完成<ArcGIS API for ...
- JS中的立即执行函数
JS 立即执行函数可以让函数在创建后立即执行,这种模式本质上就是函数表达式(命名的或者匿名的),在创建后立即执行. 1.立即执行函数的写法 立即执行函数通常有下面两种写法: //第一种写法 (func ...
- js中的延迟执行和定时执行
在js中,延迟执行函数有两种,setTimeout和setInterval,用法如下: function testFunction(){Console.log('hovertree.com');} s ...
- 深入理解javascript中的立即执行函数(function(){…})()
投稿:junjie 字体:[增加 减小] 类型:转载 时间:2014-06-12 我要评论 这篇文章主要介绍了深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是 ...
随机推荐
- [转] Performance — 前端性能监控利器
timing (PerformanceTiming) 从输入url到用户可以使用页面的全过程时间统计,会返回一个PerformanceTiming对象,单位均为毫秒 按触发顺序排列所有属性:(更详细标 ...
- Asp.Net Core采用MailKit部署到Linux Docker连接邮件服务器报错
前段时间看文章了解到发邮件的SmtpClient已经过时了,微软官方推荐大家用其他解决方案,例如MailKit. https://docs.microsoft.com/zh-cn/dotnet/api ...
- layui提示框事件
使用layui提示框的时候遇到个问题,点击“确定”“取消”之类的按钮会执行里面的方法,但点击×就不会执行,所以在添加数据的时候出现个BUG,就是保存数据后点击弹出提示框的×,继续保存,如此循环,就可以 ...
- C#安全类型转换基于convert
using Newtonsoft.Json; using System; using System.Collections.Generic; using System.Globalization; n ...
- Libs - 软件下载网站
下载首页 > 网络工具 > FTP-工具 > 软件列表 http://down.tech.sina.com.cn/list/29_4_9.html
- Macbook中VMWare的Centos7虚拟机配置静态IP并允许上网的配置方法
一.检查Macbook本身的配置 1.打开[系统偏好设置]-[网络]- 选中[Wi-Fi]项(如果您是WIFI上网请选择此项)- 点右侧[高级] 选择[TCP/IP]选项卡,记录好[子网掩码].[路由 ...
- 浅谈Spring中JDK动态代理与CGLIB动态代理
前言Spring是Java程序员基本不可能绕开的一个框架,它的核心思想是IOC(控制反转)和AOP(面向切面编程).在Spring中这两个核心思想都是基于设计模式实现的,IOC思想的实现基于工厂模式, ...
- java中的%取模
在java中的 % 实际上是取余. 下面为数学概念上的取余和取模: 对于整型数a,b来说,取模运算或者求余运算的方法都是: 1.求 整数商: c = a/b; 2.计算模或者余数: r = a - ...
- Vue-Cli 3.x 创建的项目中对 import 引入的 CSS 样式启用 autoprefixer
问题描述: Vue-Cli 3.x 默认开启了 autoprefixer,但对于在 main.js 中通过 import 引入的 CSS 并没有自动添加前缀 分析原因: autoprefixer 在项 ...
- ObjC: Foundation Kit
转自:http://marshal.easymorse.com/tech/objc-foundation-kit Foundation Kit是什么? 你可以把它看作Java JDK中的java.la ...