JavaScript变量类型以及变量作用域详解


Posted in Javascript onAugust 14, 2017

变量类型

ECMAScript变量可能包含两种不同类型的数据值:基本类型和引用类型。

基本类型

基本类型指的是简单的数据段,5种基本数据类型:undefined、null、boolean、number、string,基本数据类型是按值访问的,因此可以操作保存在变量中的实际的值。

复制变量值

从一个变量向另一个变量复制基本类型的值,会在变量对象上创建一个新值,然后把该值复制到为新变量分配的位置上。例如:

var num1 = 5;
var num2 = num1;

复制前的变量对象

JavaScript变量类型以及变量作用域详解

复制后的变量对象

JavaScript变量类型以及变量作用域详解

引用类型

引用类型指那些可能由多个值构成的对象,引用类型的值是保存在内存中的对象,JavaScript不允许直接访问内存中的位置,在操作对象时,实际上是在操作对象的引用而不是实际的对象,因此,引用类型的值是按引用访问的。

动态属性

引用类型的值,我们可以为其添加属性和方法,也可以改变和删除其属性和方法。如果对象不被销毁或者这个属性不被删除,则这个属性将一直存在,但是我们不能给基本类型的值添加属性。例如:

var person = new Object();
person.say = "hello";
alert(person.say); //"hello"

复制变量值

从一个变量向另一个变量复制引用类型的值时,也会将存储在变量对象中的值复制一份放到为新变量分配的空间中,这个值的副本实际上是一个指针,而这个指针指向存储在堆中的一个对象。复制结束后,两个变量实际上将引用同一个对象,改变其中一个变量,就会影响另一个变量。例如:

var obj1 = new Object();
var obj2 = obj1;
obj1.say = "hello";
alert(obj2.say); //"hello"

JavaScript变量类型以及变量作用域详解

传递参数

ECMAScript中所有函数的参数都是按值传递的,把函数外部的值复制给函数内部的参数。在向参数传递基本类型的值时,被传递的值会被复制给一个局部变量;在向参数传递引用类型的值时,会把这个值在内存中的地址复制给一个局部变量,因此这个局部变量的变化会反映在函数的外部。例如:

function addTen(num) {
 num += 10;
 return num;
}
var count = 20;
var result = addTen(count);
alert(count);  //20 
alert(result);  //30

执行环境及作用域

执行环境定义了变量或函数有权访问的其他数据,决定了他们各自的行为。
全局执行环境是最外围的执行环境,在WEB浏览器中,全局执行环境被认为是window对象,因此全局变量和属性都是作为window的属性和方法创建的。
每个函数都有自己的执行环境,当执行流进入一个函数时,函数的环境就会被推入一个环境栈中,在函数执行之后,栈将其弹出,将控制权返回给之前的执行环境。
当代码在一个环境中执行时,会创建变量对象的一个作用域链,作用域链的用途是保证对执行环境有权访问的所有变量和函数的有序访问。作用域链的前端始终是当前指行代码所在的变量对象,作用域链中下一个变量对象来自外部环境,再下一个变量对象来自下一个外部环境,这样一直延续到全局环境,全局执行环境的变量对象始终是作用域链的最后一个对象。
标识符解析是沿着作用域链一级一级地搜索标识符的过程。搜索过程始终从作用域链的前端开始,然后逐级地向后回溯,直到找到标识符为止。

JavaScript变量类型以及变量作用域详解

内部环境可以通过作用域链访问所有的外部环境,但外部环境不能访问内部环境中的任何变量和函数。

无块级作用域

JavaScript中没有块级作用域,例如:

if(true){
 var color = "blue";
}
alert(color);  //"blue"

在函数中未使用var声明的变量会被成全局变量,例如:

function add(num1,num2){
 sum = num1 + num2;
 return sum;
}
var result = add(10,20);
alert(sum);  //30

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
扩展String功能方法
Sep 22 Javascript
(JS实现)MapBar中坐标的加密和解密的脚本
May 16 Javascript
js 方法实现返回多个数据的代码
Apr 30 Javascript
JavaScript中使用正则匹配多条,且获取每条中的分组数据
Nov 30 Javascript
设为首页加入收藏兼容360/火狐/谷歌/IE等主流浏览器的代码
Mar 26 Javascript
iframe子页面与父页面在同域或不同域下的js通信
May 07 Javascript
在JavaScript中使用NaN值的方法
Jun 05 Javascript
详解vue项目中如何引入全局sass/less变量、function、mixin
Jun 02 Javascript
vue 中使用 watch 出现了如下的报错的原因分析
May 21 Javascript
layui form.render('select', 'test2') 更新渲染的方法
Sep 27 Javascript
vue表单数据交互提交演示教程
Nov 13 Javascript
vue实现购物车的小练习
Dec 21 Vue.js
jQuery:unbind方法的使用详解
Aug 14 #jQuery
通过V8源码看一个关于JS数组排序的诡异问题
Aug 14 #Javascript
关于Vue Webpack2单元测试示例详解
Aug 14 #Javascript
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
Aug 14 #Javascript
Vue.js如何实现路由懒加载浅析
Aug 14 #Javascript
JavaScript中的return布尔值的用法和原理解析
Aug 14 #Javascript
一个Js文件函数中调用另一个Js文件函数的方法演示
Aug 14 #Javascript
You might like
同时提取多条新闻中的文本一例
2006/10/09 PHP
CentOS 安装 PHP5.5+Redis+XDebug+Nginx+MySQL全纪录
2015/03/25 PHP
Codeigniter控制器controller继承问题实例分析
2016/01/19 PHP
javascript十个最常用的自定义函数(中文版)
2009/09/07 Javascript
防止动态加载JavaScript引起的内存泄漏问题
2009/10/08 Javascript
jQuery 第二课 操作包装集元素代码
2010/03/14 Javascript
JavaScript类和继承 prototype属性
2010/09/03 Javascript
基于jquery的仿百度的鼠标移入图片抖动效果
2010/09/17 Javascript
jquery 实现两级导航菜单附效果图
2014/03/07 Javascript
jQuery模拟点击A标记示例参考
2014/04/17 Javascript
js动态切换图片的方法
2015/01/20 Javascript
深入理解JavaScript系列(50):Function模式(下篇)
2015/03/04 Javascript
原生js结合html5制作简易的双色子游戏
2015/03/30 Javascript
分享JS数组求和与求最大值的方法
2016/08/11 Javascript
浅谈React和Redux的连接react-redux
2017/12/04 Javascript
javaScript手机号码校验工具类PhoneUtils详解
2017/12/08 Javascript
浅谈vue的第一个commit分析
2020/06/08 Javascript
不依任何赖第三方,单纯用vue实现Tree 树形控件的案例
2020/09/21 Javascript
Python实现Windows和Linux之间互相传输文件(文件夹)的方法
2017/05/08 Python
python sys.argv[]用法实例详解
2018/05/25 Python
python实现对求解最长回文子串的动态规划算法
2018/06/02 Python
解决Python下imread,imwrite不支持中文的问题
2018/12/05 Python
python selenium 查找隐藏元素 自动播放视频功能
2019/07/24 Python
解决pycharm最左侧Tool Buttons显示不全的问题
2019/12/17 Python
Python基于paramunittest模块实现excl参数化
2020/04/26 Python
Puritan’s Pride(普丽普莱)官方网站:美国最大最全的保健品公司之一
2016/10/23 全球购物
Lacoste澳大利亚官网:服装、鞋类及配饰
2018/11/14 全球购物
护士实习生自我鉴定范文
2013/12/10 职场文书
应届毕业生个人求职信范文
2014/01/29 职场文书
在校大学生个人的自我评价
2014/02/13 职场文书
物流专员岗位职责
2014/02/17 职场文书
物资采购方案
2014/06/12 职场文书
投资意向书
2014/07/30 职场文书
购房意向书
2014/08/30 职场文书
商业用房租赁协议书
2014/10/13 职场文书
教师党员个人整改措施
2014/10/27 职场文书