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 相关文章推荐
javascript 面向对象全新理练之数据的封装
Dec 03 Javascript
JSON.parse 解析字符串出错的解决方法
Jul 08 Javascript
jquery提升性能最佳实践小结
Dec 06 Javascript
JavaScript获取表单enctype属性的方法
Apr 02 Javascript
JavaScript的Polymer框架中dom-repeat与VM的相关操作
Jul 29 Javascript
jQuery实现带渐显效果的人物多级关系图代码
Oct 16 Javascript
原生JavaScript实现Tooltip浮动提示框特效
Mar 07 Javascript
React Native使用百度Echarts显示图表的示例代码
Nov 07 Javascript
在微信小程序中渲染HTML内容的方法示例
Sep 28 Javascript
代码分析vue中如何配置less
Sep 28 Javascript
详解webpack4.x之搭建前端开发环境
Mar 28 Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
Jul 07 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.NET的入门教程
2006/10/09 PHP
php正则表达匹配中文问题分析小结
2012/03/25 PHP
php验证码实现代码(3种)
2015/09/07 PHP
tp5框架基于ajax实现异步删除图片的方法示例
2020/02/10 PHP
JavaScript iframe的相互操作浅析
2009/10/14 Javascript
js history对象简单实现返回和前进
2013/10/30 Javascript
JavaScript检测浏览器cookie是否已经启动的方法
2015/02/27 Javascript
基于JS实现的倒计时程序实例
2015/07/24 Javascript
jQuery实现标签页效果实战(4)
2017/02/08 Javascript
jQuery插件FusionCharts实现的3D帕累托图效果示例【附demo源码】
2017/03/25 jQuery
Vue实现选择城市功能
2017/05/27 Javascript
通过命令行生成vue项目框架的方法
2017/07/12 Javascript
AngularJS中table表格基本操作示例
2017/10/10 Javascript
javascript动态创建对象的属性详解
2018/11/07 Javascript
利用Vue的v-for和v-bind实现列表颜色切换
2020/07/17 Javascript
vue tab切换,解决echartst图表宽度只有100px的问题
2020/07/19 Javascript
OpenLayers实现图层切换控件
2020/09/25 Javascript
javascript实现电商放大镜效果
2020/11/23 Javascript
python进阶教程之动态类型详解
2014/08/30 Python
windows10下python3.5 pip3安装图文教程
2018/04/02 Python
Python走楼梯问题解决方法示例
2018/07/25 Python
Python使用jsonpath-rw模块处理Json对象操作示例
2018/07/31 Python
Django uwsgi Nginx 的生产环境部署详解
2019/02/02 Python
python实现对列表中的元素进行倒序打印
2019/11/23 Python
CSS3 Media Queries详细介绍和使用实例
2014/05/08 HTML / CSS
Canvas制作的下雨动画的示例
2018/03/06 HTML / CSS
奥斯汀独木舟和皮划艇:Austin Canoe & Kayak
2018/05/22 全球购物
精选鞋类、服装和配饰的全球领先目的地:Bodega
2021/02/27 全球购物
J2EE面试题
2016/03/14 面试题
工作建议书范文
2014/05/13 职场文书
主题党日活动总结
2014/07/08 职场文书
高中社区服务活动报告
2015/02/05 职场文书
外出考察学习心得体会
2016/01/18 职场文书
2016五四青年节活动总结范文
2016/04/06 职场文书
详解Django中 render() 函数的使用方法
2021/04/22 Python
Python实现简单的俄罗斯方块游戏
2021/09/25 Python