javascript作用域、作用域链(菜鸟必看)

所属分类: 网络编程 / JavaScript 阅读数: 498
收藏 0 赞 0 分享

javascript的作用域和作用域链是我学习最痛苦的一部分,因为我花了好多时间看了好多技术文档都没有理解.大体知道什么意思了,然后还说不出之所以然来.

通过我大量的测试和看技术文档总结了以下理解,虽然不是很有技术范但是确实能理解了。

1、javascript只有全局和局部之分,那些后台语言的各种修饰符都没有。在函数中不使用var则为全局。如下:

<script type="text/javascript"> 

varname="c#";//全局

window.name="java";//全局 

varlanguage=function() 

{ 

alert(name); 

name="javascript";//全局 

var name="JS";//局部 

alert(name); 

}() 

  

alert(name); 

</script> 

上面代码中表示为全局的在都指向同一个变量,下面的定义会替换上面的。关于三个alert分别是underfind,js,javascript.这就是作用域起了作用了。

2、作用域链从0级开始依次往下排,所谓的依次往下排指的是子级的排列。在寻找变量的时候先从同级找再找父级。

在上面的例子中,

首先弹出的是language方法里的第一个alert,如果window全局是0,那么在例子中var name="js"这个就是1.第一个alert就在1中找,如果找不到在去0中找。这是它发现了同级有一个var name="js"但是它目前还没有赋值,所以弹出underfind

第二个弹出是language方法里的第二个alert,同样的他会在1里找也就是方法内部。他找到了name而且赋值了js,所以弹出的是js

第三个弹出是最下面的alert,由于在方法内部已经给全局name重新赋值了,导致弹出的是javascript。

然后增加下一个链路我们在language中顶一个方法,如下:

<scripttype="text/javascript"> 

varname="javascript";//全局 

window.name="javascript";//全局 

varlanguage=function() 

{ 

alert(name); 

name="javascript";//全局 

varname="JS";//局部 

alert(name); 

  

var lovelanguage=function(){

alert(name); 

}(); 

}() 

  

alert(name);

</script> 

此时lovelanguage里的alert弹出的是js因为他会找上一级也就是language里的name,所以。。。

以上就是小编为大家带来的javascript作用域、作用域链(菜鸟必看)的全部内容了,希望大家多多支持脚步之家。

更多精彩内容其他人还在看

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 分享
查看更多