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


Posted in Javascript onJune 16, 2016

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 相关文章推荐
javascript 动态设置已知select的option的value值的代码
Dec 16 Javascript
腾讯的ip接口 方便获取当前用户的ip地理位置
Nov 25 Javascript
JQuery中操作Css样式的方法
Feb 12 Javascript
让JavaScript的Alert弹出框失效的方法禁止弹出警告框
Sep 03 Javascript
JS小游戏之极速快跑源码详解
Sep 25 Javascript
jquery使用each方法遍历json格式数据实例
May 18 Javascript
浅谈关于JavaScript API设计的一些建议和准则
Jun 24 Javascript
JS实现网页游戏中滑块响应鼠标点击移动效果
Oct 19 Javascript
JavaScript 节流函数 Throttle 详解
Jul 04 Javascript
Bootstrap源码解读排版(1)
Dec 23 Javascript
详解vue-cli 接口代理配置
Dec 13 Javascript
通过实例解析jQ Ajax操作相关原理
Sep 23 Javascript
全面理解JavaScript中的继承(必看)
Jun 16 #Javascript
深入浅析JS的数组遍历方法(推荐)
Jun 15 #Javascript
JavaScript对象数组排序实例方法浅析
Jun 15 #Javascript
JavaScript实现点击文本自动定位到下拉框选中操作
Jun 15 #Javascript
JavaScript对象数组如何按指定属性和排序方向进行排序
Jun 15 #Javascript
jQuery动态加载css文件实现方法
Jun 15 #Javascript
异步加载JS、CSS代码(推荐)
Jun 15 #Javascript
You might like
PHP关于htmlspecialchars、strip_tags、addslashes的解释
2014/07/04 PHP
php中socket的用法详解
2014/10/24 PHP
thinkPHP实现瀑布流的方法
2014/11/29 PHP
JQuery从头学起第二讲
2010/07/04 Javascript
再谈javascript图片预加载技术(详细演示)
2011/03/12 Javascript
基于jQuery替换table中的内容并显示进度条的代码
2011/08/02 Javascript
javascript判断机器是否联网的2种方法
2013/08/09 Javascript
JavaScript中判断对象类型的几种方法总结
2013/11/11 Javascript
jquery操作select大全
2014/04/25 Javascript
浅谈javascript 函数属性和方法
2015/01/21 Javascript
使用npm发布Node.JS程序包教程
2015/03/02 Javascript
javascript中Date()函数在各浏览器中的显示效果
2015/06/18 Javascript
漫谈JS引擎的运行机制 你应该知道什么
2016/06/15 Javascript
Bootstrap 3的box-sizing样式导致UEditor控件的图片无法正常缩放的解决方案
2016/09/15 Javascript
JavaScript中boolean类型之三种情景实例代码
2016/11/21 Javascript
javascript 注释代码的几种方法总结
2017/01/04 Javascript
Javascript for in的缺陷总结
2017/02/03 Javascript
vue实现分页组件
2020/06/16 Javascript
Vuex,iView UI面包屑导航使用扩展详解
2019/11/04 Javascript
原生js实现的金山打字小游戏(实例代码详解)
2020/03/16 Javascript
python 系统调用的实例详解
2017/07/11 Python
Python删除Java源文件中全部注释的实现方法
2017/08/30 Python
python smtplib模块自动收发邮件功能(一)
2018/05/22 Python
Pandas GroupBy对象 索引与迭代方法
2018/11/16 Python
Python中时间datetime的处理与转换用法总结
2019/02/18 Python
Pytorch卷积层手动初始化权值的实例
2019/08/17 Python
python匿名函数的使用方法解析
2019/10/10 Python
Gweniss格温妮丝女包官网:英国纯手工制造潮流包包品牌
2018/02/07 全球购物
Janie and Jack美国官网:GAP旗下的高档童装品牌
2019/09/09 全球购物
戛纳奢侈品商店:Jacques Loup法国
2019/11/04 全球购物
自荐信的五个重要部分
2013/10/29 职场文书
联谊会主持词
2014/03/26 职场文书
戒毒悔改检讨书
2014/09/21 职场文书
2015教师见习期工作总结
2014/12/12 职场文书
5种 JavaScript 方式实现数组扁平化
2021/10/05 Javascript
win10电脑关机快捷键是哪个 win10快速关机的几种方法
2022/08/14 数码科技