通过javascript的匿名函数来分析几段简单有趣的代码

1、简单形式的封装调用


代码如下:

var userName = function() { return "jeff wong" } ();
alert(userName);

上面的代码确实简单,我们可以逐步分解成下面的写法:


代码如下:

var anonymousFunc = function() { return "jeff wong" }; //匿名函数
var name = anonymousFunc(); //执行该函数 返回人名
alert(name);

2、new 一下Function的形式(大写Function)


代码如下:

var a = new Object();
var b = new Function();
//alert(typeof (a)); //object
//alert(typeof (b)); //function
alert(a); //[object Object]
alert(b); //匿名函数
//alert(a == b); //false
//alert(a === b); //false

正如你所看到的那样,我们new一个Object,变量a弹出的是[object Object],而new一个Function(注意,是大写Function),b在弹出的时候,生成了匿名函数。 既然b是匿名函数,函数当然可以执行,我们可以继续试试下面的代码验证自己的猜测:


代码如下:

alert(b()); //undefined
alert(a()); //脚本错误 提示“缺少函数”

3、new 一下function也大有乾坤(小写function)
(1)、简单的空函数


代码如下:

var func = new function() { };
alert(typeof (func)); //object
alert(func); //[object Object]
//alert(func()); //脚本错误 func不是函数

其实上面的代码也就等价于下面的写法:


代码如下:

function anonymousClass() { } //匿名类
var instance = new anonymousClass();
alert(typeof (instance));//object
alert(instance); //[object Object]

[code]

(2)、函数带个返回值的,也不是很难理解
[code]
var func = new function() { return "jeff wong" };
alert(typeof (func));
alert(func);
//alert(func()); //脚本错误 缺少函数

其实上面的代码也就等价于下面的写法:


代码如下:

function anonymousClass() { return "jeff wong"; } //匿名类
var instance = new anonymousClass();
alert(typeof (instance));//object
alert(instance); //[object Object]

(3)、还是函数带个返回值的,写法稍微有点不同

下面的代码请注意和(2)中的区分一下,因为接下来要重点讨论的就是那一点点的不同书写形式:


代码如下:

var func = new function() { return new String("jeff wong"); };
alert(typeof (func)); //object 意料之中
alert(func); //这里?!
//alert(func()); //脚本错误 缺少函数

上面代码的等价形式依然简单:


代码如下:

function anonymousClass() { return new String("jeff wong"); }
var instance = new anonymousClass();
alert(typeof (instance));
alert(instance);

已经运行看到结果了吗?没错,第三种写法我们在弹出func或者instance的时候,都出人意料地得到了一段字符串"jeff wong"。细心比较(2)和(3)中的代码,除了return处的写法稍有不同之外,两处代码几乎完全一致,所以我们推断,毫无疑问,是new String的形式让我们的函数产生了意想不到的效果。 为什么会这样呢?

原来,在javascript中,只要在new表达式之后的constructor返回(return)一个原始类型(无return时其实是return原始类型undefined,如(1)),比如第(2)种写法,那么就返回new创建的匿名对象;而如果new表达式之后的constructor返回一个引用对象,比如对象(Object),函数(function)及数组(Array)等等,那么返回的该引用对象就将覆盖new创建的匿名对象。现在再来分析(3)中的写法,由于new String会构造一个字符串引用对象,它就覆盖了new所创建的匿名对象,而new String的所指向引用值是“jeff wong”,所以弹出的必然是当前new String所分配的值。

  最后,留个思考题,大家看看下面的代码返回什么结果:

代码如下:

var func = new function() { var str = new String("jeff wong"); return str; };//再换种写法
//alert(typeof (func)); //object 意料之中
alert(func); //猜一下这里应该是什么结果?

作者:Jeff Wong

(0)

相关推荐

  • Javascript的匿名函数讲解

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

  • 一个关于javascript匿名函数的问题分析

    匿名函数,就是没有名字的函数.如: 复制代码 代码如下: function (){ alert('a function'); } 但是,上面的代码会报错.firebug提示:function statement requires a name,也就是:函数必须要有个名字. 奇怪的是,如果我用一对()把这个没有名字的函数包起来,就不会报错了.如: 复制代码 代码如下: (function (){ alert('a function'); }) (注意包裹函数的()!).虽然这样不会报错,但谁能知道

  • (转载)JavaScript中匿名函数,函数直接量和闭包

    原文出处: http://www.dnew.cn/post/196.htm 先看下下面几种写法 1.function f(x){return x*x;};f(x); 2.(function(x){return x*x;})(x); 3.(function(x){return x*x;}(x)); 第一种我们应该都很熟悉了,这是我们经常使用的写法.第二第三种都是匿名函数的写法. ------------------------------------------------------------

  • Javascript的匿名函数小结

    一.什么是匿名函数? 在Javascript定义一个函数一般有如下三种方式: 函数关键字(function)语句: function fnMethodName(x){alert(x);} 函数字面量(Function Literals): var fnMethodName = function(x){alert(x);} Function()构造函数: var fnMethodName = new Function('x','alert(x);') 上面三种方法定义了同一个方法函数fnMetho

  • JavaScript 匿名函数(anonymous function)与闭包(closure)

    引入 匿名函数 闭包 变量作用域 函数外部访问函数内部的局部变量 用闭包实现私有成员 引入 闭包是用匿名函数来实现.闭包就是一个受到保护的变量空间,由内嵌函数生成."保护变量"的思想在几乎所有的编程语言中都能看到. 先看下 JavaScript 作用域: JavaScript 具有函数级的作用域.这意味着,不能在函数外部访问定义在函数内部的变量. JavaScript 的作用域又是词法性质的(lexically scoped).这意味着,函数运行在定义它的作用域中,而不是在调用它的作用

  • 详谈JavaScript 匿名函数及闭包

    1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种:这也是最常规的一种 复制代码 代码如下: function double(x){     return 2 * x;   } 第二种:这种方法使用了Function构造函数,把参数列表和函数体都作为字符串,很不方便,不建议使用. 复制代码 代码如下: var double = new Functio

  • Javascript中的回调函数和匿名函数的回调示例介绍

    复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> /* * 匿名函数自调的意义: 1.营造了一个封闭的空间 2.防止变量冲突 3.有选择性的对外开发(第三方框架都是对js这样封装

  • javascript 匿名函数的理解(透彻版)

    复制代码 代码如下: (function(){ //这里忽略jQuery所有实现 })(); (function(){ //这里忽略jQuery所有实现 })(); 半年前初次接触jQuery的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的第一眼,我就迷糊了.为什么只有一个匿 名函数又没看到运行(当然是运行了--),就能有jQuery这么个函数库了?于是,我抱着疑问来到CSDN.结果相信现在很多人都很清楚了(因为在我之 后也不乏来者,呵呵~).当一个匿名函数被括起来,然后

  • Javascript匿名函数的一种应用 代码封装

    在一些Javascript库中可以看见这种写法: 复制代码 代码如下: (function(){ //所有库代码代码 })(); 说实话,对于js初学者的我来说.这个东西太吓人了,在这些JS库中,这个函数基本上把整个库的所有代码全括起来了,这种写法完全超越了我的常识.难道不应该好好的划分一下吗,难道不应该体现出层次和功能划分吗,怎么会一个函数搞定呢.我一开始完全不敢去细想它的道理.直到使用JS一段时间后,某一天一位同事在闲聊时说起了这个问题,我才知道这个叫匿名函数.匿名函数我并不陌生,C#,Py

  • JavaScript函数的一些注意要点小结及js匿名函数

    下面给大家介绍javascript函数 函数的基本语法是: function functionName(arg0,arg1,...,argN) { statements } 下面是个示例: function str(name,age){ document.write("hello my name is " + name + ". and i am " + age + " years old."); } str(" oliver"

  • JavaScript 编写匿名函数的几种方法

    错误模式:语法错误警告 复制代码 代码如下: function(){ // insert code here }(); 模式一:函数字面量 (Function Literal) 先声明函数对象,然后执行. 复制代码 代码如下: (function(){ // insert code here })(); 模式二:优先表达式 (Prior Expression) 由于 JavaScript 按照从内到外的顺序执行表达式,因此使用括号来强制执行已声明的函数. 复制代码 代码如下: (function

  • Javascript 匿名函数及其代码模式原理

    关于什么是匿名函数,及它带来的优势在本文就不深究了,先抛出一个常用的匿名函数: (function(){alert('yo')})() 很多同学知道怎么用这种匿名函数,却或许并不明白为什么这样写就能够调用匿名函数.也许知道后面的圆括号是执行前面的函数,而并不清楚前面的圆括号具有何种含义!本文将带你了解匿名函数的代码模式原理. OK,先来看看更多匿名函数调用模式: 复制代码 代码如下: (function(){alert(1);}()) (function(){alert(2);})() void

随机推荐