js匿名函数确实是个好东西
<body onload="alert('http://www.baidu.com/');">
<script type="text/javascript">
void function()
{
alert('弹出框');
}();
</script>
</body>
<body onload="alert('http://www.baidu.com/');">
<script type="text/javascript">
void function()
{
alert('弹出框');
}();
</script>
</body>
<body onload="alert('http://www.baidu.com/');">
<script type="text/javascript">
(function()
{
alert('弹出框');
})();
</script>
</body>
<body onload="alert('http://www.baidu.com/');">
<script type="text/javascript">
(function()
{
alert('弹出框');
})();
</script>
</body>
从以上例子中可以看出,js匿名函数的执行是在 onload 之前,那么空函数是否可以取代onload的动作?
js匿名函数的写法还有n多种. 顾名思义,匿名函数就是没有实际名字的函数。例如,我们把上面的例子中,函数的名字去掉,再判断一下他是不是一个函数:
alert(typeof function(){});// "function"
alert(typeof function(x,y){return x+y;});// "function"
alert(typeof new Function("x","y","return x*y;"))// "function"
alert(typeof function(){});// "function" alert(typeof function(x,y){return x+y;});// "function" alert(typeof new Function("x","y","return x*y;"))// "function"
我们可以很容易地看到,它们全都是Function对象,换言之,他们都是函数,但是他们都有一个特点——没有名字。所以我们把他们称作“匿名函数”。然而,正因为他们没有“名字”,我们也没有办法找到他们。这就引申了如何去调用一个匿名函数的问题了。
匿名函数的调用:要调用一个函数,我们必须要有方法定位它,引用它。所以,我们会需要帮它找一个名字。例如:
var abc=function(x,y)
{
return x+y;
}
alert(abc(2,3)); // "5"
var abc=function(x,y){ return x+y; } alert(abc(2,3)); // "5"
上面的操作其实就等于换个方式去定义函数,这种用法是我们比较频繁遇到的。例如我们在设定一个DOM元素事件处理函数的时候,我们通常都不会为他们定名字,而是赋予它的对应事件引用一个匿名函数。
对匿名函数的调用其实还有一种做法,也就是我们看到的jQuery片段——使用()将匿名函数括起来,然后后面再加一对小括号(包含参数列表)。我们再看一下以下例子:
alert((function(x,y){return x+y;})(2,3));// "5"
alert((new Function("x","y","return x*y;"))(2,3));// "6"
alert((function(x,y){return x+y;})(2,3));// "5" alert((new Function("x","y","return x*y;"))(2,3));// "6"
很多人或许会奇怪,为什么这种方法能成功调用呢?觉得这个应用奇怪的人就看一下我以下这段解释吧。
大家知道小括号的作用吗?小括号能把我们的表达式组合分块,并且每一块,也就是每一对小括号,都有一个返回值。这个返回值实际上也就是小括号中表达式的返回值。所以,当我们用一对小括号把匿名函数括起来的时候,实际上小括号对返回的,就是一个匿名函数的Function对象。因此,小括号对加上匿名函数就如同有名字的函数般被我们取得它的引用位置了。所以如果在这个引用变量后面再加上参数列表,就会实现普通函数的调用形式。
不知道以上的文字表述大家能不能看明白,如果还是理解不了的话,再看一下以下的代码试试吧。
var abc=function(x,y){return x+y;};// 把匿名函数对象赋给abc
//abc的constructor就和匿名函数的constructor一样了。也就是说,两个函数的实现是一样的。
alert((abc).constructor==(function(x,y){return x+y;}).constructor);
PS:constructor是指创建对象的函数。也就是函数对象所代表的函数体。
总之,将其(被小括号包含的匿名函数)理解为括号表达式返回的函数对象,然后就可以对这个函数对象作正常的参数列表调用了。(前面这里犯了个错误,只有函数表达式还是不能直接调用函数的,去掉匿名函数括号必须要伴随将表达式赋值。也就是(function(){alert(1)})()应该是与 a=function(){alert(1)}()等价,不能连a=都去掉。)
js匿名函数确实是个好东西的更多相关文章
- js匿名函数和闭包总结
js匿名函数和闭包总结 一.总结 一句话总结:匿名函数的最主要作用是创建闭包,闭包就是将函数内部和函数外部连接起来的一座桥梁.内层的函数可以使用外层函数的所有变量,即使外层函数已经执行完毕.闭包可以用 ...
- JS匿名函数的理解
js匿名函数的代码如下:(function(){ // 这里忽略jQuery 所有实现 })(); 半年前初次接触jQuery 的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的 ...
- JS匿名函数自执行函数
JS匿名函数自执行函数:(function(){})();(function(){}) 这是一个函数,函数后面接(),则是调用函数 比如(function(arg){console.log(arg); ...
- js匿名函数(变量加括号就是函数)
js匿名函数(变量加括号就是函数) 一.总结 变量加括号就是函数,而函数的括号是用来传参的 1.类比:以正常函数去想匿名函数,匿名函数比正常函数只是少了函数名,本质还是一样,该怎么传参还是怎么传参,小 ...
- js匿名函数测试
js匿名函数测试 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...
- js 匿名函数 用法
JS执行顺序为从上到下 先声明存储匿名函数的变量放在JS文件中 <script src="/Scripts/niming.js" type="text/javasc ...
- js 匿名函数-立即调用的函数表达式
先提个问题, 单独写匿名函数为什么报错?return 匿名函数 为什么不报错? 如图: 第二种情况在 f 还没有执行的时候,就报错了,,,当然这得归因于函数声明语句声明提前(发生在代码执行之前)的原因 ...
- JS 匿名函数或自执行函数总结
JS引擎在遇到function关键字时做如下两种处理: 1.当语句是以function关键字开头:此时的JS语句解释为函数声明,因此function关键字后面必须要跟函数名字,如果写成匿名函数,则会报 ...
- js 匿名函数 js-函数定义方法
1.任何函数都是有返回值的,没有返回值的,在某些语言里称之为过程例如PL/SQL 2.js中的函数如果没有return 关键字指明给出的返回值,那么当调用完函数后,会返回“undefined" ...
随机推荐
- alibaba 用360的evpp -》个别项目
- Python+request+ smtplib 测试结果html报告邮件发送(上)《五》
此方法通用适合所有邮箱的使用,只需注意几个点,如下: QQ邮箱.其他非QQ邮箱的写法,区别点如下: #--------------------------使用腾讯企业邮箱作为发件人的操作如下----- ...
- vue1 计算属性
- jQuery获取父窗口的元素
js获取父页面的元素可以用 $(window.parent.document).find("#customer_id").val();这里的customer_id表示父页面某一个元 ...
- MySQL之text字段
TEXT类型一般分为 TINYTEXT(255长度).TEXT(65535). MEDIUMTEXT(int最大值16M),和LONGTEXT(long最大值4G)这四种,它被用来存储非二进制字符集, ...
- 3、python--第三天练习题
#1.简述普通参数.指定参数.默认参数.动态参数的区别 #1.普通参数就是传入的函数,没有默认值 def f(a): a = a + 1 return a print(f(3)) #2.指定参数 de ...
- Shell 04 字符串处理、正则表达式
一.字符串的处理 1.字符串截取 1.1 s{}表达式 ${变量名:起始位置:长度} (从0开始) n=number (n="number") echo ${#n} -- ...
- js中对象的输出顺序
前言:最近用for-in时,看到说for-in不能保证遍历的对象顺序,对此有些疑问,于是便研究了下,本文做简要说明. 现象 let obj = { a: 'a', b: 'b', 1: 1, 2: 2 ...
- 费马小定理 x
费马小定理(Fermat Theory) 是数论中的一个重要定理,其内容为: 假如p是质数,且gcd(a,p)=1,那么 a(p-1)≡1(mod p).即:假如a是整数,p是质数,且a,p互质(即两 ...
- 8月清北学堂培训 Day1
今天是赵和旭老师的讲授~ 动态规划 动态规划的基本思想 利用最优化原理把多阶段过程转化为一系列单阶段问题,利用各阶段之间的关系,逐个求解. 更具体的,假设我们可以计算出小问题的最优解,那么我们凭借此可 ...