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 相关文章推荐
新浪刚打开页面出来的全屏广告代码
Apr 02 Javascript
40个新鲜出炉的jQuery 插件和免费教程[上]
Jul 24 Javascript
js实现在页面上弹出蒙板技巧简单实用
Apr 16 Javascript
jquery中选择块并改变属性值的方法
Jul 31 Javascript
Javascript浅谈之this
Dec 17 Javascript
js判断字符是否是汉字的两种方法小结
Jan 03 Javascript
IE6中链接A的href为javascript协议时不在当前页面跳转
Jun 05 Javascript
jQuery中noConflict()用法实例分析
Feb 08 Javascript
vue自定义过滤器创建和使用方法详解
Nov 06 Javascript
使用webpack搭建vue环境的教程详解
Dec 31 Javascript
Vue项目接入Paypal实现示例详解
Jun 04 Javascript
全网小程序接口请求封装实例代码
Nov 06 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 验证码(倾斜,正弦干扰线,黏贴,旋转)
2013/06/29 PHP
CI(CodeIgniter)框架中的增删改查操作
2014/06/10 PHP
laravel 自定义常量的两种方案
2019/10/14 PHP
使用dynatrace-ajax跟踪JavaScript的性能
2010/04/12 Javascript
EasyUI的treegrid组件动态加载数据问题的解决办法
2011/12/11 Javascript
批量实现面向对象的实例代码
2013/07/01 Javascript
JS防止用户多次提交的简单代码
2013/08/01 Javascript
jquery如何判断某元素是否具备指定的样式
2013/11/05 Javascript
JS动态显示表格上下frame的方法
2015/03/31 Javascript
JavaScript中Number.NEGATIVE_INFINITY值的使用详解
2015/06/05 Javascript
JavaScript中rem布局在react中的应用
2015/12/09 Javascript
简单谈谈json跨域
2016/03/13 Javascript
Bootstrap 模态框实例插件案例分析
2016/12/28 Javascript
Html5 js实现手风琴效果
2020/04/17 Javascript
使用jQuery卸载全部事件的思路详解
2017/04/03 jQuery
使用 Vue.js 仿百度搜索框的实例代码
2017/05/09 Javascript
JS中Safari浏览器中的Date
2017/07/17 Javascript
vuejs 单文件组件.vue 文件的使用
2017/07/28 Javascript
微信小程序websocket实现聊天功能
2020/03/30 Javascript
vue中组件的过渡动画及实现代码
2018/11/21 Javascript
Vue中使用canvas方法总结
2019/02/12 Javascript
通过js实现压缩图片上传功能
2020/02/25 Javascript
Python深入学习之特殊方法与多范式
2014/08/31 Python
解决pycharm界面不能显示中文的问题
2018/05/23 Python
opencv导入头文件时报错#include的解决方法
2019/07/31 Python
python中的RSA加密与解密实例解析
2019/11/18 Python
python用TensorFlow做图像识别的实现
2020/04/21 Python
简单介绍CSS3中Media Query的使用
2015/07/07 HTML / CSS
Cotton On香港网站:澳洲时装连锁品牌
2018/11/01 全球购物
英国网上电器商店:Electricshop
2020/03/15 全球购物
家长对老师的感言
2014/03/11 职场文书
小学班主任评语大全
2014/04/23 职场文书
考察现实表现材料
2014/05/19 职场文书
使用vue判断当前环境是安卓还是IOS
2022/04/12 Vue.js
MySQL数据库表约束讲解
2022/06/21 MySQL
kubernetes集群搭建Zabbix监控平台的详细过程
2022/07/07 Servers