JavaScript数据类型的存储方法详解


Posted in Javascript onAugust 25, 2017

一个很基础的知识点,JavaScript中基本数据类型和引用数据类型是如何存储的。

由于自己是野生程序员,在刚开始学习程序设计的时候没有在意内存这些基础知识,导致后来在提到“什么什么是存在栈中的,栈中只是存了一个引用”这样的话时总是一脸懵逼。。

后来渐渐的了解了一些内存的知识,这部分还是非常有必要了解的。

基本数据结构

栈,只允许在一段进行插入或者删除操作的线性表,是一种先进后出的数据结构。

堆是基于散列算法的数据结构。

队列

队列是一种先进先出(FIFO)的数据结构。

JavaScript中数据类型的存储

JavaScript中将数据类型分为基本数据类型和引用数据类型,它们其中有一个区别就是存储的位置不同。

基本数据类型

我们都知道JavaScript中的基本数据类型有:

  • String
  • Number
  • Boolean
  • Undefined
  • Null
  • Symbol(暂时不管)

基本数据类型都是一些简单的数据段,它们是存储在栈内存中。

引用数据类型

JavaScript中的引用数据类型有:

  • Array
  • Object

引用数据类型是保存在堆内存中的,然后再栈内存中保存一个对堆内存中实际对象的引用。所以,JavaScript中对引用数据类型的操作都是操作对象的引用而不是实际的对象。

可以理解为,栈内存中保存了一个地址,这个地址和堆内存中的实际值是相关的。

图解

现在,我们声明几个变量试试:

var name="axuebin";
var age=25;
var job;
var arr=[1,2,3];
var obj={age:25};

可以通过下图来表示数据类型在内存中的存储情况:

JavaScript数据类型的存储方法详解

此时 name , age , job 三种基本数据类型是直接存在栈内存中的,而 arr , obj 在栈内存中只是存了一个地址来表示对堆内存中的引用。

复制

基本数据类型

对于基本数据类型,如果进行复制,系统会自动为新的变量在栈内存中分配一个新值,很容易理解。

引用数据类型

如果对于数组、对象这样的引用数据类型而言,复制的时候就会有所区别了:

系统也会自动为新的变量在栈内存中分配一个值,但这个值仅仅是一个地址。也就是说,复制出来的变量和原有的变量具有相同的地址值,指向堆内存中的同一个对象。

JavaScript数据类型的存储方法详解

如果所示,执行了 var objCopy=obj 之后, obj 和 objCopy 具有相同的地址值,执行堆内存中的同一个实际对象。

这有什么不同呢?

当我修改 obj 或 objCopy 时,都会引起另一个变量的改变。

为什么?

为什么基础数据类型存在栈中,而引用数据类型存在堆中呢?

  1. 堆比栈大,栈比对速度快。
  2. 基础数据类型比较稳定,而且相对来说占用的内存小。
  3. 引用数据类型大小是动态的,而且是无限的。
  4. 堆内存是无序存储,可以根据引用直接获取。

总结

以上所述是小编给大家介绍的JavaScript数据类型的存储方法详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js 在定义的时候立即执行的函数表达式(function)写法
Jan 16 Javascript
jquery如何判断某元素是否具备指定的样式
Nov 05 Javascript
showModalDialog在谷歌浏览器下会返回Null的解决方法
Nov 27 Javascript
用js控制组织结构图可以任意拖拽到指定位置
Jan 17 Javascript
jQuery提示效果代码分享
Nov 20 Javascript
浅谈javascript原型链与继承
Jul 13 Javascript
微信小程序 Record API详解及实例代码
Sep 30 Javascript
Angular1.x自定义指令实例详解
Mar 01 Javascript
canvas基础绘制-绚丽倒计时的实例
Sep 17 Javascript
Vue-resource拦截器判断token失效跳转的实例
Oct 27 Javascript
vue.js的computed,filter,get,set的用法及区别详解
Mar 08 Javascript
浅谈Vue.js中如何实现自定义下拉菜单指令
Jan 06 Javascript
使用JQ完成表格隔行换色的简单实例
Aug 25 #Javascript
Vue.js实现网格列表布局转换方法
Aug 25 #Javascript
Angular2 组件间通过@Input @Output通讯示例
Aug 24 #Javascript
Angular2 组件交互实例详解
Aug 24 #Javascript
使用jQuery实现页面定时弹出广告效果
Aug 24 #jQuery
探究react-native 源码的图片缓存问题
Aug 24 #Javascript
详解vue.js之绑定class和style的示例代码
Aug 24 #Javascript
You might like
重置版战役片段
2020/04/09 魔兽争霸
php 定界符格式引起的错误
2011/05/24 PHP
浅谈php+phpStorm+xdebug配置方法
2015/09/17 PHP
php版微信小店API二次开发及使用示例
2016/11/12 PHP
经常用的图片在容器中的水平垂直居中实例
2007/06/10 Javascript
jQuery 1.4 15个你应该知道的新特性(译)
2010/01/24 Javascript
js打印纸函数代码(递归)
2010/06/18 Javascript
探索Emberjs制作一个简单的Todo应用
2012/11/07 Javascript
JavaScript自定义方法实现trim()、Ltrim()、Rtrim()的功能
2013/11/03 Javascript
css与javascript跨浏览器兼容性总结
2014/09/15 Javascript
Ajax局部更新导致JS事件重复触发问题的解决方法
2014/10/14 Javascript
jQuery插件EnPlaceholder实现输入框提示文字
2015/06/05 Javascript
详解jQuery移动页面开发中的ui-grid网格布局使用
2015/12/03 Javascript
js纯数字逐一停止显示效果的实现代码
2016/03/16 Javascript
WEB 前端开发中防治重复提交的实现方法
2016/10/26 Javascript
jQuery实现定时隐藏对话框的方法分析
2018/02/12 jQuery
实例讲解JS中pop使用方法
2019/01/27 Javascript
详解vue后台系统登录态管理
2019/04/02 Javascript
小程序云开发实现数据库异步操作同步化
2019/05/18 Javascript
利用原生JS实现欢乐水果机小游戏
2020/04/23 Javascript
python将文本转换成图片输出的方法
2015/04/28 Python
qpython3 读取安卓lastpass Cookies
2016/06/19 Python
Python爬虫动态ip代理防止被封的方法
2019/07/07 Python
nginx搭建基于python的web环境的实现步骤
2020/01/03 Python
细数nn.BCELoss与nn.CrossEntropyLoss的区别
2020/02/29 Python
python实现微信打飞机游戏
2020/03/24 Python
Django Path转换器自定义及正则代码实例
2020/05/29 Python
NFL Game Pass欧洲:在线观看NFL比赛直播和点播,以高清质量播放
2018/08/30 全球购物
Tuckernuck官网:经典的美国品质服装、鞋子和配饰
2021/01/11 全球购物
外企办公室竞聘演讲稿
2013/12/29 职场文书
五四青年节活动总结
2015/02/10 职场文书
小学生五一劳动节演讲稿
2015/03/18 职场文书
目标责任书格式范文
2015/05/11 职场文书
史上最全的军训拉歌口号
2015/12/25 职场文书
PostgreSQL13基于流复制搭建后备服务器的方法
2022/01/18 PostgreSQL
Ubuntu18.04下QT开发Android无法连接设备问题解决实现
2022/06/01 Java/Android