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 相关文章推荐
图片连续滚动代码[兼容IE/firefox]
Jun 11 Javascript
JQuery扩展插件Validate—6 radio、checkbox、select的验证
Sep 05 Javascript
40款非常有用的 jQuery 插件推荐(系列一)
Dec 21 Javascript
JavaScript实现基于Cookie的存储类实例
Apr 10 Javascript
浅谈jQuery的offset()方法及示例分享
Jul 17 Javascript
以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题
Nov 13 Javascript
如何利用JS通过身份证号获取当事人的生日、年龄、性别
Jan 22 Javascript
fullCalendar中文API官方文档
Feb 07 Javascript
JavaScript中undefined和null的区别
May 03 Javascript
element-ui的回调函数Events的用法详解
Oct 16 Javascript
weui上传多图片,压缩,base64编码的示例代码
Jun 22 Javascript
详解Vue+elementUI build打包部署后字体图标丢失问题
Jul 13 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
新52大事件
2020/03/03 欧美动漫
PHP实现合并discuz用户
2015/08/05 PHP
微信公众平台开发之天气预报功能
2015/08/31 PHP
CI分页类首页、尾页不显示的解决方法
2016/03/28 PHP
php中实现字符串翻转的方法
2017/02/22 PHP
微信公众平台开发教程②微信端分享功能图文详解
2019/04/10 PHP
SlideView 图片滑动(扩展/收缩)展示效果
2010/08/01 Javascript
JS 获取滚动条高度示例代码
2013/10/24 Javascript
jquery实现图片按比例缩放示例
2014/07/01 Javascript
jQuery中$.extend()用法实例
2015/06/24 Javascript
JS实现“隐藏与显示”功能(多种方法)
2016/11/24 Javascript
JS中闭包的经典用法小结(2则示例)
2016/12/28 Javascript
canvas实现钟表效果
2017/02/13 Javascript
原生js封装自定义滚动条
2017/03/24 Javascript
微信小程序仿美团城市选择
2018/06/06 Javascript
JS实现的新闻列表自动滚动效果示例
2019/01/30 Javascript
JavaScript碰撞检测原理及其实现代码
2020/03/12 Javascript
[56:18]VGJ.S vs Secret 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
将Python代码打包为jar软件的简单方法
2015/08/04 Python
Zabbix实现微信报警功能
2016/10/09 Python
Python 多个图同时在不同窗口显示的实现方法
2019/07/07 Python
树莓派安装OpenCV3完整过程的实现
2019/10/10 Python
浅谈tensorflow中Dataset图片的批量读取及维度的操作详解
2020/01/20 Python
django使用F方法更新一个对象多个对象字段的实现
2020/03/28 Python
英国骑行、跑步、游泳、铁人三项运动装备专卖店:Wiggle
2016/08/23 全球购物
压铸汽车模型收藏家:Diecastmodelswholesale.com
2016/12/21 全球购物
C语言面试题
2013/05/19 面试题
《中国梦我的梦》中学生演讲稿
2014/08/20 职场文书
学雷锋的心得体会
2014/09/04 职场文书
高中课前三分钟演讲稿
2014/09/13 职场文书
开业庆典嘉宾致辞
2015/08/01 职场文书
担保书格式范文
2015/09/22 职场文书
大学生先进个人主要事迹材料
2015/11/04 职场文书
Nginx使用X-Accel-Redirect实现静态文件下载的统计、鉴权、防盗链、限速等
2021/04/04 Servers
python数字类型和占位符详情
2022/03/13 Python
浅谈MySql update会锁定哪些范围的数据
2022/06/25 MySQL