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 相关文章推荐
JS中 用户登录系统的解决办法
Apr 15 Javascript
javascript之typeof、instanceof操作符使用探讨
May 19 Javascript
Backbone.js框架中简单的View视图编写学习笔记
Feb 14 Javascript
Javascript this 函数深入详解
Dec 13 Javascript
Vuejs入门教程之Vue生命周期,数据,手动挂载,指令,过滤器
Apr 19 Javascript
JS跳转手机站url的若干注意事项
Oct 18 Javascript
JavaScript模板引擎应用场景及实现原理详解
Dec 14 Javascript
JS实现深度优先搜索求解两点间最短路径
Jan 17 Javascript
vue请求本地自己编写的json文件的方法
Apr 25 Javascript
微信小程序class封装http代码实例
Aug 24 Javascript
详解Js模块化的作用原理和方案
Apr 29 Javascript
ztree+ajax实现文件树下载功能
May 18 Javascript
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
PHP ignore_user_abort函数详细介绍和使用实例
2014/07/15 PHP
javascript中使用replaceAll()函数实现字符替换的方法
2010/12/25 Javascript
JS保留两位小数,多位小数的示例代码
2014/01/07 Javascript
JavaScript生成的动态下雨背景效果实现方法
2015/02/25 Javascript
AspNet中使用JQuery上传插件Uploadify详解
2015/05/20 Javascript
详解JS几种变量交换方式以及性能分析对比
2016/11/25 Javascript
Bootstrap Modal对话框如何在关闭时触发事件
2016/12/02 Javascript
从零开始学习Node.js系列教程一:http get和post用法分析
2017/04/13 Javascript
详解jquery选择器的原理
2017/08/01 jQuery
npm配置国内镜像资源+淘宝镜像的方法
2018/09/07 Javascript
vscode下的vue文件格式化问题
2018/11/28 Javascript
微信小程序的线程架构【推荐】
2019/05/14 Javascript
vue将后台数据时间戳转换成日期格式
2019/07/31 Javascript
基于Vue+ElementUI的省市区地址选择通用组件
2019/11/20 Javascript
微信小程序实现页面浮动导航
2020/01/08 Javascript
如何使用 JavaScript 操作浏览器历史记录 API
2020/11/24 Javascript
vue使用过滤器格式化日期
2021/01/20 Vue.js
[44:09]DOTA2上海特级锦标赛A组小组赛#1 EHOME VS MVP.Phx第二局
2016/02/25 DOTA
[01:03:51]2018DOTA2亚洲邀请赛 4.7 淘汰赛 VP vs LGD 第三场
2018/04/09 DOTA
[01:28:24]NAVI vs VG Supermajor 败者组 BO3 第三场 6.5
2018/06/06 DOTA
python基础教程项目四之新闻聚合
2018/04/02 Python
对Python3之方法的覆盖与super函数详解
2019/06/26 Python
使用Python制作缩放自如的圣诞老人(圣诞树)
2019/12/25 Python
python 中的[:-1]和[::-1]的具体使用
2020/02/13 Python
使用opencv中匹配点对的坐标提取方式
2020/06/04 Python
Django封装交互接口代码
2020/07/12 Python
django Model层常用验证器及自定义验证器详解
2020/07/15 Python
深入浅析pycharm中 Make available to all projects的含义
2020/09/15 Python
html5 button autofocus 属性介绍及应用
2013/01/04 HTML / CSS
英国在线房屋中介网站:Yopa
2018/01/09 全球购物
Giglio美国站:意大利奢侈品购物网
2018/02/10 全球购物
Lookfantastic俄罗斯:欧洲在线化妆品零售商
2019/08/06 全球购物
最新英语专业学生求职信范文
2013/09/21 职场文书
最新大学生自我评价
2013/09/24 职场文书
快餐店的创业计划书范文
2014/01/29 职场文书
Redis 操作多个数据库的配置的方法实现
2022/03/23 Redis