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 相关文章推荐
Colortip基于jquery的信息提示框插件在IE6下面的显示问题修正方法
Dec 06 Javascript
Jquery选中或取消radio示例
Sep 29 Javascript
Javascript实现单张图片浏览
Dec 18 Javascript
DOM基础教程之使用DOM + Css
Jan 20 Javascript
javascript自动生成包含数字与字符的随机字符串
Feb 09 Javascript
招聘网站基于jQuery实现自动刷新简历
May 10 Javascript
JS实现的自定义水平滚动字体插件完整实例
Jun 17 Javascript
微信小程序使用第三方库Underscore.js步骤详解
Sep 27 Javascript
Javascript this 函数深入详解
Dec 13 Javascript
JavaScript字符串对象(string)基本用法示例
Jan 18 Javascript
浅谈angular.copy() 深拷贝
Sep 14 Javascript
vue 实现弹窗关闭后刷新效果
Apr 08 Vue.js
剖析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 定义404页面的实现代码
2012/11/19 PHP
PHP实现图片压缩的两则实例
2014/07/19 PHP
php中删除数组的第一个元素和最后一个元素的函数
2015/03/07 PHP
PHP滚动日志的代码实现
2015/06/10 PHP
浅谈PHP接入(第三方登录)QQ登录 OAuth2.0 过程中遇到的坑
2017/10/13 PHP
JavaScript 实现鼠标拖动元素实例代码
2014/02/24 Javascript
javascript实现随时变化着的背景颜色
2015/04/02 Javascript
由浅入深讲解Javascript继承机制与simple-inheritance源码分析
2015/12/13 Javascript
Web性能优化系列 10个提升JavaScript性能的技巧
2016/09/27 Javascript
值得分享的JavaScript实现图片轮播组件
2016/11/21 Javascript
利用jquery实现实时更新歌词的方法
2017/01/06 Javascript
COM组件中调用JavaScript函数详解及实例
2017/02/23 Javascript
JS实现线性表的顺序表示方法示例【经典数据结构】
2017/04/11 Javascript
vue2.0实现的tab标签切换效果(内容可自定义)示例
2019/02/11 Javascript
解决vue项目F5刷新mounted里的函数不执行问题
2019/11/05 Javascript
[46:40]VGJ.T vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
[01:06]欢迎来到上海,TI9
2018/08/26 DOTA
python 切片和range()用法说明
2013/03/24 Python
在python中pandas的series合并方法
2018/11/12 Python
感知器基础原理及python实现过程详解
2019/09/30 Python
tensorflow模型继续训练 fineturn实例
2020/01/21 Python
Keras模型转成tensorflow的.pb操作
2020/07/06 Python
HTML5 常用语法一览(列举不支持的属性)
2010/01/26 HTML / CSS
HTML5 3D书本翻页动画的实现示例
2019/08/28 HTML / CSS
吉列剃须刀美国官网:Gillette美国
2018/07/13 全球购物
装潢设计实习自我鉴定
2013/09/19 职场文书
内容编辑个人求职信
2013/12/10 职场文书
企划主管岗位职责
2013/12/12 职场文书
《自然之道》教学反思
2014/02/11 职场文书
同意离婚答辩状
2015/05/22 职场文书
办公用品管理制度
2015/08/04 职场文书
学校2016年九九重阳节活动总结
2016/04/01 职场文书
在 Golang 中实现 Cache::remember 方法详解
2021/03/30 Python
pytorch显存一直变大的解决方案
2021/04/08 Python
javascript Number 与 Math对象的介绍
2021/11/17 Javascript
MySQL数据库实验之 触发器和存储过程
2022/06/21 MySQL