JavaScript中匿名函数的多种写法

匿名函数没有实际名字,也没有指针,怎么执行滴? 

其实大家可以看看小括号的意义就应该可以理解。小括号有返回值,也就是小括号内的函数或者表达式的返回值,所以说小括号内的function返回值等于小括号的返回值,不难理解 (function(){})()可以将没有名字的函数执行了把…

关于匿名函数写法,很发散~

最常见的用法:

代码如下:

(function() {

alert(‘water‘);

})();

当然也可以带参数:

代码如下:

(function(o) {

alert(o);

})(‘water‘);

想用匿名函数的链式调用?很简单:

代码如下:

(function(o) {

alert(o);

return arguments.callee;

})(‘water‘)(‘down‘);

常见的匿名函数都知道了,看看不常见的:

代码如下:

~(function(){

alert(‘water‘);

})();//写法有点酷~

代码如下:

void function(){

alert(‘water‘);

}();//据说效率最高~

代码如下:

+function(){

alert(‘water‘);

}();

代码如下:

-function(){

alert(‘water‘);

}();

代码如下:

~function(){

alert(‘water‘);

}();

代码如下:

!function(){

alert(‘water‘);

}();

代码如下:

(function(){

alert(‘water‘);

}());//有点强制执行的味道~

那为什么加上这些符号呢?

弄清这个问题需要弄清函数表达式(function expression)和函数声明(function declaration)的区别:

函数表达式:

/* 函数表达式中的函数可以为匿名函数,也可以有函数名,但是该函数实际上不能直接使用,只能通过表达式左边的变量 a 来调用。*/

var a = function(){

alert(‘Function expression‘);

}

var b = new a();

函数声明:

// 函数声明时必须有函数名

function a(){

alert(‘Function declaration‘);

}

a();

而这段代码:

<script>

~function() {

alert("hello, world.");

} ();

</script>

实际上可以分为两个部分(黑体部分和斜体部分)。黑体部分的匿名函数通过一元操作符变成了函数表达式,因而可以通过 () 来调用。

因此,执行匿名函数可以通过+,-,!,() 这样的形式来转化为函数表达式,就可以通过()来运行了。

匿名函数的好处在于:可以减少局部变量,以免污染现有的运行环境。jQuery等库都用到了这样的原理。

另外:通过+,-,!这三个符号运行的匿名函数比()运行的匿名函数可以减少一个字符的使用。

所以那些匿名函数附近使用括号或一些一元运算符的惯用法,就是来引导解析器,指明运算符附近是一个表达式。

按照这个理解,可以举出五类,超过十几种的让匿名函数表达式立即调用的写法:

( function() {}() );
( function() {} )();
[ function() {}() ];

~ function() {}();
! function() {}();
+ function() {}();
- function() {}();

delete function() {}();
typeof function() {}();
void function() {}();
new function() {}();
new function() {};

var f = function() {}();

1, function() {}();
1 ^ function() {}();
1 > function() {}();
// ...

本文到此结束!

时间: 2024-10-12 11:02:14

JavaScript中匿名函数的多种写法的相关文章

JavaScript中匿名函数this指向问题

this对象是在运行时基于函数执行环境绑定的,在全局函数中,this=window,在函数被作为某个对象的方法调用时,this等于这个对象. 但是匿名函数的执行环境是全局性的,所以匿名函数的this指向是window var name = 'window' var person = { name :'Alan', sayName:function () { return function () { console.log(this.name) } } } person.sayName()() /

JS的三种使用方式/CSS的三种使用方式/JS中的DOM事件模型/JS中匿名函数的书写及调用/媒体查询@media的三种使用方式

一.JS的三种使用方式 1.html标签中内嵌JS(不提倡使用.)                <button onclick="javascript:alert('你真点啊.')" > 有本事点我呀!!!!</button>                                2.HTML页面中直接使用JS:                <script type="text/javascript">        

JavaScript中的函数表达式

在JavaScript中,函数是个非常重要的对象,函数通常有三种表现形式:函数声明,函数表达式和函数构造器创建的函数. 本文中主要看看函数表达式及其相关的知识点. 函数表达式 首先,看看函数表达式的表现形式,函数表达式(Function Expression, FE)有下面四个特点: 在代码中须出现在表达式的位置 有可选的函数名称 不会影响变量对象(VO) 在代码执行阶段创建 下面就通过一些例子来看看函数表达式的这四个特点. FE特点分析 例子一:在下面代码中,"add"是一个函数对象

Javascript中的函数(三)

一:概述 函数是进行模块化程序设计的基础,编写复杂的Ajax应用程序,必须对函数有更深入的了解.JavaScript中的函数不同于其他的语言,每个函数都是作为一个对象被维护和运行的.通过函数对象的性质,可以很方便的将一个函数赋值给一个变量或者将函数作为参数传递.在继续讲述之前,先看一下函数的使用语法:function func1(…){…}var func2=function(…){…};var func3=function func4(…){…};var func5=new Function(

JavaScript中的函数表达式及递归

在JavaScript中,函数是个非常重要的对象,函数通常有三种表现形式:函数声明,函数表达式和函数构造器创建的函数. 本文中主要看看函数表达式及其相关的知识点. 函数表达式 首先,看看函数表达式的表现形式,函数表达式(Function Expression, FE)有下面四个特点: 在代码中须出现在表达式的位置 有可选的函数名称 不会影响变量对象(VO) 在代码执行阶段创建 下面就通过一些例子来看看函数表达式的这四个特点. 特点分析 例子一:在下面代码中,"add"是一个函数对象,&

JavaScript中的函数的两种定义方式

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> /*I总结: 1.函数名可以做变量使用,可以赋值,可以传值 2.函数名当参数,传递给另一个函数 */ //==================js中函

JavaScript中的函数声明和函数表达式

JavaScript 中定义函数的方式有两种,一种是函数声明,另一种是函数表达式.这两种定义方式之间有一些细微的差别. 1.函数声明: function 关键字 + 函数名字 + 函数体构成了函数声明,具体形式如下: function functionName(arg0, arg1, arg2) {   // function body } Firefox. Safari. Chrome 和 Opera 都给函数定义了一个非标准的 name 属性,通过这个属性可以访问到给函数指定的名字: ale

【JavaScript】Javascript中的函数声明和函数表达式

Javascript有很多有趣的用法,在Google Code Search里能找到不少,举一个例子: <script> ~function() { alert("hello, world."); }(); </script> 试一下就知道这段代码的意思就是声明一个函数,然后立刻执行,因为Javascript中的变量作用域是基于函数的,所以这样可以避免变量污染,但这里的位运算符『~』乍一看让人摸不到头脑,如果去掉它再运行则会报错:SyntaxError. 在阐述

[JavaScript]JavaScript中的函数(1)

关于JavaScript中函数的学习: MDN 阮一峰老师的教程 关于函数的定义: 阮一峰老师:函数是一段可以反复调用的代码块.函数还能接受输入的参数,不同的参数会返回不同的值. MDN:Function 构造函数 创建一个新的Function对象. 在 JavaScript 中, 每个函数实际上都是一个Function对象. 函数的声明方式和name 函数的声明方式有目前来说有5种,每一个函数都有他的一个name属性(包括匿名函数),要注意. 具名函数 function fn(x,y) { c