JavaScript立即调用的函数表达式-阿里云开发者社区

开发者社区> meteoric> 正文

JavaScript立即调用的函数表达式

简介: 主要参考知乎上这个问题:javascript 匿名函数有哪几种执行方式  长天之云的回答。 ~(function() {//todo})();!(function() {//todo})(); 对于不太熟悉JavaScript的同学来讲,可能会有两个疑问: 1、!(function() {})();前面为什么要加~、!这些符号? 后面的()是执行一个函数,而(function() {})是一个执行表达式,返回一个匿名函数的引用。
+关注继续查看

主要参考知乎上这个问题:javascript 匿名函数有哪几种执行方式  长天之云的回答。

~(function() {

//todo

})();



!(function() {

//todo

})();


对于不太熟悉JavaScript的同学来讲,可能会有两个疑问:

1、!(function() {})();前面为什么要加~、!这些符号?

后面的()是执行一个函数,而(function() {})是一个执行表达式,返回一个匿名函数的引用。

而如果在(function() {})();之前包含“未结束”的语句。是的,语句…

一条语句由一个或多个表达式、关键字或者运算符(符号)组成,典型地,一条语句写一行,尽管一条语句可以超过两行或者更多行,两条或更多条语句可以写在同一行上,语句之间用分号“;”分开。

<script type="text/javascript">

function f() {
alert(1);
}

f

();

</script>

f 与函数调用符()中间隔一行或者多行,都可以执行。就像定义函数的参数可以换行一样。

而下面的代码:

<script type="text/javascript">
(1+1)

(function f() {
alert(1);
})();

</script>
 
就会提示缺少函数,因为(1+1)这里的()是执行一个表达式,而(function f() {})这里的()却是一个函数调用符。所以就报错了…
 
所以一般会在代码前面加一个一元运算符(当然也可以使用;)进行分隔,而使用什么样的运算符,与习惯有关。
 
也有文章指出,使用什么符号与运算符的效率有关,详见:function与感叹号>>
 
 
2、既然前面的一元运算符或者;不能被省略,那么(function() {})这个()能不能省呢?
 
如果是;function() {}()就不行了,会报语法错误,其它一元运算符可以,但是仍然建议加上()。
 
 
 
立即调用函数表达式,有很多种方式,例如:
( function() {}() );
( function() {} )();
[ function() {}() ];

~ function() {}();
! function() {}();
+ function() {}();
- function() {}();

delete function() {}();
typeof function() {}();
void function() {}();
new function() {}();
new function() {};

var f = function() {}();

1, function() {}();
1 ^ function() {}();
1 > function() {}();
// ...

 

参考:

Immediately-Invoked Function Expression (IIFE)

function与感叹号

ECMA-262-3 in detail. Chapter 5. Functions. - Dmitry A. Soshnikov
Functions and function scope - Mozilla Developer Network
Named function expressions - Juriy “kangax” Zaytsev
JavaScript Module Pattern: In-Depth - Ben Cherry
Closures explained with JavaScript - Nick Morgan

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
C#跨窗体相互调用对方函数
对象对象程序设计,为跨窗体调用提供了良药:即构造函数。只要将某一个窗体对象以参数形式传入到另一个窗体对象的构造函数,即可实现。 一、实际案例需求 图1 Form1窗体设计   图2 Form2窗体设计   如图1、图2,现在要求图1按下按键,自己锁住,弹出图2;然后图2按下按键,自己关闭,解放图1的按键。
915 0
分布式调用跟踪系统的设计和应用学习
随着分布式服务架构的流行,特别是微服务等设计理念在系统中的应用,业务的调用链越来越复杂,一个请求可能会涉及到几十个服务的协同处理, 牵扯到多个团队的业务系统,那么如何快速准确的定位到线上故障?缺乏一个自上而下全局的调用id,如何有效的进行相关的数据分析工作?
9941 0
JavaScript创建对象(四)——组合使用构造函数和原型模式
在JavaScript创建对象(三)——原型模式中,我们阐述了原型模式存在的两个问题:一是没办法通过构造函数初始化对象属性,二是共享引用类型的数据导致数据错乱。
825 0
函数式编程与面向对象编程[1]: Lambda表达式 函数柯里化 高阶函数
函数式编程与面向对象编程[1]: Lambda表达式 函数柯里化 高阶函数.md 之剑 2016.5.2 11:19:09 什么是lambda表达式 例子 For example, in Lisp the 'square' function can b...
1072 0
JavaScript立即调用的函数表达式
主要参考知乎上这个问题:javascript 匿名函数有哪几种执行方式  长天之云的回答。 ~(function() {//todo})();!(function() {//todo})(); 对于不太熟悉JavaScript的同学来讲,可能会有两个疑问: 1、!(function() {})();前面为什么要加~、!这些符号? 后面的()是执行一个函数,而(function() {})是一个执行表达式,返回一个匿名函数的引用。
610 0
JavaScript创建对象(二)——构造函数模式
在JavaScript创建对象(一)—— 工厂模式中留下了一个问题,就是创建一个对象怎么判断一个对象的类型。换句话说使用下面这种方式: function createPerson(name, age, job){ var o = new Object(); o.
841 0
+关注
423
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载