浅析JavaScript中的变量复制、参数传递和作用域链


Posted in Javascript onJanuary 13, 2016

今天在看书的过程中,又发现了自己目前对Javascript存在的一个知识模糊点:JS的作用域链,所以就通过查资料看书对作用域链相关的内容进行了学习。今天学习笔记主要有这样几个关键字:变量、参数传递、执行环境、变量对象、作用域链。

1.变量

变量需要注意的有两点:变量声明和复制变量值。

变量声明肯定大家都很熟悉,在JS中我们都是通过 var 关键字进行变量声明的。JS中规定,通过var声明的变量会被添加到最近的环境中,如果声明并且初始化一个变量没有用到var关键字,这个变量会被添加到全局环境中。

关于复制变量值,因为变量的类型不同复制的过程也不同。如果变量是一个基本类型的变量的话,复制变量值时会给新复制出的变量分配新的空间,两个变量值互不影响;如果变量是一个引用类型的话,复制的操作其实是让两个变量指向了同一处内存空间,修改其中一个,另一个也会跟着改变。《Javascript 高级程序设计》中的图例其实很形象

2.参数传递

JavaScript中的参数传递全部是按照值传递的。基本类型做参数一般都不会有什么困惑,如果引用类型做了参数,类似下面这个例子:

function setName(obj){
obj.name = "tom";
}
var person = new Object();
setName(person);
alert(person.name);//显示tom

这个例子中我们在setName中修改了变量的内容,在函数外也生效了。刚开始我也以为程序执行应该会弹出 undefined 或者报错,但是却弹出了在函数的作用域中修改的值。分析了一下参数传递的整个过程,这个疑惑就解决了。在参数传递的过程中,有很重要的一步:变量值复制。我们在调用函数时其实进行了 obj=person 这样一步操作,所以根据上面提到的引用类型变量值复制的特点,当我们修改obj时,同时也就修改了person的值。所以JS参数传递的方式是值传递,并且只能是值传递。

3.执行环境、变量对象、作用域链

我对执行环境、执行环境的理解有点类似与类和对象:

执行环境中定义了变量、函数和函数可以访问到的其他数据,而当这个执行环境被激活时,就会根据这个执行环境创建出一个变量对象提供给解析器使用。执行环境就好比是类,变量对象就对应是对象。

当一个执行环境激活时,它就会被推入一个栈的栈顶中执行,当它执行完毕,会将它移出栈,执行在它之前进入栈的环境,以此类推。

而作用域链相当于一个存放变量对象的栈,越早被激活的执行环境创建出的变量对象越在下面,当前激活的执行环境的变量对象位于栈顶。如果当前执行环境执行完毕,那么就需要将栈顶的变量对象(对应执行环境)从栈顶移出。

而执行环境在执行时,解析器需要访问变量等数据都是从作用域顶端开始查找,也就是从当前执行环境对应的变量对象开始查找,如果查找不到,则往下进入外层执行环境对应的变量对象中查找,一直持续到找到需要的对象或找到全局环境的变量对象为止。所以这种查找方式也就说明了太多定义在全局环境中的变量比较影响程序的性能。

今天学习的东西主要是概念性质的,而且比较抽象。但是这部分对于后面所有的知识都是基础,像是之后的闭包啊,继承啊,原型啊都要对这部分内容有很好的理解才能学的更明白透彻,所以这部分内容应该反复学习,要相信温故而知新,古人诚不欺我也(。・∀・)ノ゙

Javascript 相关文章推荐
JavaScript使用cookie
Feb 02 Javascript
JS实多级联动下拉菜单类,简单实现省市区联动菜单!
May 03 Javascript
jquery 与NVelocity 产生冲突的解决方法
Jun 13 Javascript
ASP.NET jQuery 实例13 原创jQuery文本框字符限制插件-TextArea Counter
Feb 03 Javascript
jQuery Ajax请求状态管理器打包
May 03 Javascript
JavaScript 实现鼠标拖动元素实例代码
Feb 24 Javascript
Javascript数据结构与算法之列表详解
Mar 12 Javascript
JS验证逗号隔开可以是中文字母数字
Apr 22 Javascript
微信小程序分页加载的实例代码
Jul 11 Javascript
详谈Node.js之操作文件系统
Aug 29 Javascript
浅谈es6中export和export default的作用及区别
Feb 07 Javascript
基于Express框架使用POST传递Form数据
Aug 10 Javascript
Jquery uploadify上传插件使用详解
Jan 13 #Javascript
JavaScript类型检测之typeof 和 instanceof 的缺陷与优化
Jan 13 #Javascript
jquery对复选框(checkbox)的操作汇总
Jan 13 #Javascript
分享javascript计算时间差的示例代码
Mar 19 #Javascript
学习JavaScript设计模式之代理模式
Jan 12 #Javascript
基于JavaScript实现TAB标签效果
Jan 12 #Javascript
JavaScript实现瀑布流布局
Jun 28 #Javascript
You might like
php 静态变量与自定义常量的使用方法
2010/01/26 PHP
学习php设计模式 php实现观察者模式(Observer)
2015/12/09 PHP
Laravel中批量赋值Mass-Assignment的真正含义详解
2017/09/29 PHP
PHP基于phpqrcode类生成二维码的方法示例详解
2020/08/07 PHP
jquery随意添加移除html的实现代码
2011/06/21 Javascript
JS返回上一页实例代码通过图片和按钮分别实现
2013/08/16 Javascript
js实现图片在未加载完成前显示加载中字样
2014/09/03 Javascript
纯js代码制作的网页时钟特效【附实例】
2016/03/30 Javascript
老生常谈javascript的类型转换
2016/10/12 Javascript
vue.js表格组件开发的实例详解
2016/10/12 Javascript
RequireJS简易绘图程序开发
2016/10/28 Javascript
详解Vue.js分发之作用域槽
2017/06/13 Javascript
JavaScript上传文件时不用刷新页面方法总结(推荐)
2017/08/15 Javascript
详解小程序不同页面之间通讯的解决方案
2018/11/23 Javascript
使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法
2020/05/14 Javascript
在vue中获取wangeditor的html和text的操作
2020/10/23 Javascript
[03:27]最受玩家喜爱奖提名:PZH_Element 致玩家寄语
2016/12/20 DOTA
python文件读写并使用mysql批量插入示例分享(python操作mysql)
2014/02/17 Python
python实现dict版图遍历示例
2014/02/19 Python
Python中的闭包详细介绍和实例
2014/11/21 Python
Python迭代和迭代器详解
2016/11/10 Python
python+matplotlib实现动态绘制图片实例代码(交互式绘图)
2018/01/20 Python
python生成器与迭代器详解
2019/01/01 Python
python实现微信防撤回神器
2019/04/29 Python
Python操作Mongodb数据库的方法小结
2019/09/10 Python
flask 框架操作MySQL数据库简单示例
2020/02/02 Python
详解如何在css中引入自定义字体(font-face)
2018/05/17 HTML / CSS
大学生优秀的自我评价分享
2013/10/22 职场文书
如何写一份好的自荐信
2014/01/02 职场文书
心理健康教育制度
2014/01/27 职场文书
大学生家政服务项目创业计划书
2014/01/30 职场文书
2014年党课学习心得体会
2014/07/08 职场文书
2015年汽车销售经理工作总结
2015/04/27 职场文书
2015年度学校卫生工作总结
2015/05/12 职场文书
CSS3 制作的彩虹按钮样式
2021/04/11 HTML / CSS
python 使用tkinter与messagebox写界面和弹窗
2022/03/20 Python