嗯,关于JS函数内部变量的赋值和调用以及this的用法

来源:互联网 发布:网络黑界知名林子颜 编辑:程序博客网 时间:2024/05/16 19:04

先来看看这么一个函数

<script type="text/javascript">var name="The Window";function getNameFunc(){ var name="My Object"alert(this.name); alert(name); }getNameFunc();</script>

这个函数执行后弹出俩窗口的值分别是:

"The Window"

"My Object"

可见this在这里的意思是拾取全局变量name,若没有了this的修饰,就是取函数内部的变量name了(它们的作用域不同,所以应该看为两个独立的变量)


另外,只要你在函数里调用了某个变量,它总是会第一时间查看函数里有木有这个函数?如果有就优先使用这个函数。不信看下面这个:

<script type="text/javascript">var name="The Window";var name2="这个也是全局函数哦"var hh="hahaha";function getNameFunc(){ var name="My Object" var hh="hello" hh=this.name;alert(this.name2);alert(name); alert(hh); alert(name2);}getNameFunc();alert(name);</script>



要注意这里一共有5个alert,其中4个是在函数getNameFunc()内部,1个是在函数外部;

其执行结果alert出的值分别如下:

"这个也是全局函数哦"

"My Object"

"The Window"

"这个也是全局函数哦"

"The Window"

第一个alert由于用this修饰了,故绕过函数内部变量取全局变量的name2;

第二个alert没有this,故调用的函数内部变量name;

第三个alert同样没有this修饰,也是调用函数内部变量hh,不过在函数内部有 hh=this.name 语句,即hh的值已被赋值为全局变量name的值,故这里alert出的也是全局变量name的值"The Window";

第四个alert虽然没有用this修饰,但是函数内部压根就木有存在过一个叫name2的变量,于是系统就再从函数外部找,哦,找到一个全局变量name2,就用它咯~

至于最后一个alert是在函数getNameFunc()外部执行的,那么跟这个函数木关系了,函数内部变量的作用域对函数外部是没有任何影响力的,故这里调用的是全局变量name的值。

由此可见,在一个js函数内部调用某个变量(没有用this修饰)的时候,会先判断函数内部是否有这个变量,有的话就用,没有的话就再看这个函数外面有没有另一个更外层的函数包着它(多个函数内嵌就是了),如果有就从包着它的父级函数里面找,如果父级函数、爷爷级函数。。。。祖宗级函数里面都找不到有这种名字的局部变量,那就看有没有全局变量的名称是这个,有的话就用(还是木有呢?那就返回undefined咯)


另外再说说一个容易被忽略了的事情,来看看这个函数执行了返回啥:

<script type="text/javascript">var name="The Window";function getNameFunc(){name="My Object"}getNameFunc();alert(name);</script>


很多人会说,这简单死了,肯定返回全局函数"The Window"呀,虽然执行了函数getNameFunc(),里面也有个变量name,但那个是函数自己内部的局部变量,跟外部变量name是两个不一样的变量。。。。

呃。。。不好意思,这里alert出的值是"My Object", 是不是有点傻眼?

这是因为函数getNameFunc()在内部定义变量name的时候,没有在name的前面加上var,js有个情况,无论在哪个地方,只要你定义某变量没有在它前面加var的,这个变量都会成为全局函数!!

说白了就是因为木有加var,所以那个函数内部的name就变成了全局变量name(执行的时候直接覆盖掉旧全局变量name就是了)

 

最后再补充一下,怕有的童鞋认为this就是取的全局变量,其实不一定,关于this的详细用法和介绍请查看文章:http://blog.csdn.net/vajoy/article/details/7300370

 


 


嗯,貌似说的七七八八,有什么其它想到了再写上来,顺便推荐大家看下闭包函数:

http://blog.csdn.net/vajoy/article/details/8700912

原创粉丝点击