1、我们首先要搞明白:函数表达式和函数声明的区别。

函数表达式:既可以为匿名函数也可以有函数名,但是调用的时候都是通过函数左边的变量func来调用

var func = function(){

alert('xxx');

};

var b = new func();

函数声明:必须有函数名

function func(){

alert('xxx');

}

func();

所以立即执行调用的函数表达式有一下几种

!function () { /* code */ } ();
~function () { /* code */ } ();
-function () { /* code */ } ();
+function () { /* code */ } ();
他们中的每一个都可以看成两部分:!function () { /* code */ }和(),其中
!function () { /* code */ }是一个函数表达式,而()的意思就是立即执行。
######并不意味着function e(){}()就可以立即执行,并且这个写法会报错!!!!,而function e(){}(1)不会报错,但是也不是立即执行函数表达式
2、理解自执行函数和立即执行函数表达式。
自执行函数:function func(){
       func();
      }
而(function(){}())叫做立即执行函数表达式
// 这是一个自执行的匿名函数,因为没有标示名称
// 必须使用arguments.callee属性来执行自己
var foo = function () { arguments.callee(); }; // 这可能也是一个自执行的匿名函数,仅仅是foo标示名称引用它自身
// 如果你将foo改变成其它的,你将得到一个used-to-self-execute匿名函数
var foo = function () { foo(); }; // 有些人叫这个是自执行的匿名函数(即便它不是),因为它没有调用自身,它只是立即执行而已。
(function () { /* code */ } ()); // 为函数表达式添加一个标示名称,可以方便Debug
// 但一定命名了,这个函数就不再是匿名的了
(function foo() { /* code */ } ()); // 立即调用的函数表达式(IIFE)也可以自执行,不过可能不常用罢了
(function () { arguments.callee(); } ());
(function foo() { foo(); } ());

3、用闭包保存状态


和普通function执行的时候传参数一样,自执行的函数表达式也可以这么传参,因为闭包直接可以引用传入的这些参数,利用这些被lock住的传入参数,自执行函数表达式可以有效地保存状态。


// 这个代码是错误的,因为变量i从来就没背locked住
// 相反,当循环执行以后,我们在点击的时候i才获得数值
// 因为这个时候i操真正获得值
// 所以说无论点击那个连接,最终显示的都是I am link #10(如果有10个a元素的话) var elems = document.getElementsByTagName('a'); for (var i = 0; i < elems.length; i++) { elems[i].addEventListener('click', function (e) {
e.preventDefault();
alert('I am link #' + i);
}, 'false'); } // 这个是可以用的,因为他在自执行函数表达式闭包内部
// i的值作为locked的索引存在,在循环执行结束以后,尽管最后i的值变成了a元素总数(例如10)
// 但闭包内部的lockedInIndex值是没有改变,因为他已经执行完毕了
// 所以当点击连接的时候,结果是正确的 var elems = document.getElementsByTagName('a'); for (var i = 0; i < elems.length; i++) { (function (lockedInIndex) { elems[i].addEventListener('click', function (e) {
e.preventDefault();
alert('I am link #' + lockedInIndex);
}, 'false'); })(i); }
												

js 立即执行函数的更多相关文章

  1. js立即执行函数

    一.JS立即执行函数的写法 方式1.最前最后加括号 (function(){alert(1);}()); 方式2.function外面加括号   (function(){alert(1);})(); ...

  2. 模板语言变量,js变量,js自执行函数之前嵌套调用

    1.模板语言变量 前端html页面中展示 {{ nodeIp }} 2.js变量引用模板语言变量 把模板语言变量传递给js,js去执行页面操作(变量的转换,只适用于字符串) var IP = &quo ...

  3. js立即执行函数用法

    js立即执行函数可以让你的函数在创建后立即执行,js立即执行函数模式是一种语法,可以让你的函数在定义后立即被执行,这种模式本质上就是函数表达式(命名的或者匿名的),在创建后立即执行. 一.JS立即执行 ...

  4. js自执行函数的常见写法

    js自执行函数的常见写法 2016-12-20 20:02:26 1.关于自执行函数 1.1 写自执行函数的好处:独立的作用域,不会污染全局环境 (function() { })(); 1.2 理解重 ...

  5. js立即执行函数应用--事件绑定

    js中立即执行函数的应用:应用到事件绑定上. 少说多做,直接运行代码(代码中有注释): <!DOCTYPE html> <html lang="zh"> & ...

  6. js 立即执行函数定义方法

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  7. js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域

    js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...

  8. Ajax:js自执行函数、jsonp、cros

    一.js自执行函数 #(function(){alert(1);})(); (function(){ alert(1); } )(); 二.javascript同源策略 1. 什么是同源策略 理解跨域 ...

  9. JS 自执行函数

    由于自己js基础知识薄弱,很多js的知识还没有掌握,所以接下来会经常写一些关于js基础知识的博客,也算给自己提个醒吧. js自执行函数,听到这个名字,首先会联想到函数.接下来,我来定义一个函数: fu ...

  10. JS立即执行函数表达式(IIFE)

    原文为 http://benalman.com/news/2010/11/immediately-invoked-function-expression/#iife ----------------- ...

随机推荐

  1. vue练习

    <div id="app"> <div> <span>姓名</span> <input type="text&quo ...

  2. Missing parentheses in call to 'print'

    这个消息的意思是你正在试图用python3.x来运行一个只用于python2.x版本的python脚本. print"Hello world" 上面的语法在python3中是错误的 ...

  3. Ubuntu下Git从搭建到使用详解

    Ubuntu下Git从搭建到使用详解 一.git的搭建 (1).sudo apt-get update (2).sudo apt-get -y install git 符:安装最新版本方法: add- ...

  4. ./configure: error: the HTTP rewrite module requires the PCRE library解决

    ./configure: error: the HTTP rewrite module requires the PCRE library解决   有时候,我们需要单独安装nginx,来处理大量的下载 ...

  5. CRTD模拟MFG工单进行绑定优化

    需求:按单按库生产的CRTD状态半成品工单重复创建问题 绑定成功案例: SELECT DEMANDLINEID,SUPPLYORDERID,DEMANDORDERID,QTYALLOCATED,ITE ...

  6. Oracle11g RAC安装

    双节点RAC环境,数据库 racdb 实例1:racdb1      实例2:racdb2 1.IP规划 名称             oracle-db1    oracle-db2PUBLIC I ...

  7. 解题5(StringMerge1)

    题目描述 按照指定规则对输入的字符串进行处理. 详细描述: 将输入的两个字符串合并. 对合并后的字符串进行排序,要求为:下标为奇数的字符和下标为偶数的字符分别从小到大排序.这里的下标意思是字符在字符串 ...

  8. python模块 re模块与python中运用正则表达式的特点 模块知识详解

    1.re模块和基础方法 2.在python中使用正则表达式的特点和问题 3.使用正则表达式的技巧 4.简单爬虫例子 一.re模块 模块引入; import re 相关知识: 1.查找: (1)find ...

  9. Oracle 入门

    一.安装Oracle 11g 服务端 服务端安装教程:https://jingyan.baidu.com/article/363872eccfb9266e4aa16f5d.html 二.安装客户端 客 ...

  10. spark基本组件与概念

    数据结构 核心之数据集RDD 俗称为弹性分布式数据集.Resilient Distributed Datasets,意为容错的.并行的数据结构,可以让用户显式地将数据存储到磁盘和内存中,并能控制数据的 ...