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

所属分类: 网络编程 / JavaScript 阅读数: 708
收藏 0 赞 0 分享
先看一段简单的代码:
复制代码 代码如下:

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 this关键字指向常用情况解析

这篇文章主要介绍了JavaScript this关键字指向常用情况解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

Vue-cli打包后如何本地查看的操作

这篇文章主要介绍了Vue-cli打包后如何本地查看的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue cli 3.0通用打包配置代码,不分一二级目录

这篇文章主要介绍了vue cli 3.0通用打包配置代码,不分一二级目录,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JavaScript事件循环及宏任务微任务原理解析

这篇文章主要介绍了JavaScript事件循环及宏任务微任务原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

关于vue-cli3打包代码后白屏的解决方案

这篇文章主要介绍了关于vue-cli3打包代码后白屏的解决方案,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue打包静态资源后显示空白及static文件路径报错的解决

这篇文章主要介绍了vue打包静态资源后显示空白及static文件路径报错的解决,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue-cli3访问public文件夹静态资源报错的解决方式

这篇文章主要介绍了vue-cli3访问public文件夹静态资源报错的解决方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JS继承实现方法及优缺点详解

这篇文章主要介绍了JS继承实现方法及优缺点详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

vue或react项目生产环境去掉console.log的操作

这篇文章主要介绍了vue或react项目生产环境去掉console.log的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题

这篇文章主要介绍了解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享
查看更多