( 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. linux nf_conntrack 连接跟踪机制 2

    连接跟踪初始化 基础参数的初始化:nf_conntrack_standalone_init 会调用nf_conntrack_init_start 完成连接跟踪基础参数的初始化, hash slab 扩 ...

  2. Python项目2:弹幕复读机

    目录 一.功能 二.思路 三.实现 1. 获取弹幕 2. 发送弹幕 3. 封装调用 这个项目是我从B站的一个up主那学到的(原视频号269525280),感觉很是有趣,就是很欠打哈哈 一.功能 功能很 ...

  3. 死磕以太坊源码分析之Kademlia算法

    死磕以太坊源码分析之Kademlia算法 KAD 算法概述 Kademlia是一种点对点分布式哈希表(DHT),它在容易出错的环境中也具有可证明的一致性和性能.使用一种基于异或指标的拓扑结构来路由查询 ...

  4. day01-系统基础信息模块

    前言:2015年,由于大规模采用云平台虚拟机部署应用,每套应用系统的MySQl.接口机.WEB服务器.文件服务器需要经常进行版本升级.配置更新.安全补丁加固.iptables调整.配置核实,大量的手工 ...

  5. First day,beginning!

    beginning 在闲暇的时光记录当下的生活,一直是自己所期盼的: 由于种种原因(懒惰),一直未能开始,那么就从今天开始吧! 看下日期,从实习到现在一个月刚刚好: 公司很不错,师傅特别好,感觉自己是 ...

  6. 面经分享!蚂蚁金服三面被拒,重拾起鼓四面猿辅导成功拿下offer!

    前言 一直有小伙伴要我分享面经,说自己想面互联网公司,无奈经验太少想多看看其他人是怎么面的.我这两天刚好和一个刚拿到猿辅导offer的朋友吃了个饭,他向我说了说自己的面试经历.粉丝朋友是末流211毕业 ...

  7. 轻松学编曲,论FL钢琴卷帘

    我们平时做视频时难免要用到音乐,市面上又有很多调音编曲软件,我们该如何选择呢?在这里笔者给大家推荐一款音乐制作软件FL Studio20,也就是业内知名度很高的水果音乐制作软件,这款音乐制作软件笔者用 ...

  8. 使用Camtasia 让照片变身动态视频

    视觉化影像已经慢慢渗入我们平日的生活了,很多人已经慢慢地从单纯的文字记录,发展到使用照片记录生活,而视频化的记录也随着智能手机的普及而迅速发展起来.对于一些曾经使用照片记录的瞬间,我们也可以将其变身为 ...

  9. guitar pro系列教程(八):Guitar Pro编写使用的快捷符号

    上一节我们一起讨论了Guitar Pro的乐谱音乐符号的添加,在我们使用Guitar Pro写谱的时候,输入乐谱用鼠标点击是不是很麻烦而且又浪费时间呢,效果还不一定好,但是如果让我们结合键盘是不是就会 ...

  10. jQuery 根据value设置radio默认选中

    jQuery 根据value设置radio默认选中:HTML: <input type="radio" name="type" value="1 ...