理解了本文,就知道深拷贝和浅拷贝的底层,了解赋值的底层原理。

可以结合另一篇文章一起食用:深拷贝与浅拷贝的区别,实现深拷贝的方法介绍

以下是正文:

栈数据结构

栈的结构就是后进先出(LIFO),如果读过前面两篇文章应该是相当熟悉了。文中使用乒乓球盒子的结构来解释。

处于盒子中最顶层的乒乓球5,它一定是最后被放进去,但可以最先被使用。而我们想要使用底层的乒乓球1,就必须将上面的4个乒乓球取出来,让乒乓球1处于盒子顶层。

堆数据结构

堆数据结构是一种树状结构。它的存取数据的方式与书架和书非常相似。我们只需要知道书的名字就可以直接取出书了,并不需要把上面的书取出来。JSON格式的数据中,我们存储的key-value可以是无序的,因为顺序的不同并不影响我们的使用,我们只需要关心书的名字。

队列

队列是一种先进先出(FIFO)的数据结构,这是事件循环(Event Loop)的基础结构,事件循环。

变量的存放

首先我们应该知道内存中有栈和堆,那么变量应该存放在哪里呢,堆?栈?

  • 1、基本类型 --> 保存在栈内存中,因为这些类型在内存中分别占有固定大小的空间,通过按值来访问。基本类型一共有6种:Undefined、Null、Boolean、Number 、String和Symbol
  • 2、引用类型 --> 保存在堆内存中,因为这种值的大小不固定,因此不能把它们保存到栈内存中,但内存地址大小的固定的,因此保存在堆内存中,在栈内存中存放的只是该对象的访问地址。当查询引用类型的变量时, 先从栈中读取内存地址, 然后再通过地址找到堆中的值。对于这种,我们把它叫做按引用访问。

在计算机的数据结构中,栈比堆的运算速度快,Object是一个复杂的结构且可以扩展:数组可扩充,对象可添加属性,都可以增删改查。将他们放在堆中是为了不影响栈的效率。而是通过引用的方式查找到堆中的实际对象再进行操作。所以查找引用类型值的时候先去栈查找再去堆查找。

几个问题

问题1:

var a = 20;
var b = a;
b = 30; // 这时a的值是多少?

问题2:

var a = { name: '前端开发' }
var b = a;
b.name = '进阶'; // 这时a.name的值是多少

问题3:

var a = { name: '前端开发' }
var b = a;
a = null; // 这时b的值是多少

现在来解答一下,三个问题的答案分别是20‘进阶’{ name: '前端开发' }

  • 对于问题1,a、b都是基本类型,它们的值是存储在栈中的,a、b分别有各自独立的栈空间,所以修改了b的值以后,a的值并不会发生变化。
  • 对于问题2,a、b都是引用类型,栈内存中存放地址指向堆内存中的对象,引用类型的复制会为新的变量自动分配一个新的值保存在变量对象中,但只是引用类型的一个地址指针而已,实际指向的是同一个对象,所以修改b.name的值后,相应的a.name也就发生了改变。
  • 对于问题3,首先要说明的是null是基本类型,a = null之后只是把a存储在栈内存中地址改变成了基本类型null,并不会影响堆内存中的对象,所以b的值不受影响。

内存空间管理

JavaScript的内存生命周期是

  • 1、分配你所需要的内存
  • 2、使用分配到的内存(读、写)
  • 3、不需要时将其释放、归还

JavaScript有自动垃圾收集机制,最常用的是通过标记清除的算法来找到哪些对象是不再继续使用的,使用a = null其实仅仅只是做了一个释放引用的操作,让 a 原本对应的值失去引用,脱离执行环境,这个值会在下一次垃圾收集器执行操作时被找到并释放。

在局部作用域中,当函数执行完毕,局部变量也就没有存在的必要了,因此垃圾收集器很容易做出判断并回收。但是全局变量什么时候需要自动释放内存空间则很难判断,因此在开发中,需要尽量避免使用全局变量。

谈到垃圾回收机制,就可以延伸到闭包,以及作用域了。

延伸:

【数据结构与算法】常见数据结构及基本操作

JS深入之内存详解,数据结构,存储方式的更多相关文章

  1. js弹窗返回值详解(window.open方式)

    今天在改公司一个老系统时,碰到了window.open()的这个语法.虽然这个方法有点老,不太用了.所以有点不清楚父级弹框如何获取子级页面返回的值.为了解决这个问题,上网搜了一下.原作者参考网址:ht ...

  2. Java中堆内存和栈内存详解2

    Java中堆内存和栈内存详解   Java把内存分成两种,一种叫做栈内存,一种叫做堆内存 在函数中定义的一些基本类型的变量和对象的引用变量都是在函数的栈内存中分配.当在一段代码块中定义一个变量时,ja ...

  3. JVM内存详解-阅读笔记

  4. Oracle内存详解之 Library cache 库缓冲

    Oracle内存详解之 Library cache 库缓冲 2017年11月09日 11:38:39 阅读数:410更多 个人分类: 体系结构 Library cache是Shared pool的一部 ...

  5. DDR3内存详解,存储器结构+时序+初始化过程

    DDR3内存详解,存储器结构+时序+初始化过程 标签: DDR3存储器博客 2017-06-17 16:10 1943人阅读 评论(1) 收藏 举报  分类: 硬件开发基础(2)  转自:http:/ ...

  6. NAND_FLASH_内存详解与读写寻址方式

    一.内存详解 NAND闪存阵列分为一系列128kB的区块(block),这些区块是 NAND器件中最小的可擦除实体.擦除一个区块就是把所有的位(bit)设置为"1"(而所有字节(b ...

  7. js调试工具Console命令详解

    这篇文章主要介绍了js调试工具Console命令详解,需要的朋友可以参考下   一.显示信息的命令 复制代码 代码如下: < !DOCTYPE html> < html> &l ...

  8. Linux内存详解

    --Linux内存详解 -----------------2014/05/24 Linux的内存上表现的不像windows那么直观,本文准备详细的介绍一下Linux的内存. 请看这下有linux命令f ...

  9. JQ的offset().top与js的offsetTop区别详解

    一.前言 最近在做一个图片懒加载的插件,就纵轴(Y轴)而言,我需要时时获取图片的上偏移量,好判断是否已进入视图区域,而我所理解的是offsetTop应该是跟offset().top一样的,然后陷入了因 ...

  10. JQ的offset().top与JS的getBoundingClientRect区别详解,JS获取元素距离视窗顶部可变距离

     壹 ❀ 引 我在 JQ的offset().top与js的offsetTop区别详解 这篇博客中详细分析了JQ方法offset().top与JS属性offsetTop的区别,并得出了一条offset( ...

随机推荐

  1. 活动干货|泛娱乐App出海东南亚深度解析

    泛娱乐社交出海,还有哪些机会点? 为助力出海企业把握增长红利,即构科技特开设<出海"构"有料--泛娱乐出海系列直播>,从热门国家的特性洞察.玩法解决方案到技术服务经验分 ...

  2. AutoCAD 2024下载及安装教程

    安装教程 演示操作系统:Windows 11 *安装前请关闭所有杀毒软件,避免报错 1.解压[CAD2024.zip] 2.打开解压的[CAD2024]文件夹,打开[Setup]文件夹,运行[Setu ...

  3. 使用Stable Diffusion制作AI数字人视频的简明教程

    基本方法 搞一张照片,搞一段语音,合成照片和语音,同时让照片中的人物动起来,特别是头.眼睛和嘴. 语音合成 语音合成的方法很多,也比较成熟了,大家可以选择自己方便的,直接录音也可以,只要能生成一个语音 ...

  4. ListView选中获取数据并弹出菜单项

    前言 作为一名Android小白,我在编写过程中,使用ListView列表,想要使用他来完成长按弹出菜单选项,并且还要进行事件操作,经过百度编程的经历后,终于成功完成.在此附上这块比较完整的代码,理论 ...

  5. Power AutoMate: 变量专栏

    背景 本篇对Power AutoMate的变量功能进行记录与讲解 设置变量 拖拽功能块并赋值 测试一些数据类型 测试中发现与程序中的类型,并没有什么差别 截断数字 对浮点数进行一些操作 选择需要操作的 ...

  6. 【go笔记】使用sqlx操作MySQL

    前言 go在操作MySQL时,可以使用ORM(比如gorm.xorm),也可以使用原生sql.本文以使用sqlx为例,简单记录步骤. go version: 1.16 安装相关库 # mysql驱动 ...

  7. Docker使用教程及常用命令

    Docker是一个开源的应用容器引擎,允许开发者将应用以及依赖打包到一个可移植的容器中,然后发布到任何流行的Linux机器或Windows上.它非常适用于持续集成与持续交付(CI/CD). 1. 安装 ...

  8. Java学习之进制之间的转换

    import java.util.*; public class Jinzhi { public static void main(String[] args) { /** * 总结: * 二进制转换 ...

  9. MySql Workbench 迁移工具 migration 提示缺少pyodbc 2.1.8 的解决方法

    想把公司的数据库转到MySQL,所以想装个MySQL测试,发现新版的MySQL(8.0.34)默认安装还是有不少问题, 一.譬如表.字段大小写的问题: lower_case_table_names=0 ...

  10. 问题排查:nginx的反向代理感觉失效了一样

    背景 最近,负责基础设施的同事,要对一批测试环境机器进行回收,回收就涉及到应用迁移,问题是整个过程一团乱.比如服务器A上一堆应用要调用服务器B上一堆服务,结果服务器B被回收了,然后服务器A上一堆应用报 ...