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


Posted in Javascript onJune 29, 2010

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
Javascript 相关文章推荐
简明json介绍
Sep 28 Javascript
基于JavaScript 类的使用详解
May 07 Javascript
JS获取IP、MAC和主机名的五种方法
Nov 14 Javascript
两个select多选模式的选项相互移动(示例代码)
Jan 11 Javascript
a标签click和href执行顺序探讨
Jun 23 Javascript
js正则表达式验证表单【完整版】
Mar 06 Javascript
vue实现动态数据绑定
Apr 28 Javascript
使用angular帮你实现拖拽的示例
Jul 05 Javascript
jQuery.Sumoselect插件实现下拉复选框效果
Nov 09 jQuery
vue 虚拟dom的patch源码分析
Mar 01 Javascript
vue element-ui 绑定@keyup事件无效的解决方法
Mar 09 Javascript
JavaScript快速调试的两个技巧
Nov 04 Javascript
JavaScript 联动的无限级封装类,数据采用非Ajax方式,随意添加联动
Jun 29 #Javascript
Whatever:hover 无需javascript让IE支持丰富伪类
Jun 29 #Javascript
javascript hasFocus使用实例
Jun 29 #Javascript
jquery photoFrame 图片边框美化显示插件
Jun 28 #Javascript
使用jQuery.Validate进行客户端验证(初级篇) 不使用微软验证控件的理由
Jun 28 #Javascript
jquery获取ASP.NET服务器端控件dropdownlist和radiobuttonlist生成客户端HTML标签后的value和text值
Jun 28 #Javascript
Jquery ui css framework
Jun 28 #Javascript
You might like
全国FM电台频率大全 - 8 黑龙江省
2020/03/11 无线电
图解上海144收音机
2021/03/02 无线电
PHP stream_context_create()函数的使用示例
2015/05/12 PHP
限制复选框的最大可选数
2006/07/01 Javascript
js实现运行代码需要刷新的解决方法
2007/08/18 Javascript
js字符编码函数区别分析
2008/06/05 Javascript
Javascript 浮点运算精度问题分析与解决
2014/03/26 Javascript
jQuery如何获取同一个类标签的所有值(默认无法获取)
2014/09/25 Javascript
实例解析jQuery插件EasyUI最常用的表单验证规则
2015/11/29 Javascript
简述jQuery ajax的执行顺序
2016/01/05 Javascript
AngularJS 工作原理详解
2016/08/18 Javascript
JavaScript九九乘法口诀表的简单实现
2016/10/04 Javascript
js学习笔记之事件处理模型
2016/10/31 Javascript
使用 jQuery.ajax 上传带文件的表单遇到的问题
2016/10/31 Javascript
Jquery实时监听input value的实例
2017/01/26 Javascript
ajax请求data遇到的问题分析
2018/01/18 Javascript
React如何解决fetch跨域请求时session失效问题
2018/11/02 Javascript
[08:08]DOTA2-DPC中国联赛2月28日Recap集锦
2021/03/11 DOTA
python多线程threading.Lock锁用法实例
2014/11/01 Python
Python cookbook(数据结构与算法)将序列分解为单独变量的方法
2018/02/13 Python
Python实现时钟显示效果思路详解
2018/04/11 Python
Python使用 Beanstalkd 做异步任务处理的方法
2018/04/24 Python
python中的字符串内部换行方法
2018/07/19 Python
PyQt5 在label显示的图片中绘制矩形的方法
2019/06/17 Python
python实现翻转棋游戏(othello)
2019/07/29 Python
Python devel安装失败问题解决方案
2020/06/09 Python
Hoka One One法国官网:美国专业跑鞋品牌
2018/12/29 全球购物
如何现实servlet的单线程模式
2014/08/05 面试题
最新大学生自我评价
2013/09/24 职场文书
采购部部长岗位职责
2014/02/06 职场文书
测试工程师程序员求职信范文
2014/02/20 职场文书
材料物理专业求职信
2014/09/01 职场文书
2014年房产经纪人工作总结
2014/12/08 职场文书
2016年党校科级干部培训班学习心得体会
2016/01/06 职场文书
2016党员三严三实心得体会
2016/01/15 职场文书
Python anaconda安装库命令详解
2021/10/16 Python