( function(){…} )() 和 ( function (){…} () ) 是两种javascript立即执行函数的常见写法,要理解立即执行函数,需要先理解一些函数的基本概念。

函数声明、函数表达式、匿名函数

函数声明:function fnName () {…};使用function关键字声明一个函数,再指定一个函数名、参数列表和方法体,叫函数声明。

函数表达式:var fnName = function () {…};使用function关键字声明一个函数,但未给函数命名,最后将匿名函数赋予一个变量,叫函数表达式,这是最常见的函数表达式语法形式。

匿名函数:function () {}; 使用function关键字声明一个函数,但未给函数命名,所以叫匿名函数,匿名函数属于函数表达式,匿名函数有很多作用,赋予一个变量则创建函数,赋予一个事件则成为事件处理程序或创建闭包等等。

立即执行函数

函数声明和函数表达式不同之处在于:

  • Javascript引擎在解析javascript代码时会‘函数声明提升’(Function declaration Hoisting)当前执行环境(作用域)上的函数声明,而函数表达式必须等到Javascirtp引擎执行到它所在行时,才会从上而下一行一行地解析函数表达式。
  • 函数表达式后面可以加括号立即调用该函数,函数声明不可以,只能以fnName()形式调用 。

两者差别例子

函数声明提升

fnName();
function fnName(){
...
}
//正常,因为‘提升’了函数声明,函数调用可在函数声明之前 fnName();
var fnName=function(){
...
}
//报错,变量fnName还未保存对函数的引用,函数调用必须在函数表达式之后

匿名函数执行

(function(a){
console.log(a); //firebug输出123,使用()运算符
})(123); (function(a){
console.log(a); //firebug输出1234,使用()运算符
}(1234)); !function(a){
console.log(a); //firebug输出12345,使用!运算符
}(12345); +function(a){
console.log(a); //firebug输出123456,使用+运算符
}(123456); -function(a){
console.log(a); //firebug输出1234567,使用-运算符
}(1234567); var fn=function(a){
console.log(a); //firebug输出12345678,使用=运算符
}(12345678)

可以看到输出结果,在function前面加!、+、 -甚至是逗号等到都可以起到函数定义后立即执行的效果,而()、!、+、-、=等运算符,都将函数声明转换成函数表达式,消除了javascript引擎识别函数表达式和函数声明的歧义,告诉javascript引擎这是一个函数表达式,不是函数声明,可以在后面加括号,并立即执行函数的代码。加括号是最安全的做法,因为!、+、-等运算符还会和函数的返回值进行运算,有时造成不必要的麻烦。

js中的(function(){})()立即执行的更多相关文章

  1. js中使用function定义类、实例化,函数的调用方法

    function Test002(name, age){ name, age, this.printInfo = function(){ //定义的公有方法 console.log(name, age ...

  2. 解决Js中的resize事件执行两次的方法

    问题: 页面自适应的时候需要用到js的resize事件,但在执行过程中发现只要触发resize事件就会执行2次 原生js: window.onresize = function(){ console. ...

  3. JS中的Function对象

    Function是函数的原型,所有的函数都来源于Function,获得函数的方法有两种类型,分为动态函数和函数继承. 动态函数 创建一个Function语法: var func = new Funct ...

  4. js中 a : function(){}这是什么格式? 代表什么含义?怎样学习这样的格式?

    js中的json. 一种轻量级数据格式.json中的值是map形式的就是key->value. 具体看下边的示例; var person = { // 用 大括号括声明一个json. " ...

  5. 【微信小程序】在js中导入第三方js或自己写的js,使用外部js中的function的两种方法 import和require的区别使用方法 【外加:使用第三方js导出的默认function的调用方法】

    如下 定义了一个外部js文件,其中有一个function import lunaCommon from '../lunaCommon.js'; var ctx = wx.getStorageSync( ...

  6. JS中同名函数有效执行顺序

    html中如果出现函数同名时:如果有多个外部引入的js文件,例如a.js和b.js(引入顺序假定是a.js,然后是b.js),同时html中本身也有内部的js.那么针对 出现函数名一样的情况时,无论他 ...

  7. 详细js中(function(window,document,undefined))的作用

    在jquery插件中我们经常看到以下这段代码 对于很多初学者来说很难明白这表示什么,下边我将为大家介绍其相应的作用. 1.代码最前面的分号,可以防止多个文件压缩合并以为其他文件最后一行语句没加分号,而 ...

  8. js中,(function(){})()的用法解析

    (function($){...})(jQuery)  含义 经常用,今天总结一下,下文摘自某网友的总结: (function($){...})(jQuery)实际上是匿名函数,不懂得朋友可以继续往下 ...

  9. 在JQuery和Js中,如何让ajax执行完后再继续往下执行 async

    async (默认: true) 默认设置下,所有请求均为异步请求.如果需要发送同步请求,请将此选项设置为 false.注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行. var t ...

随机推荐

  1. Shell脚本常用命令整理

    该笔记主要整理了一些常见的脚本操作命令,大致如下(持续补充中): 1. while.for循环 1. while.for循环 #!/bin/bash # while循环 v_start_date=${ ...

  2. BeatifulSoup在测试工作中的应用

    近期要做一个项目,重复性劳动比较多,小伙伴建议我用Jsoup,但是由于项目紧急,我直接选择了BeautifulSoup,关键原因是我Java语言不如Python掌握的熟练啊!所以,查了一圈它的中文文档 ...

  3. ceph 的crush算法 straw

    很多年以前,Sage 在写CRUSH的原始算法的时候,写了不同的Bucket类型,可以选择不同的伪随机选择算法,大部分的模型是基于RJ Honicky写的RUSH algorithms 这个算法,这个 ...

  4. dm-crypt加密磁盘

    dm-cry加密方式密码与文件 与其它创建加密文件系统的方法相比,dm-crypt系统有着无可比拟的优越性:它的速度更快,易用性更强.除此之外,它的适用面也很广,能够运行在各种块设备上,即使这些设备使 ...

  5. Vue 组件化开发

    组件化开发 基本概念 在最开始的时候,已经大概的聊了聊Vue是单页面开发,用户总是在一个页面上进行操作,看到的不同内容也是由不同组件构成的. 通过用户的操作,Vue将会向用户展示某些组件,也会隐藏某些 ...

  6. 安恒DASCTF 四月战 WP

    web1 打开提就是源码审计 考点:反序列化POP链.反序列化字符串逃逸 show_source("index.php"); function write($data) { ret ...

  7. get_object_vars

    get_object_vars()

  8. 4.1 Spring源码 --- 监听器的原理

    目标: 1. 监听器如何使用 2. 监听器的原理 3. 监听器的类型 4. 多播器的概念和作用 5. 接口类型的监听器是如何注册的? 6. 注解类型的监听器和如何注册的? 7. 如果想在所有的bean ...

  9. 面试官:你说你精通SpringBoot,你给我说一下类的自动装配吧

    ## 剖析@SpringBootApplication注解 创建一个SpringBoot工程后,SpringBoot会为用户提供一个Application类,该类负责项目的启动: ```@Spring ...

  10. go学习路线资料

    编辑器 JetBrains公司出品的,goland go初步学习路线 Go 指南 如何使用Go编程 实效Go编程 Go by Example 中文版 参考: Go 语言学习资料与社区索引 Go入门指南 ...