从function前面的!想到的
2014-06-18 14:11
148 查看
最近没事喜欢看看,一些js库的源码,结果发现库前不是加一个!就是加+或者一个(),心中猜出个大概知道这个是让函数自动执行,可是这么多符号达到同一个目的,原理是什么呢,下面做一下剖析:
先从IIFE开始介绍
IIFE(Imdiately Invoked Function Expression 立即执行的函数表达式)
把这个代码放在console中执行会报错
因为这个是一个匿名函数,要想让它正常运行就必须给个函数名,然后通过函数名调用。
好了这下知道为啥我们看到很多类库写的时候也是匿名函数结果不报错了吧,就是因为这些前面加的符号的原因。
其实在匿名函数前面加上这些符号后,就把一个函数声明语句变成了一个函数表达式,是表达式就会在script标签中自动执行。
运算符
①为什么加上了这些运算符后就能让一个匿名函数变成一个不会报错的函数表达式呢?
我们自然会想到javascript的解析器到底是怎么工作识别的呢,js解析器执行js表达式这个肯定是没有问题的。其实无论是括号,还是感叹号,让整个语句合法做的事情只有一件,就是让一个函数声明语句变成了一个表达式。所以我们让一个函数定义变成一个函数表达式来执行就不会报错。
②原理
但是我们按上面在console中执行发现出错了
因为这样的代码混淆了函数声明和函数调用,以这种方式声明的函数
但是括号则不同,它将一个函数声明转化成了一个表达式,解析器不再以函数声明的方式处理函数a,而是作为一个函数表达式处理,也因此只有在程序执行到函数a时它才能被访问。所以,任何消除函数声明和函数表达式间歧义的方法,都可以被解析器正确识别。所以,赋值,逻辑,甚至是逗号,各种操作符都可以告诉解析器,这个不是函数声明,它是个函数表达式。并且,对函数一元运算可以算的上是消除歧义最快的方式,感叹号只是其中之一,如果不在乎返回值,这些一元运算都是有效的
性能
针对这些一元运算符,到底用哪个好呢,测试发现()的性能最优越,但是差别都不是特明显,所以对于一个库来说用几个这样的符号来说看不出什么影响,所以平常用! + -都可以,就看个人的代码习惯,当然最好还是用()。
参考:
①http://swordair.com/function-and-exclamation-mark/
② http://suqing.iteye.com/blog/1981591
先从IIFE开始介绍
IIFE(Imdiately Invoked Function Expression 立即执行的函数表达式)
function(){ alert('IIFE'); }
把这个代码放在console中执行会报错
因为这个是一个匿名函数,要想让它正常运行就必须给个函数名,然后通过函数名调用。
好了这下知道为啥我们看到很多类库写的时候也是匿名函数结果不报错了吧,就是因为这些前面加的符号的原因。
其实在匿名函数前面加上这些符号后,就把一个函数声明语句变成了一个函数表达式,是表达式就会在script标签中自动执行。
运算符
①为什么加上了这些运算符后就能让一个匿名函数变成一个不会报错的函数表达式呢?
我们自然会想到javascript的解析器到底是怎么工作识别的呢,js解析器执行js表达式这个肯定是没有问题的。其实无论是括号,还是感叹号,让整个语句合法做的事情只有一件,就是让一个函数声明语句变成了一个表达式。所以我们让一个函数定义变成一个函数表达式来执行就不会报错。
②原理
这样是一个函数声明 function a(){ alert('IIFE'); } 这样是一个函数调用 a(); 理解一下就是在一个声明了的函数后面加上一个()就可以调用函数了 function a(){ alert('IIFE'); }() 就这样
但是我们按上面在console中执行发现出错了
因为这样的代码混淆了函数声明和函数调用,以这种方式声明的函数
a,就应该以
a();的方式调用。
但是括号则不同,它将一个函数声明转化成了一个表达式,解析器不再以函数声明的方式处理函数a,而是作为一个函数表达式处理,也因此只有在程序执行到函数a时它才能被访问。所以,任何消除函数声明和函数表达式间歧义的方法,都可以被解析器正确识别。所以,赋值,逻辑,甚至是逗号,各种操作符都可以告诉解析器,这个不是函数声明,它是个函数表达式。并且,对函数一元运算可以算的上是消除歧义最快的方式,感叹号只是其中之一,如果不在乎返回值,这些一元运算都是有效的
!function(){alert('iifksp')}() // true +function(){alert('iifksp')}() // NaN -function(){alert('iifksp')}() // NaN ~function(){alert('iifksp')}() // -1
性能
针对这些一元运算符,到底用哪个好呢,测试发现()的性能最优越,但是差别都不是特明显,所以对于一个库来说用几个这样的符号来说看不出什么影响,所以平常用! + -都可以,就看个人的代码习惯,当然最好还是用()。
参考:
①http://swordair.com/function-and-exclamation-mark/
② http://suqing.iteye.com/blog/1981591
相关文章推荐
- 从function前面的!想到的
- 从function前面的!想到的
- 从function前面的!想到的
- 在函数前面加分号——;(function(){})()
- jQuery中;function($,undefined) 前面的分号的用处
- function前面分号是什么用处介绍
- [JavaScript] Script 中 function, variable 的定义会提升到函数执行前面;但是,function 中定义的 global variable 则不会被提升
- JavaScript 中在 function() {} 前面加感叹号的作用
- jQuery中;function($,undefined) 前面的分号的用处
- input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年,我们被耍过的bug——has
- js 立即执行函数,() .则前面的function 是表达式,不能是函数申明
- javascript中function前面的符号的意思!
- 匿名函数function前面的! ~等符号作用小解
- javascript 中,function 方法前面一个分号是啥意思
- 如何产生不重复的随机数?最容易想到的方法,是逐个产生这些随机数,每产生一个,都跟前面的随机数比较,如果重复,就重新产生。这是个很笨的方法,且比较次数呈线性增长,越往后次数越多。其实这些比较是多余的,
- 浅谈function前面的+ ! ()
- ;function($,undefined) 前面的分号是什么用处
- function($,undefined) 前面的分号是什么用处
- JS在function前面加上"+"的含义
- js里function前面加!