JS数据类型(基本数据类型、引用数据类型)及堆和栈的区别分析


Posted in Javascript onMarch 04, 2020

本文实例讲述了JS数据类型(基本数据类型、引用数据类型)及堆和栈的区别。分享给大家供大家参考,具体如下:

js数据类型:基本数据类型和引用数据类型(文章最下面会介绍各类型的基础以及注意事项

基本数据类型指的是简单的数据段,引用数据类型指的是有多个值构成的对象

当我们把变量赋值给一个变量时,解析器首先要确认的就是这个值是基本类型值还是引用类型值

基本数据类型:数字(Number)、字符串(String)、布尔(Boolean)、空(Null)、未定义(Undefined)

引用数据类型:也就是对象类型Object type,比如:Object 、Array 、Function 、Data等

基本数据类型

基本数据类型是按值访问的,因为可以直接操作保存在变量中的实际值

var a = 1;
var b = a;//b获取的是a值得一份拷贝,虽然,两个变量的值相等,但是两个变量保存了两个不同的基本数据类型值
b = 2;
console.log(a); // 1

b只是保存了a复制的一个副本。所以,b的改变,对a没有影响。

下图演示了这种基本数据类型赋值的过程:

JS数据类型(基本数据类型、引用数据类型)及堆和栈的区别分析

栈(stack):栈会自动分配内存空间,会自动释放,存放基本类型,简单的数据段,占据固定大小的空间。

所有在方法中定义的变量都是放在栈内存中,随着方法的执行结束,这个方法的内存栈也自然销毁 

优点:存取速度比堆快,仅次于直接位于CPU中的寄存器,数据可以共享; 
缺点:存在栈中的数据大小与生存期必须是确定的,缺乏灵活性。

栈:可以递归调用方法,这样随着栈深度的增加,JVM维持着一条长长的方法调用轨迹,知道内存不够分配,产生栈溢出。

引用类型数据

javascript的引用数据类型是保存在堆内存中的对象。

与其他语言的不同是,你不可以直接访问堆内存空间中的位置和操作堆内存空间。只能操作对象在栈内存中的引用地址。

所以,引用类型数据在栈内存中保存的实际上是对象在堆内存中的引用地址。通过这个引用地址可以快速查找到保存中堆内存中的对象。

var obj1 = new Object();
var obj2 = obj1;
obj2.name = "叶落森";
console.log(obj1.name); //叶落森

说明这两个引用数据类型指向了同一个堆内存对象。obj1赋值给onj2,实际上这个堆内存对象在栈内存的引用地址复制了一份给了obj2,但是实际上他们共同指向了同一个堆内存对象。实际上改变的是堆内存对象。(这里就会引出深拷贝和浅拷贝问题,这里是浅拷贝,具体的见前面一篇堆和栈的区别)

下面我们来演示这个引用数据类型赋值过程:

JS数据类型(基本数据类型、引用数据类型)及堆和栈的区别分析

 

各类型的基础以及注意事项

1.Number类型

Number类型包含整数和浮点数(浮点数数值必须包含一个小数点,且小数点后面至少有一位数字)两种值。

NaN:非数字类型。特点:① 涉及到的 任何关于NaN的操作,都会返回NaN   ② NaN不等于自身。

isNaN() 函数用于检查其参数是否是非数字值。

isNaN(123) //false
isNaN("hello") //true

2.String类型

字符串有length属性。

字符串转换:转型函数String(),适用于任何数据类型(null,undefined 转换后为null和undefined);toString()方法(null,defined没有toString()方法)。

3.Boolean类型

该类型只有两个值,true和false

4.Undefined类型

只有一个值,即undefined值。使用var声明了变量,但未给变量初始化值,那么这个变量的值就是undefined。

5.Null类型

null类型被看做空对象指针,前文说到null类型也是空的对象引用。

6.Object类型

js中对象是一组属性与方法的集合。这里就要说到引用类型了,引用类型是一种数据结构,用于将数据和功能组织在一起。引用类型有时候也被称为对象定义,因为它们描述的是一类对象所具有的属性和方法。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
关于Javascript 的 prototype问题。
Jan 03 Javascript
javascript脚本编程解决考试分数统计问题
Oct 18 Javascript
模仿JQuery.extend函数扩展自己对象的js代码
Dec 09 Javascript
读jQuery之三(构建选择器)
Jun 11 Javascript
jquery 根据name名获取元素的value值
Feb 27 Javascript
快速掌握Node.js环境的安装与运行方法
Feb 16 Javascript
浅谈js的html元素的父节点,子节点
Aug 06 Javascript
ReactJs快速入门教程(精华版)
Nov 28 Javascript
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
JointJS流程图的绘制方法
Dec 03 Javascript
vue中轮训器的使用
Jan 27 Javascript
vue路由切换之淡入淡出的简单实现
Oct 31 Javascript
微信浏览器左上角返回按钮监听的实现
Mar 04 #Javascript
js回调函数原理与用法案例分析
Mar 04 #Javascript
在pycharm中开发vue的方法步骤
Mar 04 #Javascript
Vue+Vuex实现自动登录的知识点详解
Mar 04 #Javascript
vuex入门最详细整理
Mar 04 #Javascript
JavaScript 严格模式(use strict)用法实例分析
Mar 04 #Javascript
vue 自定义组件的写法与用法详解
Mar 04 #Javascript
You might like
php把文件设置为插件的技巧方法
2020/02/03 PHP
Javascript 获取链接(url)参数的方法
2009/02/15 Javascript
可以用来调试JavaScript错误的解决方案
2010/08/07 Javascript
JavaScript访问样式表代码
2010/10/15 Javascript
JavaScript的Backbone.js框架的一些使用建议整理
2016/02/14 Javascript
js实现页面跳转的五种方法推荐
2016/03/10 Javascript
Vue.JS入门教程之处理表单
2016/12/01 Javascript
vue.js利用Object.defineProperty实现双向绑定
2017/03/09 Javascript
jQuery滑动到底部加载下一页数据的实例代码
2017/05/22 jQuery
vue开发调试神器vue-devtools使用详解
2017/07/13 Javascript
jQuery中each方法的使用详解
2018/03/18 jQuery
Vue插件打包与发布的方法示例
2018/08/20 Javascript
NodeJs实现简单的爬虫功能案例分析
2018/12/05 NodeJs
详解JQuery基础动画操作
2019/04/12 jQuery
vue项目中引入vue-datepicker插件的详解
2019/05/14 Javascript
JavaScript中var的重要性实例分析
2019/07/09 Javascript
原生js+canvas实现下雪效果
2020/08/02 Javascript
JavaScript中的几种继承方法示例
2020/12/06 Javascript
python交互式图形编程实例(一)
2017/11/17 Python
Python MySQLdb 使用utf-8 编码插入中文数据问题
2018/03/13 Python
python递归全排列实现方法
2018/08/18 Python
Python3.5装饰器典型案例分析
2019/04/30 Python
利用pytorch实现对CIFAR-10数据集的分类
2020/01/14 Python
python读取多层嵌套文件夹中的文件实例
2020/02/27 Python
Python将QQ聊天记录生成词云的示例代码
2021/02/10 Python
让IE支持CSS3的不完全兼容方案
2014/09/19 HTML / CSS
Monica Vinader官网:英国轻奢珠宝品牌
2020/02/05 全球购物
创联软件面试题笔试题
2012/10/07 面试题
聚美优品的广告词
2014/03/14 职场文书
妇女儿童发展规划实施方案
2014/03/16 职场文书
优秀安全员事迹材料
2014/05/11 职场文书
2015年办公室个人工作总结
2015/04/20 职场文书
丧事主持词
2015/07/02 职场文书
先进教师个人主要事迹材料
2015/11/03 职场文书
Pytest实现setup和teardown的详细使用详解
2021/04/17 Python
如何用JavaScipt测网速
2021/05/09 Javascript