JS中原始值和引用值的储存方式示例详解


Posted in Javascript onMarch 23, 2018

在ECMAscript中,变量可以存放两种类型的值,即原始值和引用值

  • 原始值指的是代表原始数据类型的值,也叫基本数据类型,包括:Number、Stirng、Boolean、Null、Underfined
  • 引用值指的是复合数据类型的值,包括:Object、Function、Array、Date、RegExp

根据数据类型不同,有的变量储存在栈中,有的储存在堆中。具体区别如下:

原始变量及他们的值储存在栈中,当把一个原始变量传递给另一个原始变量时,是把一个栈房间的东西复制到另一个栈房间,且这两个原始变量互不影响。

引用值是把  引用变量的名称储存在栈中,但是把其实际对象储存在堆中,且存在一个指针由变量名指向储存在堆中的实际对象,当把引用对象传递给另一个变量时,复制的其实是指向实际对象的指针, 此时 两者指向的 是同一个数据,若通过方法改变其中一个变量的值,则访问另一个变量时,其值也会随之加以改变;但若不是通过方法 而是通过 重新赋值  此时 相当于 重新开了一个房间  该值的原指针改变  ,则另外一个 值 不会随他的改变而改变。

看示例:

var a="hello";
var b=a;
a="world";
alert(a);//world
alert(b);//hello
var arr=[1,3];
arr1=arr;
arr.push(5);
alert(arr)//1,3,5
alert(arr1);//1,3,5
arr=[7,8];
alert(arr);//7,8
alert(arr1);//1,3,5

用图来表示 结果如下:

原始变量的值互不影响,引用变量arr和arr1指向的为同一对象,所以当对arr通过方法改变其值时(堆房间里的数据发生变化),访问arr1的数据时就会访问到改变后的对象

JS中原始值和引用值的储存方式示例详解

通过非方法来改变引用变量的值时,会为该引用变量重新创建一个堆房间,此时指针也会发生变化:

JS中原始值和引用值的储存方式示例详解

总结:

Number、Stirng、Boolean、Null、Underfined这些基本数据类型,他们的值直接保存在栈中;

Object、Function、Array、Date、RegExp这些引用类型,他们的引用变量储存在栈中,通过指针指向储存在堆中的实际对象

以上所述是小编给大家介绍的JS中原始值和引用值的储存方式示例详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript利用append添加元素报错的解决方法
Jul 01 Javascript
node.js操作mongoDB数据库示例分享
Nov 26 Javascript
在AngularJS应用中实现一些动画效果的代码
Jun 18 Javascript
浅谈node.js中async异步编程
Oct 22 Javascript
jQuery内容折叠效果插件用法实例分析(附demo源码)
Apr 28 Javascript
BootStrap Typeahead自动补全插件实例代码
Aug 10 Javascript
用headjs来管理和加载js 提高网站加载速度
Nov 29 Javascript
Vue.js实现一个漂亮、灵活、可复用的提示组件示例
Mar 17 Javascript
详解AngularJS ng-class样式切换
Jun 27 Javascript
Vue Element UI + OSS实现上传文件功能
Jul 31 Javascript
JavaScript 类的封装操作示例详解
May 16 Javascript
vue修改Element的el-table样式的4种方法
Sep 17 Javascript
剖析Angular Component的源码示例
Mar 23 #Javascript
vue利用axios来完成数据的交互
Mar 23 #Javascript
JS动画定时器知识总结
Mar 23 #Javascript
p5.js 毕达哥拉斯树的实现代码
Mar 23 #Javascript
轻量级JS Cookie插件js-cookie的使用方法
Mar 22 #Javascript
浅谈Webpack 持久化缓存实践
Mar 22 #Javascript
深入浅析Vue.js中 computed和methods不同机制
Mar 22 #Javascript
You might like
PHP 创建文件(文件夹)以及目录操作代码
2010/03/04 PHP
php中3des加密代码(完全与.net中的兼容)
2012/08/02 PHP
PHP导出EXCEL快速开发指南--PHPEXCEL的使用详解
2013/06/03 PHP
浅析PHP程序防止ddos,dns,集群服务器攻击的解决办法
2013/06/18 PHP
关于JavaScript的一些看法
2009/05/27 Javascript
js DOM的学习笔记
2011/12/22 Javascript
extjs两个tbar问题探讨
2013/08/08 Javascript
js获取或设置当前窗口url参数的小例子
2013/10/14 Javascript
JavaScript中解析JSON数据的三种方法
2015/07/03 Javascript
node.js抓取并分析网页内容有无特殊内容的js文件
2015/11/17 Javascript
JS中使用apply、bind实现为函数或者类传入动态个数的参数
2016/04/26 Javascript
JavaScript 中对象的深拷贝
2016/12/04 Javascript
js/jq仿window文件夹框选操作插件
2017/03/08 Javascript
Node.js如何响应Ajax的POST请求并且保存为JSON文件详解
2017/03/10 Javascript
Three.js获取鼠标点击的三维坐标示例代码
2017/03/24 Javascript
d3.js入门教程之数据绑定详解
2017/04/28 Javascript
bootstrap动态添加面包屑(breadcrumb)及其响应事件的方法
2017/05/25 Javascript
JS滚动到指定位置导航栏固定顶部
2017/07/03 Javascript
Vue2.0实现将页面中表格数据导出excel的实例
2017/08/09 Javascript
jquery手机触屏滑动拼音字母城市选择器的实例代码
2017/12/11 jQuery
vue学习教程之带你一步步详细解析vue-cli
2017/12/26 Javascript
JS与jQuery实现ListBox上移,下移,左移,右移操作功能示例
2018/05/31 jQuery
使用Phantomjs和Node完成网页的截屏快照的方法
2019/07/16 Javascript
javascript将扁平的数据转为树形结构的高效率算法
2020/02/27 Javascript
JavaScript进阶(一)变量声明提升实例分析
2020/05/09 Javascript
python批量修改文件名的实现代码
2014/09/01 Python
python实现类的静态变量用法实例
2015/05/08 Python
Python实现二维数组输出为图片
2018/04/03 Python
值得收藏的10道python 面试题
2019/04/15 Python
提供世界各地便宜的机票:Sky-tours
2016/07/21 全球购物
艺术应用与设计个人的自我评价
2013/11/23 职场文书
九年级家长会邀请函
2014/01/15 职场文书
销售人员职业生涯规划范文
2014/03/01 职场文书
大队干部竞选演讲稿
2014/04/28 职场文书
小学数学继续教育研修日志
2015/11/13 职场文书
小学英语课教学反思
2016/02/15 职场文书