js立即执行函数: (function ( ){...})( ) 与 (function ( ){...}( )) 有区别?
没有区别。
你需要明白 IIFE 的原理,我简单说一下:
function foo() {...} // 这是定义,Declaration;定义只是让解释器知道其存在,但是不会运行。
foo(); // 这是语句,Statement;解释器遇到语句是会运行它的。
IIFE 并非必须,传统一点可以这么写:
function foo() {...}
foo();
那么为什么要 IIFE?
- 传统的方法啰嗦,定义和执行分开写;
- 传统的方法直接污染全局命名空间(浏览器里的
global对象,如window)
于是,开发者们想找一个可以解决以上问题的写法。那么像下面这么写行不行呢?
function foo(...){}();
当然是不能,但是为什么呢?因为 function foo(...){} 这个部分只是一个声明,对于解释器来说,就好像你写了一个字符串 "function foo(...){}",它需要使用解析函数,比如 eval() 来执行它才可以。所以把 () 直接放在声明后面是不会执行,这是错误的语法。
如何把它变得正确?说起来也简单,只要把 声明 变成 表达式(Expression) 就可以了。
实际上转变表达式的办法还是很多的,最常见的办法是把函数声明用一对 () 包裹起来,于是就变成了:
(function foo() {...}) // 这里是故意换行,实际上可以和下面的括号连起来
();
这就等价于:
var foo = function () {...}; // 这就不是定义,而是表达式了。
foo();
但是之前我们说不行的那个写法,其实也可以直接用括号包起来,这也是一种等价的表达式:
(function foo(){...}());
所以答案是:木有区别~
另外,刚才说过转变表达式的方式很多,的确还有很多别的写法,比如:
!function foo() {...}();
或者
+function foo() {...}();
这些都可以。
我个人挺偏爱用 void 来转变表达式,因为此关键字不会有返回值。不过这一点真的没有什么要紧的,就当我“龟毛”好了……
void function () {
// 这里是真正需要的代码
}();
OK,所谓不去污染全局命名空间,是因为 IIFE 创建了一个新的函数作用域,你真正的业务代码被封装在其中,自然就不会触碰到全局对象了。如果你需要全局对象,那就 pass 给 IIFE:
void function (global) {
// 在这里,global 就是全局对象了
}(this) // 在浏览器里,this 就是 window 对象
js立即执行函数: (function ( ){...})( ) 与 (function ( ){...}( )) 有区别?的更多相关文章
- 使用"立即执行函数"(Immediately-Invoked Function Expression,IIFE)
一.原始写法 模块就是实现特定功能的一组方法. 只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块. function m1(){ //... } function m2(){ // ...
- js立即执行函数
一.JS立即执行函数的写法 方式1.最前最后加括号 (function(){alert(1);}()); 方式2.function外面加括号 (function(){alert(1);})(); ...
- js立即执行函数用法
js立即执行函数可以让你的函数在创建后立即执行,js立即执行函数模式是一种语法,可以让你的函数在定义后立即被执行,这种模式本质上就是函数表达式(命名的或者匿名的),在创建后立即执行. 一.JS立即执行 ...
- js自执行函数的常见写法
js自执行函数的常见写法 2016-12-20 20:02:26 1.关于自执行函数 1.1 写自执行函数的好处:独立的作用域,不会污染全局环境 (function() { })(); 1.2 理解重 ...
- js立即执行函数应用--事件绑定
js中立即执行函数的应用:应用到事件绑定上. 少说多做,直接运行代码(代码中有注释): <!DOCTYPE html> <html lang="zh"> & ...
- js 立即执行函数定义方法
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域
js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...
- Ajax:js自执行函数、jsonp、cros
一.js自执行函数 #(function(){alert(1);})(); (function(){ alert(1); } )(); 二.javascript同源策略 1. 什么是同源策略 理解跨域 ...
- JS 自执行函数
由于自己js基础知识薄弱,很多js的知识还没有掌握,所以接下来会经常写一些关于js基础知识的博客,也算给自己提个醒吧. js自执行函数,听到这个名字,首先会联想到函数.接下来,我来定义一个函数: fu ...
- 模板语言变量,js变量,js自执行函数之前嵌套调用
1.模板语言变量 前端html页面中展示 {{ nodeIp }} 2.js变量引用模板语言变量 把模板语言变量传递给js,js去执行页面操作(变量的转换,只适用于字符串) var IP = &quo ...
随机推荐
- 泛函编程(8)-数据结构-Tree
上节介绍了泛函数据结构List及相关的泛函编程函数设计使用,还附带了少许多态类型(Polymorphic Type)及变形(Type Variance)的介绍.有关Polymorphism的详细介绍会 ...
- Plug-in 'org.eclipse.cdt.ui' contributed an invalid Menu Extension
终于在mac上配置了最新的eclipse和adt(Win和Mac oxs通用),然后就Error Log报这种错误,运行了hello word,没有影响,但是依旧有这种错误! 记录下错误: eclip ...
- CSS选择器性能分析
写了几篇关于js的博客,也是关于性能的,现在,我觉得有必要那css来认真分析一下了.之前只是看别人这么写就跟着写,但是没有去研究这样写或者是不是正确的写法,性价比怎么样,渲染的效率好么!这些都没有考虑 ...
- [leetcode] Number of Islands
Number of Islands Given a 2d grid map of '1's (land) and '0's (water), count the number of islands. ...
- Android 文件访问权限的四种模式
Linux文件的访问权限* 在Android中,每一个应用是一个独立的用户* drwxrwxrwx* 第1位:d表示文件夹,-表示文件* 第2-4位:rwx,表示这个文件的拥有者(创建这个文件的应用) ...
- 【读书笔记】iOS-KVC
一,KVC即键/值编码. 二,KVC的基本调用包括-valueForKey:和-setValue:forKey:. 三,对于KVC,Cocoa自动放入和取出标量值.也就是说,当使用setValueFo ...
- 【读书笔记】iOS-简单的数据驱动程序
一,效果图. 二,,工程文件如下图所示: 三,DataModel.h #import <Foundation/Foundation.h> @interface DataModel : ...
- 【原/转】opencv的级联分类器训练与分类全程记录
众所周知,opencv下有自带的供人脸识别以及行人检测的分类器,也就是说已经有现成的xml文件供你用.如果我们不做人脸识别或者行人检测,而是想做点其他的目标检测该怎么做呢?答案自然是自己训练一个特定的 ...
- iOS 按钮小知识点总结
//设置按钮里面图片和文字的间距 btn.titleEdgeInsets=UIEdgeInsetsMake(0, 20, 0, 0); button.imageEdgeInsets = UIEdgeI ...
- 分享到QQ空间、新浪微博、腾讯微博的代码
今天公司原来的分享代码,在IE下有问题.网上找了下网上的分享代码. 给网页加上分享代码,借助网友的力量推广网站,目前已经很流行了 以下是网页代码 QQ空间分享代码如下: <a href=&quo ...