(function(){}),(function(){}())解析

前面一段时间,看到(function(){}),(function(){}())这些函数就犯晕,不知道它到底是什么意思,为什么函数外要加小括号,函数后要加小括号,加和不加到底有什么区别……一直犯迷糊,看了汤姆大叔的《深入理解JavaScript系列(4):立即调用的函数表达式》后才明白它们到底是什么东西,终于将困扰我已久的东西给干掉了。

  在这里,我先介绍一下函数引用和函数调用的差别、函数声明表现形式和函数表达式的表现形式。

  一、函数引用和函数调用的差别

  函数引用和调用的差别与函数名称后是否有小括号()有关,函数引用只会单独出现,但函数调用后面必定会带有一个小括号,很多时候还附有自变量。

  表示方式(举例说明):

function foo(){
    //函数体
}
var f = foo;  //函数引用
var ff = foo();  //函数调用,可直接调用foo(),也可调用f()
  二、函数声明的表现形式

  带有函数名的函数是函数声明,包括保留字function,函数名(必有),圆括号中的参数(可有可无)和花括号中的函数主体。

  表示方式(举例说明):

function foo(str){
    //函数体
}
  三、函数表达式的表现形式

  赋值函数,函数外带有小括号的函数是函数表达式(就举两个例子),包括赋值变量(可有),函数外小括号(可有),保留字function,函数名(可有可无),圆括号中的参数(可有可无)和花括号中的函数主体。

  表示方式(举例说明):

复制代码
//赋值型函数表达式
var f = function foo(str){
    //函数体
}
//分组括号型函数表达式,这是立即执行函数表达式,后面会讲解
(function(){
    //函数体
})();
复制代码
  四、函数实例

  第一种:

var foo = function(){}
  分析:该函数为函数表达式,也可以理解成是一个引用,用foo()调用可执行。

  第二种:

var foo = function(){}();
  分析:该函数为立即调用函数,这和第一种的区别就是后面有无小括号,也就是函数调用和函数引用的区别,函数调用可理解为自执行函数(最好在function(){}外加一个括号变成(function(){})(),更规范一点);

  第三种:

function(){}
  分析:该函数缺少名称,未赋值,所以报错。

  第四种:

function(){}()
  分析:function(){}是语句,不是函数表达式,只有表达式才能调用,所以报错。

  第五种:

(function(){})();
  分析:(function(){})是函数表达式,能调用,称为匿名自执行函数。

  第六种:

(function(){}());
  分析:(function(){}())是函数表达式,可用,称为匿名自执行函数(汤姆大叔推荐的写法,我更喜欢第五种写法)。

  第七种:

function foo(){}
  分析:该函数为实名函数,可调用。

  第八种:

function foo(){}();
  分析:解释和第四种一样,因为function foo(){}是语句,不是表达式,不能调用,所以报错。

  第九种:

function foo(){}(a);
  分析:解释和第四种一样,因为function foo(){}是语句,不是表达式,不能调用,但是因为后面括号中传入了参数,所以未抛出异常,也就为报错,但是本身还是不执行的。

  第十种:

(function foo(){});
  分析:function外添加一个括号,所以外部作用域就不能调用foo()这个函数了,里面被当做匿名函数了,我个人认为这样的函数没什么意义,既不能调用也不能自执行。

  第十一种:

(function foo(){})();
  分析:有了十,这个就可以理解为是匿名自执行函数了。但是在ie8以下能执行,该表达式被当做函数声明,函数声明有种“置顶解析”的行为,就是不管函数在哪个地方定义,它都会在该作用域顶部默认声明好。

  第十二种:

!function(){}();
  分析:其实小括号和js的&&,异或,感叹号等操作是在函数声明和表达式消除歧义的,为可执行的。

  第十三种:

new function(){}();
  分析:可执行。

  最后,非常感谢。有哪里讲解的不好或者是不正确的地方,希望大家能第一时间反馈给我,希望和大家共同进步~

时间: 2024-08-10 00:04:43

(function(){}),(function(){}())解析的相关文章

VC中function函数解析

C++标准库是日常应用中非常重要的库,我们会用到C++标准库的很多组件,C++标准库的作用,不单单是一种可以很方便使用的组件,也是我们学习很多实现技巧的重要宝库.我一直对C++很多组件的实现拥有比较强的兴趣.最近花了一些时间,查看了C++中function类的实现,将其中的要点,写在这里(这里只介绍其中的一部分): 1.首先VC实现了将<Ret(T1, T2, ...)>这种类型的类型参数,改变为<Ret, T1, T2, ...>这种类型的类型参数.使用的方法如下: templa

function,new function,Function,new Function 之间的区别

测试一: var fud01 = function()  { var temp = 100; this.temp = 200; return temp + this.temp; } alert(typeof(fud01)); alert(fud01()); 运行结果: function 300 最普通的function使用方式,定一个JavaScript函数.在大扩号内的变量作用域中,this指代fud01的所有者. 测试二: var fud02 = new function() { var t

$(function(){})与 (function(){})() (function($){})() 的区别

1. $(function(){ }) 或 jQuery(function(){ }) 此函数也可以写成 jQuery(function(){ }), 用于存放操作DOM对象的代码,执行其中代码时DOM对象已存在.不可用于存放开发插件的代码,因为jQuery对象没有得到传递,外部通过jQuery.method也调用不了其中的方法(函数). 2. (function(){})() 或  function(){ })(jQuery) 此函数也可以写成   function(){ })(jQuery)

js调用函数时括号加与不加的区别,function()&amp;function

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>当前系统时间</title> <link rel="stylesheet" href="style.css" /> <scri

javascript 中function(){},new function(),new Function(),Function 简单介绍

函数是JavaScript中很重要的一个语言元素,并且提供了一个function关键字和内置对象Function,下面是其可能的用法和它们之间的关系. function使用方式 var foo01 = function() //或 function foo01() { var temp = 100; this.temp = 200; return temp + this.temp; } alert(typeof(foo01)); // function alert(foo01()); // 30

Function(Function(F...

[题目描述]: 对于一个递归函数w(a,b,c) 如果a<=0 or b<=0 or c<=0就返回值1. 如果a>20 or b>20 or c>20就返回w(20,20,20) 如果a<b并且b<c 就返回w(a,b,c-1)+w(a,b-1,c-1)-w(a,b-1,c) 其它别的情况就返回w(a-1,b,c)+w(a-1,b-1,c)+w(a-1,b,c-1)-w(a-1,b-1,c-1) 这是个简单的递归函数,但实现起来可能会有些问题.当a,b,c

VJ 1080 Function(Function(F...

描述 对于一个递归函数w(a,b,c) 如果a<=0 or b<=0 or c<=0就返回值1. 如果a>20 or b>20 or c>20就返回w(20,20,20) 如果a<b并且b<c 就返回w(a,b,c-1)+w(a,b-1,c-1)-w(a,b-1,c) 其它别的情况就返回w(a-1,b,c)+w(a-1,b-1,c)+w(a-1,b,c-1)-w(a-1,b-1,c-1) 这是个简单的递归函数,但实现起来可能会有些问题.当a,b,c均为15时

function类型

创建函数的方法 var sum  =function(){} function sum(){} 函数名其实 是一个包含函数的指针!!!所以一个函数可以有多个名字. 在函数sum已经被赋值为Null时.kum仍然直线函数. 一.函数声明与函数表达式 函数声明会有一个函数声明提升的过程.在解析器读取的时候 console.log(sum(1,2)) //3 function sum(num1,num2) { return num1+ num2; } console.log(kum(1,2)); //

全面理解Javascript中Function对象的属性和方法

函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这些属性和方法,这对于理解Javascript的继承机制具有一定的帮助. 属性(Properties) arguments 获取当前正在执行的 Function 对象的所有参数,是一个类似数组但不是数组的对象,说它类似数组是因为其具有数组一样的访问性质及方式,可以由arguments[n]来访问对应的单个参数的值,并拥有数组长度属性length.还有就是arguments对象存储的是实际传递给

IIFE-js中(function(){…})()立即执行函数写法理解

介绍IIFE IIFE的性能 使用IIFE的好处 IIFE最佳实践 jQuery优化 在Bootstrap源码(具体请看<Bootstrap源码解析>)和其他jQuery插件经常看到如下的写法: Js代码   +function ($) { }(window.jQuery); 这种写法称为: IIFE (Imdiately Invoked Function Expression 立即执行的函数表达式). 一步步来分析这段代码. 先弄清函数表达式(function expression)和 函数