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 相关文章推荐
JS对象与JSON格式数据相互转换
Feb 20 Javascript
关于jQuery中.attr()和.prop()的问题探讨
Sep 06 Javascript
Javascript浅谈之引用类型
Dec 18 Javascript
JS基于面向对象实现的拖拽功能示例
Dec 20 Javascript
jQuery使用DataTable实现删除数据后重新加载功能
Feb 27 Javascript
详解用webpack把我们的业务模块分开打包的方法
Jul 20 Javascript
react native仿微信PopupWindow效果的实例代码
Aug 07 Javascript
动态加载JavaScript文件的3种方式
May 05 Javascript
vue-quill-editor富文本编辑器简单使用方法
Sep 21 Javascript
Vue递归组件+Vuex开发树形组件Tree--递归组件的简单实现
Apr 01 Javascript
js实现验证码功能
Jul 24 Javascript
vue 动态组件(component :is) 和 dom元素限制(is)用法说明
Sep 04 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 神盾解密工具 ”
2014/06/20 PHP
jquery.alert 弹出式复选框实现代码
2009/06/15 Javascript
JavaScript高级程序设计 阅读笔记(十四) js继承机制的实现
2012/08/14 Javascript
简介JavaScript中toTimeString()方法的使用
2015/06/12 Javascript
js实现图片点击左右轮播
2015/07/08 Javascript
JQUERY表单暂存功能插件分享
2016/02/23 Javascript
JavaScript:Array类型全面解析
2016/05/19 Javascript
一个非常好用的文字滚动的案例,鼠标悬浮可暂停[两种方案任选]
2016/12/01 Javascript
jquery ajaxfileupload异步上传插件使用详解
2017/02/08 Javascript
利用webstrom调试Vue.js单页面程序的方法教程
2017/06/06 Javascript
vue打包通过image-webpack-loader插件对图片压缩优化操作
2020/11/12 Javascript
[01:13]DOTA2群星解读国服召集令 一起说出回归的理由
2013/07/17 DOTA
[01:03:36]Ti4 循环赛第三日DK vs Titan
2014/07/12 DOTA
[01:08:33]OG vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
Python发送email的3种方法
2015/04/28 Python
Django Rest framework之权限的实现示例
2018/12/17 Python
python模拟登陆,用session维持回话的实例
2018/12/27 Python
python如何制作缩略图
2019/04/30 Python
tensorflow如何批量读取图片
2019/08/29 Python
python 如何将数据写入本地txt文本文件的实现方法
2019/09/11 Python
Python验证码截取识别代码实例
2020/05/16 Python
QML实现钟表效果
2020/06/02 Python
不可轻视HTML5!App三年内将被html5顶替彻底消失
2015/11/18 HTML / CSS
日本乐天官方海外转运服务:Rakuten Global Express
2018/11/30 全球购物
美国鲜花递送:UrbanStems
2021/01/04 全球购物
Myprotein荷兰官网:欧洲第一运动营养品牌
2020/07/11 全球购物
消防器材管理制度
2014/01/28 职场文书
大学生作弊检讨书
2014/02/19 职场文书
工程建设实施方案
2014/03/14 职场文书
求职信怎么写范文
2014/05/26 职场文书
安全生产工作汇报
2014/10/28 职场文书
中学生社区服务活动报告
2015/02/05 职场文书
react国际化react-intl的使用
2021/05/06 Javascript
python字典的元素访问实例详解
2021/07/21 Python
MySQL查询日期时间
2022/05/15 MySQL
Spring中bean集合注入的方法详解
2022/07/07 Java/Android