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获取域名的方法
Jan 27 Javascript
纯js实现仿QQ邮箱弹出确认框
Apr 29 Javascript
js实现倒计时关键代码
May 05 Javascript
vue.js 获取当前自定义属性值
Jun 01 Javascript
微信小程序 input表单与redio及下拉列表的使用实例
Sep 20 Javascript
使用JS实现图片轮播的实例(前后首尾相接)
Sep 21 Javascript
AngularJs 禁止模板缓存的方法
Nov 28 Javascript
你可能不知道的前端算法之文字避让(inMap)
Jan 12 Javascript
使用weixin-java-tools完成微信授权登录、微信支付的示例
Sep 26 Javascript
解决Vue调用springboot接口403跨域问题
Sep 02 Javascript
JavaScript实现图片伪异步上传过程解析
Apr 10 Javascript
javascript的var与let,const之间的区别详解
Feb 18 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中让上传的文件大小在上传前就受限制的两种解决方法
2013/06/24 PHP
PHP实现登录注册之BootStrap表单功能
2017/09/03 PHP
javascript Xml增删改查(IE下)操作实现代码
2009/01/30 Javascript
DOM 脚本编程中的兄弟节点
2009/10/31 Javascript
jquery获取iframe中的dom对象(两种方法)
2013/07/02 Javascript
node.js使用require()函数加载模块
2014/11/26 Javascript
JS实现仿新浪微博发布内容为空时提示功能代码
2015/08/19 Javascript
学习JavaScript设计模式之单例模式
2016/01/19 Javascript
jQuery学习心得总结(必看篇)
2016/06/10 Javascript
Node.js开启Https的实践详解
2016/10/25 Javascript
QRCode.js:基于JQuery的生成二维码JS库的使用
2017/06/23 jQuery
Node.js 基础教程之全局对象
2017/08/06 Javascript
详解.vue文件中style标签的几个标识符
2018/07/17 Javascript
微信小程序自定义对话框弹出和隐藏动画
2018/07/19 Javascript
一些你可能不熟悉的JS知识点总结
2019/03/15 Javascript
Vue项目中使用jsonp抓取跨域数据的方法
2019/11/10 Javascript
Vue.extend 编程式插入组件的实现
2019/11/18 Javascript
JS运算符简单用法示例
2020/01/19 Javascript
JavaScript cookie原理及使用实例
2020/05/08 Javascript
解决vue中axios设置超时(超过5分钟)没反应的问题
2020/09/04 Javascript
Python实现提取谷歌音乐搜索结果的方法
2015/07/10 Python
使用Python实现画一个中国地图
2019/11/23 Python
天巡全球:Skyscanner Global
2017/06/20 全球购物
意大利奢侈品零售商:ilDuomo Novara
2019/09/11 全球购物
澳大利亚在线购买葡萄酒:The Wine Collective
2020/02/20 全球购物
一份比较全的PHP面试题
2016/07/29 面试题
一套带网友答案的.NET笔试题
2016/12/06 面试题
简单英文演讲稿
2014/01/01 职场文书
公司开业庆典主持词
2014/03/21 职场文书
小学英语教师先进事迹
2014/05/28 职场文书
学校食堂标语
2014/10/06 职场文书
九九重阳节标语
2014/10/07 职场文书
场地使用证明模板
2014/10/25 职场文书
期中考试后的感想
2015/08/07 职场文书
护士医德医风心得体会
2016/01/25 职场文书
vue实现滑动解锁功能
2022/03/03 Vue.js