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自定义排序 node运行 实例
Jun 05 Javascript
javascript对象的相关操作小结
May 16 Javascript
详细谈谈javascript的对象
Jul 31 Javascript
jQuery实现导航滚动到指定内容效果完整实例【附demo源码下载】
Sep 20 Javascript
详解Angular的双向数据绑定(MV-VM)
Dec 26 Javascript
bootstrap timepicker在angular中取值并转化为时间戳
Jun 13 Javascript
微信小程序实现移动端滑动分页效果(ajax)
Jun 13 Javascript
switchery按钮的使用方法
Dec 18 Javascript
javascript json字符串到json对象转义问题
Jan 22 Javascript
如何从零开始手写Koa2框架
Mar 22 Javascript
layui点击数据表格添加或删除一行的例子
Sep 12 Javascript
原生JavaScript实现日历功能代码实例(无引用Jq)
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
咖啡豆的最常见发酵处理方法,详细了解一下
2021/03/03 冲泡冲煮
教你如何把一篇文章按要求分段
2006/10/09 PHP
php合并js请求的例子
2013/11/01 PHP
php之curl实现http与https请求的方法
2014/10/21 PHP
Yii框架结合sphinx,Ajax实现搜索分页功能示例
2016/10/18 PHP
PHP中使用mpdf 导出PDF文件的实现方法
2018/10/22 PHP
客户端脚本中常常出现的一些问题和调试技巧
2007/01/09 Javascript
得到文本框选中的文字,动态插入文字的js代码
2007/03/07 Javascript
用js解决数字不能换行问题
2010/08/10 Javascript
JavaScript实现表格排序方法
2013/06/14 Javascript
jQuery客户端分页实例代码
2013/11/18 Javascript
js实现新年倒计时效果
2015/12/10 Javascript
Bootstrap导航条的使用和理解3
2016/12/14 Javascript
在iFrame子页面里实现模态框的方法
2018/08/17 Javascript
解决vue2.0 element-ui中el-upload的before-upload方法返回false时submit()不生效问题
2018/08/24 Javascript
最适应的vue.js的form提交涉及多种插件【推荐】
2018/08/27 Javascript
vue中eslintrc.js配置最详细介绍
2018/12/21 Javascript
jQuery实现侧边栏隐藏与显示的方法详解
2018/12/22 jQuery
JavaScript如何借用构造函数继承
2019/11/06 Javascript
js异步接口并发数量控制的方法示例
2020/11/22 Javascript
[02:38]2018DOTA2亚洲邀请赛赛前采访-VGJ.T
2018/04/03 DOTA
Python基础教程之tcp socket编程详解及简单实例
2017/02/23 Python
python 日期操作类代码
2018/05/05 Python
Python字典中的键映射多个值的方法(列表或者集合)
2018/10/17 Python
python GUI库图形界面开发之PyQt5中QMainWindow, QWidget以及QDialog的区别和选择
2020/02/26 Python
哈工大自然语言处理工具箱之ltp在windows10下的安装使用教程
2020/05/07 Python
keras中的卷积层&amp;池化层的用法
2020/05/22 Python
opencv 图像滤波(均值,方框,高斯,中值)
2020/07/08 Python
使用numpngw和matplotlib生成png动画的示例代码
2021/01/24 Python
Vans奥地利官方网站:美国原创极限运动潮牌
2018/09/30 全球购物
奥地利时尚、美容、玩具和家居之家:Kastner & Öhler
2020/04/26 全球购物
办公室主任岗位职责
2013/11/08 职场文书
教师党的群众路线学习心得体会
2014/11/04 职场文书
2015年民主生活会发言材料
2014/12/15 职场文书
2015年南京大屠杀纪念日活动总结
2015/03/24 职场文书
优秀员工演讲稿
2019/06/21 职场文书