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 技巧小结
Apr 02 Javascript
jquery ready()的几种实现方法小结
Jun 18 Javascript
js/jQuery简单实现选项卡功能
Jan 02 Javascript
js实现点击获取验证码倒计时效果
Jan 28 Javascript
解决angular的post请求后SpringMVC后台接收不到参数值问题的方法
Dec 10 Javascript
jQuery实现图片加载完成后改变图片大小的方法
Mar 29 Javascript
EasyUI中在表单提交之前进行验证
Jul 19 Javascript
原生js实现回复评论功能
Jan 18 Javascript
JS实现的简单四则运算计算器功能示例
Sep 27 Javascript
node.js中axios使用心得总结
Nov 29 Javascript
JavaScript实现计算圆周率到小数点后100位的方法示例
May 08 Javascript
vue使用Google Recaptcha验证的实现示例
Aug 23 Vue.js
为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面向对象全攻略 (九)访问类型
2009/09/30 PHP
PHP把网页保存为word文件的三种方法
2014/04/01 PHP
swoole和websocket简单聊天室开发
2017/11/18 PHP
javascript下给元素添加事件的方法与代码
2007/08/13 Javascript
关于B/S判断浏览器断开的问题讨论
2008/10/29 Javascript
javascript让setInteval里的函数参数中的this指向特定的对象
2010/01/31 Javascript
jQuery之$(document).ready()使用介绍
2012/04/05 Javascript
js实现右下角可关闭最小化div(可用于展示推荐内容)
2013/06/24 Javascript
JavaScript获取多个数组的交集简单实例
2013/11/11 Javascript
JavaScript中Date.toSource()方法的使用教程
2015/06/12 Javascript
JS截取字符串实例详解
2015/11/24 Javascript
JavaScript中的继承之类继承
2016/05/01 Javascript
js+html5实现canvas绘制网页时钟的方法
2016/05/21 Javascript
jQuery自定义数值抽奖活动代码
2016/06/11 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
JS原型与原型链的深入理解
2017/02/15 Javascript
vue.js删除列表中的一行
2018/06/30 Javascript
详解JavaScript 中 if / if...else...替换方式
2018/07/15 Javascript
使用post方法实现json往返传输数据的方法
2019/03/30 Javascript
js定义类的方法示例【ES5与ES6】
2019/07/30 Javascript
vue 实现模糊检索并根据其他字符的首字母顺序排列
2019/09/19 Javascript
浅谈Vue 函数式组件的使用技巧
2020/06/16 Javascript
vue实现数字滚动效果
2020/06/29 Javascript
pandas 层次化索引的实现方法
2019/07/06 Python
使用python爬取抖音视频列表信息
2019/07/15 Python
基于Django框架的权限组件rbac实例讲解
2019/08/31 Python
numpy.array 操作使用简单总结
2019/11/08 Python
python利用dlib获取人脸的68个landmark
2019/11/27 Python
Django框架之中间件MiddleWare的实现
2019/12/30 Python
如何在pycharm中安装第三方包
2020/10/27 Python
Pycharm创建文件时自动生成文件头注释(自定义设置作者日期)
2020/11/24 Python
CSS3属性选择符介绍
2008/10/17 HTML / CSS
销售顾问岗位职责
2014/02/25 职场文书
12.4法制宣传日标语
2014/10/08 职场文书
2019年怎样写好导游词?
2019/07/02 职场文书
Python基础详解之描述符
2021/04/28 Python