js当一个变量为函数时 应该注意的一点细节小结


Posted in Javascript onDecember 29, 2011

先看一段简单的代码:

var testFun=function (name,age){ 
var job='Flash Develop'; 
return new testFun.init(name,age,job); 
} 
testFun.init=function(name,age,job){ 
return 'name:'+name+',age:'+age+',job:'+job+''; 
} 
alert(testFun('vincent',30)); //[object Object]

代码很简单,变量testFun为一个匿名函数,匿名函数返回的一个testFun.init对象(也是一个匿名函数)。但对于一些新手有时会误解为:testFun是返回的一个testFun.init对象。他可能会这样想,在匿名函数function(name,age)构建过程中,又用到了testFun. 此时testFun还在构建中,应该还没有存在,testFun.init更没有存在,怎么就可以用testFun.init呢?

其实这样想是存在了一个误区:把testFun与testFun()等同起来了,如果testFun是返回的一个testFun.init对象,代码应该是testFun=function(name,age){… …}()。正确的理解应该是这样的,testFun只是一个函数,当你把一个函数赋于它时,它就已经存在了,哪怕函数返回的是undefined或null,它本身仍然是Function,只有testFun()执行后返回值才是undefined或null。返回值是testFun()执行的结果,结果返回后,就不再与testFun有任何关系。如:

var testFun=function(){ 
return undefined; 
} 
var result=testFun(); 
alert(testFun); // function () {return undefined;} 
alert(result); // undefined result与testFun不再有任何关系

所以,当赋于testFun一个匿名函数后,它就一直存在着,直到赋于它另外一个值。对于testFun.init你可以这样简单的去理解:
testFun.init=function(name,age){}.init=function(name,age.job){… …}
综上所述,回头再看testFun是一个函数,而testFun()则是(function(name,age,job){return 'name:'+name+',age:'+age+',job:'+job+''; })()
为了便于理解,可以把代码精简为:
var testFun=function(){} 
testFun.init=function(){}

只是testFun()没有返回一个testFun.init对象罢了。
Javascript 相关文章推荐
jquery 弹出层实现代码
Oct 30 Javascript
js event事件的传递与冒泡处理
Dec 06 Javascript
如何解决Jquery库及其他库之间的$命名冲突
Sep 15 Javascript
理解javascript中的严格模式
Feb 01 Javascript
jQuery简单入门示例之用户校验demo示例
Jul 09 Javascript
bootstrap多种样式进度条展示
Dec 20 Javascript
浅谈JavaScript中的属性:如何遍历属性
Sep 14 Javascript
简述vue中的config配置
Jan 23 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
Jul 06 Javascript
在Vue项目中使用jsencrypt.js对数据进行加密传输的方法
Apr 17 Javascript
JS匿名函数内部this指向问题详析
May 10 Javascript
vue缓存之keep-alive的理解和应用详解
Nov 02 Javascript
为JavaScript类型增加方法的实现代码(增加功能)
Dec 29 #Javascript
javaScript 利用闭包模拟对象的私有属性
Dec 29 #Javascript
Jquery中删除元素的实现代码
Dec 29 #Javascript
js的表单操作 简单计算器
Dec 29 #Javascript
javascript写的简单的计算器,内容很多,方法实用,推荐
Dec 29 #Javascript
JavaScript中两个感叹号的作用说明
Dec 28 #Javascript
javascript (用setTimeout而非setInterval)
Dec 28 #Javascript
You might like
常用的php对象类型判断
2008/08/27 PHP
PHP关联链接常用代码
2012/11/05 PHP
PHP连接Access数据库的方法小结
2013/06/20 PHP
php使用crypt()函数进行加密
2017/06/08 PHP
jQuery实现form表单reset按钮重置清空表单功能
2012/12/18 Javascript
jQuery JSON实现无刷新三级联动实例探讨
2013/05/28 Javascript
javascript禁用键盘功能键让右击及其他键无效
2013/10/09 Javascript
对 jQuery 中 data 方法的误解分析
2014/06/18 Javascript
JavaScript设计模式之抽象工厂模式介绍
2014/12/28 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
2015/04/12 Javascript
Jquery中request和request.form和request.querystring的区别
2015/11/26 Javascript
jQuery代码实现对话框右上角菜单带关闭×
2016/05/03 Javascript
JavaScript用构造函数如何获取变量的类型名
2016/12/23 Javascript
jQuery+PHP+Mysql实现抽奖程序
2020/04/12 jQuery
Vue from-validate 表单验证的示例代码
2017/09/26 Javascript
vue移动端下拉刷新和上拉加载的实现代码
2018/09/08 Javascript
vscode下vue项目中eslint的使用方法
2019/01/13 Javascript
JavaScript数组去重的几种方法
2019/04/07 Javascript
微信小程序实现拼图小游戏
2020/10/22 Javascript
ant design vue导航菜单与路由配置操作
2020/10/28 Javascript
如何在vue中使用video.js播放m3u8格式的视频
2021/02/01 Vue.js
Python实现的简单万年历例子分享
2014/04/25 Python
Python的“二维”字典 (two-dimension dictionary)定义与实现方法
2016/04/27 Python
对Python3中dict.keys()转换成list类型的方法详解
2019/02/03 Python
opencv之颜色过滤只留下图片中的红色区域操作
2020/06/05 Python
用Python进行websocket接口测试
2020/10/16 Python
Coltorti Boutique官网:来自意大利的设计师品牌买手店
2018/11/09 全球购物
2013年员工自我评价范文
2013/12/27 职场文书
运动会开幕式邀请函
2014/01/22 职场文书
个人优缺点自我评价
2014/01/27 职场文书
电焊工岗位职责
2014/03/06 职场文书
求职简历自我评价范例
2014/03/12 职场文书
十佳护士先进事迹
2014/05/08 职场文书
竞聘书的秘诀
2019/04/02 职场文书
Python实现拼音转换
2021/06/07 Python
JavaScript架构localStorage特殊场景下二次封装操作
2022/06/21 Javascript