Javascript中匿名函数用法详解

一、什么是匿名函数?

在Javascript定义一个函数一般有如下三种方式:

 代码如下 复制代码

1.函数关键字(function)语句:
function fnMethodName(x){alert(x);}
2.函数字面量(Function Literals):
var fnMethodName = function(x){alert(x);}
3.Function()构造函数:
var fnMethodName = new Function('x','alert(x);')

上面三种方法定义了同一个方法函数fnMethodName,第1种就是最常用的方法,后两种都是把一个函数复制给变量fnMethodName,而这个函数是没有名字的,即匿名函数。实际上,相当多的语言都有匿名函数。

匿名函数的创建

第一种方式:就是上面所讲的定义square函数,这也是最常用的方式之一。

第二种方式:

 代码如下 复制代码
(function(x, y){
    alert(x + y); 
})(2, 3);

这里创建了一个匿名函数(在第一个括号内),第二个括号用于调用该匿名函数,并传入参数。

 

二、函数字面量和Function()构造函数的区别
1.虽然函数字面量是一个匿名函数,但语法允许为其指定任意一个函数名,当写递归函数时可以调用它自己,使用Function()构造函数则不行。

 代码如下 复制代码
var f = function fact(x) {
  if (x < = 1) return 1;
  else return x*fact(x-1);
};

2.Function()构造函数允许运行时Javascript代码动态的创建和编译。在这个方式上它类似全局函数eval()。
3.Function()构造函数每次执行时都解析函数主体,并创建一个新的函数对象。所以当在一个循环或者频繁执行的函数中调用Function()构造函数的效率是非常低的。相反,函数字面量却不是每次遇到都重新编译的。
4.用Function()构造函数创建一个函数时并不遵循典型的作用域,它一直把它当作是顶级函数来执行。

 代码如下 复制代码
var y = "global";
function constructFunction() {
    var y = "local";
    return new Function("return y");  //  无法获取局部变量
}
alert(constructFunction()());  // 输出 "global"

和函数关键字定义相比Function()构造器有自己的特点且要难以使用的多,所以这项技术通常很少使用。而函数字面量表达式和函数关键字定义非常接近。考虑前面的区别,虽然有消息说字面量的匿名函数在OS X 10.4.3下的某些webkit的引擎下有bug,但我们平常所说的匿名函数均指采用函数字面量形式的匿名函数

举例
匿名函数最大的用途是创建闭包(这是JavaScript语言的特性之一),并且还可以构建命名空间,以减少全局变量的使用。

示例三:

 代码如下 复制代码

var oEvent = {};
(function(){
    var addEvent = function(){ /*代码的实现省略了*/ };
    function removeEvent(){}

    oEvent.addEvent = addEvent;
    oEvent.removeEvent = removeEvent;
})();

在这段代码中函数addEvent和removeEvent都是局部变量,但我们可以通过全局变量oEvent使用它,这就大大减少了全局变量的使用,增强了网页的安全性。我们要想使用此段代码:oEvent.addEvent(document.getElementById('box') ,

 代码如下 复制代码
'click' , function(){});

示例四:

 代码如下 复制代码
var rainman = (function(x , y){
    return x + y;
})(2 , 3);
/**
 * 也可以写成下面的形式,因为第一个括号只是帮助我们阅读,但是不推荐使用下面这种书写格式。
 * var rainman = function(x , y){
 *    return x + y;
 * }(2 , 3);
 */

在这里我们创建了一个变量rainman,并通过直接调用匿名函数初始化为5,这种小技巧有时十分实用。

示例五:

 代码如下 复制代码

var outer = null;

(function(){
    var one = 1;
    function inner (){
        one += 1;
        alert(one);
    }
    outer = inner;
})();

outer();    //2
outer();    //3
outer();    //4

这段代码中的变量one是一个局部变量(因为它被定义在一个函数之内),因此外部是不可以访问的。但是这里我们创建了inner函数,inner函数是可以访问变量one的;又将全局变量outer引用了inner,所以三次调用outer会弹出递增的结果。

时间: 2024-09-20 05:18:17

Javascript中匿名函数用法详解的相关文章

JavaScript中eval()函数用法详解_javascript技巧

eval() 函数计算 JavaScript 字符串,并把它作为脚本代码来执行. 如果参数是一个表达式,eval() 函数将执行表达式.如果参数是Javascript语句,eval()将执行 Javascript 语句. 语法 复制代码 代码如下: eval(string) 参数 描述 string 必需.要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句. eval()函数用法详解: 此函数可能使用的频率并不是太高,但是在某些情况下具有很大的作用,下面就介绍一下eva

javascript中匿名函数分析详解

在Javascript定义一个函数一般有如下三种方式: 函数关键字(function)语句:    代码如下 复制代码 function fnMethodName(x){alert(x);} 函数字面量(Function Literals):  代码如下 复制代码 var fnMethodName = function(x){alert(x);} Function()构造函数:  代码如下 复制代码 var fnMethodName = new Function('x','alert(x);')

JavaScript中eval() 函数用法详解

定义和用法 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 语法 eval(string) 参数 描述 string 必需.要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句. 返回值 通过计算 string 得到的值(如果有的话). 说明 该方法只接受原始字符串作为参数,如果 string 参数不是原始字符串,那么该方法将不作任何改变地返回.因此请不要为 eval() 函数传递 String 对象来作为参数. 如果试图覆盖 eval

JavaScript中的函数模式详解

 这篇文章主要介绍了JavaScript中的函数模式详解,本文讲解了创建函数的语法.函数表达式.命名函数表达式.函数的声明.函数声明与表达式.函数的提升.即时函数模式等内容,需要的朋友可以参考下     JavaScript设计模式的作用是提高代码的重用性,可读性,使代码更容易的维护和扩展 在javascript中,函数是一类对象,这表示他可以作为参数传递给其他函数:此外,函数还可以提供作用域. 创建函数的语法 命名函数表达式 代码如下: //命名函数表达式 var add = function

JavaScript中匿名函数用法实例

 这篇文章主要介绍了JavaScript中匿名函数用法,实例分析了javascript中匿名函数的功能.定义及具体用法,需要的朋友可以参考下     本文实例讲述了JavaScript中匿名函数用法.分享给大家供大家参考.具体分析如下: JS中可以不用给函数名称,而是在使用时直接通过function把函数体赋值给相关的事件或者变量. 下面的JS代码给按钮设定了一个onclick事件,使用了匿名函数 ? 1 2 3 4 5 6 7 8 9 <form action="#">

ASP中FormatDateTime函数用法详解

FormatDateTime 函数 返回表达式,此表达式已被格式化为日期或时间. FormatDateTime(Date[, NamedFormat]) 参数 参数 描述 date Required. Any valid date expression (like Date() or Now()) 必选项.要被格式化的日期表达式.(如Date()或Now()) format Optional. A Format value that specifies the date/time format

SQLServer中merge函数用法详解_MsSql

Merge关键字是一个神奇的DML关键字.它在SQL Server 2008被引入,它能将Insert,Update,Delete简单的并为一句.MSDN对于Merge的解释非常的短小精悍:"根据与源表联接的结果,对目标表执行插入.更新或删除操作. MERGE 目标表 USING 源表 ON 匹配条件 WHEN MATCHED THEN 语句 WHEN NOT MATCHED THEN 语句; 其中最后语句分号不可以省略,且源表既可以是一个表也可以是一个子查询语句 WHEN NOT MATCHE

javascript中clipboardData对象用法详解_javascript技巧

本文实例讲述了javascript中clipboardData对象用法.分享给大家供大家参考.具体分析如下: clipboardData对象  ,注意网页里剪贴板到现在只能设置Text类型,即只能复制文本 clearData("Text")清空粘贴板 getData("Text")读取粘贴板的值 setData("Text",val)设置粘贴板的值 当复制的时候body的oncopy事件被触发,直接return false就是禁止复制,注意是不能

JavaScript中的函数模式详解_javascript技巧

JavaScript设计模式的作用是提高代码的重用性,可读性,使代码更容易的维护和扩展 在javascript中,函数是一类对象,这表示他可以作为参数传递给其他函数:此外,函数还可以提供作用域. 创建函数的语法 命名函数表达式 复制代码 代码如下: //命名函数表达式 var add = function add(a,b){     return a+b; }; 函数表达式 复制代码 代码如下: //又名匿名函数 var add = function(a,b){     return a+b;