JavaScript中堆栈内存管理机制及其在深拷贝与浅拷贝场景中的应用与解析

news2024/11/20 23:16:02

一.堆栈的定义

1.栈是一种特殊的线性表。其特殊性在于限定插入和删除数据元素的操作只能在线性表的一端进行。

image


结论:后进先出(Last In First Out),简称为LIFO线性表。

栈的应用有:数制转换,语法词法分析,表达式求值等

2.队列(Queue)也是一种运算受限的线性表,它的运算限制与栈不同,是两头都有限制,插入只能在表的一端进行(只进不出),而删除只能在表的另一端进行(只出不进),允许删除的一端称为队尾(rear),允许插入的一端称为队头 (Front),队列的操作原则是先进先出的,所以队列又称作FIFO表(First In First Out)。

image

由于栈和队列也是线性表,栈和队列有顺序栈和链栈两种存储结构,这两种存储结构的不同,则使得实现栈的基本运算的算法也有所不同。

二.JS堆栈研究

1、栈(stack)和堆(heap)
stack为自动分配的内存空间,它由系统自动释放;而heap则是动态分配的内存,大小不定也不会自动释放。

2、基本类型和引用类型
(1)基本类型:存放在栈内存中的简单数据段,数据大小确定,内存空间大小可以分配。
  5种基本数据类型有Undefined、Null、Boolean、Number 和 String,它们是直接按值存放的,所以可以直接访问。
(2)引用类型:存放在堆内存中的对象,变量实际保存的是一个指针,这个指针指向另一个位置。每个空间大小不一样,要根据情况开进行特定的分配。
  当我们需要访问引用类型(如对象,数组,函数等)的值时,首先从栈中获得该对象的地址指针,然后再从堆内存中取得所需的数据。

3、传值与传址
  前面之所以要说明什么是内存中的堆、栈以及变量类型,实际上是为了更好的理解什么是“浅拷贝”和“深拷贝”。
  基本类型与引用类型最大的区别实际就是传值与传址的区别。测试用例:

var a = [1,2,3,4,5];
var b = a;
var c = a[0];
alert(b);//1,2,3,4,5 
alert(c);//1 

//改变数值         
b[4] = 6;
c = 7;
alert(a[4]);//6
alert(a[0]);//1

从上面我们可以得知,当我改变b中的数据时,a中数据也发生了变化;但是当我改变c的数据值时,a却没有发生改变。


这就是传值与传址的区别。因为a是数组,属于引用类型,所以它赋予给b的时候传的是栈中的地址(相当于新建了一个不同名“指针”),而不是堆内存中的对象。而c仅仅是从a堆内存中获取的一个数据值,并保存在栈中。所以b修改的时候,会根据地址回到a堆中修改,c则直接在栈中修改,并且不能指向a堆内存中。

842170979894

三.拷贝

1.浅拷贝

前面已经提到,在定义一个对象或数组时,变量存放的往往只是一个地址。当我们使用对象拷贝时,如果属性是对象或数组时,这时候我们传递的也只是一个地址。因此子对象在访问该属性时,会根据地址回溯到父对象指向的堆内存中,即父子对象发生了关联,两者的属性值会指向同一内存空间。

var a = {
    key1:"11111"
}

function Copy(p) {
    var c = {};
    for (var i in p) { 
       c[i] = p[i];
    }
    return c;
}

a.key2 = ['JING','JING'];
var b = Copy(a);
b.key3 = '33333';
console.log(b.key1); //11111
console.log(b.key3); //33333
console.log(a.key3); //undefined

a对象中key1属性是字符串,key2属性是数组。a拷贝到b,12属性均顺利拷贝。给b对象新增一个字符串类型的属性key3时,b能正常修改,而a中无定义。说明子对象的key3(基本类型)并没有关联到父对象中,所以undefined。

b.key2.push("WHALE");
alert(b.key2); //JING,JING,WHALE
alert(a.key2); //JING,JING,WHALE

但是,若修改的属性变为对象或数组时,那么父子对象之间就会发生关联。从以上弹出结果可知,我对b对象进行修改,a、b的key2属性值(数组)均发生了改变。其在内存的状态,可以用下图来表示。

622241916222

原因是key1的值属于基本类型,所以拷贝的时候传递的就是该数据段;但是key2的值是堆内存中的对象,所以key2在拷贝的时候传递的是指向key2对象的地址,无论复制多少个key2,其值始终是指向父对象的key2对象的内存空间。

2.深度拷贝

或许以上并不是我们在实际编码中想要的结果,我们不希望父子对象之间产生关联,那么这时候可以用到深拷贝。既然属性值类型是数组和或象时只会传址,那么我们就用递归来解决这个问题,把父对象中所有属于对象的属性类型都遍历赋给子对象即可。测试代码如下:

function Copy(p, c) {
    var c = c || {};
    for (var i in p) {
        if (typeof p[i] === 'object') {
            c[i] = (p[i].constructor === Array) ? [] : {};
            Copy(p[i], c[i]);
        } else {
            c[i] = p[i];
        }
    }
    return c;
} 
   
a.key2 = ['JING','JING'];
var b={};
b = Copy(a,b);        
b.key2.push("WHALE");
alert(b.key2); //JING,JING,WHALE
alert(a.key2); //JING,JING

由上可知,修改b的key2数组时,没有使a父对象中的key2数组新增一个值,即子对象没有影响到父对象a中的key2。其存储模式大致如下:

648416137877

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1572646.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

小小总结之二分查找三种情况

小小总结之二分查找三种情况 二分查找主要难点在于: 起始条件 left,right的取值,一般若闭合区间,则0, length(nums)。如果涉及边界位置代入计算,则0,length(nums)。循环条件,第一要能够避免死循环,第二要看…

最优乘车

题目描述 H 城是一个旅游胜地,每年都有成千上万的人前来观光。为方便游客,巴士公司在各个旅游景点及宾馆,饭店等地都设置了巴士站并开通了一些单程巴上线路。每条单程巴士线路从某个巴士站出发,依次途经若干个巴士站,…

网络网络层之(3)IPv6地址

网络网络层之(3)IPv6协议 Author: Once Day Date: 2024年4月2日 一位热衷于Linux学习和开发的菜鸟,试图谱写一场冒险之旅,也许终点只是一场白日梦… 漫漫长路,有人对你微笑过嘛… 全系列文档可参考专栏:通信网络技术_Once-Day的…

JQuery(一)---【JQuery简介、安装、初步使用、各种事件】

零.前言 在学习JQuery前,您需要具备以下知识: HTML相关知识(DOM)CSS相关知识JavaScript相关知识 一.JQuery 1.1JQuery简介 JQuery是一个JavaScript的“函数库”,不是JavaScript的一个框架,与“VUE、REACT”有本质区别&#x…

Java栈和队列的实现

目录 一.栈(Stack) 1.1栈的概念 1.2栈的实现及模拟 二.队列(Queue) 2.1队列的概念 2.2队列的实现及模拟 2.3循环队列 2.4双端队列(Deque) 一.栈(Stack) 1.1栈的概念 栈:一种特殊的线性表,其 只允许在固定的一端进行插入和删除元素操作…

【详细讲解0基础如何进入IT行业】

🌈个人主页: 程序员不想敲代码啊 🏆CSDN优质创作者,CSDN实力新星,CSDN博客专家 👍点赞⭐评论⭐收藏 🤝希望本文对您有所裨益,如有不足之处,欢迎在评论区提出指正,让我们共…

【HTML】常用CSS属性

文章目录 前言1、字体和文本属性2、边距和填充3、border边框4、列表属性 前言 上一篇我们学习了CSS扩展选择器以及它的继承性,对于页面元素样式设置相信大家都不陌生了。 这一篇我们就来看看具体都有哪些样式可以设置?又该如何设置? 喜欢的【…

爬虫 新闻网站 以湖南法治报为例(含详细注释,控制台版) V2.0 升级自定义查询关键词、时间段

目标网站:湖南法治报 爬取目的:为了获取某一地区更全面的在湖南法治报已发布的宣传新闻稿,同时也让自己的工作更便捷 环境:Pycharm2021,Python3.10, 安装的包:requests,csv&#xff…

Tailwind 4.0 即将到来:前端开发的“速度与激情”

随着前端开发技术的不断进步,我们每天都在寻找更快、更简洁的解决方案来提升我们的开发效率和用户体验。今天,我要为大家介绍一项令人振奋的新技术进展——Tailwind 4.0的来临! 对于经常使用Tailwind的朋友们来说,这个消息无疑是激…

java 常见API(Objects)

定义 API就是别人定义好的工具类和工具包目的:避免重复造轮子,提升开发效率,更加专注于实现业务逻辑 Object 类 object类是所有类的祖宗类,所有的类型都是可以使用Object的方法的 最常见的三个方法: toString:print就会…

蓝桥杯每日一题:约数个数(质因数)

题目描述: 输入 n 个整数,依次输出每个数的约数的个数。 输入格式 第一行包含整数 n。 第二行包含 n 个整数 ai。 输出格式 共 n 行,按顺序每行输出一个给定整数的约数的个数。 数据范围 1≤n≤1000, 1≤ai≤10^9 输入样例&#xff…

coreldraw是什么软件?最新中文2024版本cdr有哪些功能

CorelDRAW,通常也被称为CDR,是由加拿大Corel公司出品的一款平面设计软件。该软件以其强大的矢量图形制作和排版功能而著称,主要面向绘图设计师和印刷输出人员。 CorelDRAW提供了丰富的绘图工具,包括圆形、矩形、多边形、方格、螺…

FJSP:小龙虾优化算法(Crayfsh optimization algorithm,COA)求解柔性作业车间调度问题(FJSP),提供MATLAB代码

一、柔性作业车间调度问题 柔性作业车间调度问题(Flexible Job Shop Scheduling Problem,FJSP),是一种经典的组合优化问题。在FJSP问题中,有多个作业需要在多个机器上进行加工,每个作业由一系列工序组成&a…

Linux-线程知识点

目录 线程与进程区别pthread库接口介绍pthread_createpthread_self和syscall(SYS_gettid);pthread_equal测试主线程的栈空间大概是多大pthread_setname_nppthread_exitpthread_join为什么要连接退出的线程 pthread_detach 线程与进程区别 进程是一个动态的实体,有自…

java之static详细总结

static也叫静态,可以修饰成员变量、成员方法。 成员变量 按照有无static分为两种: 类变量:static修饰,属于类,与类一起加载一次,在内存中只有一份,会被类的全部对象共享实例变量(…

【C++ STL有序关联容器】set 集合

文章目录 【 1. 基本原理 】【 2. set 的定义 】2.1 调用默认构造函数,创建空的 set 容器2.2 在创建 set 容器的同时,对其进行初始化2.3 拷贝构造的方式创建2.4 取已有 set 容器中的部分元素,来初始化新 set 容器2.5 修改排序规则的方式创建 …

web安全学习笔记(6)

记一下第十节课的内容。 一.PHP语言中的if else判断 语法和c语言中非常类似,不再赘述,也可以使用if...elseif...elseif...else 1.True和False 2.,和 一个等号是赋值 两个等号是比较 三个等号是全等(内容相等,数…

职场中的情绪管理:如何应对工作中的愤怒情绪?

在职场中,我们常常会遇到一些让我们感到愤怒的事情。或许是同事的不配合,或许是上司的不理解,又或许是客户的无理取闹。然而,作为一个职业人,我们需要学会如何管理自己的情绪,尤其是愤怒情绪,以…

linux文件权限与数字转化

chmod命令——change mode,可以对特定文件文件夹权限进行更改 这里我们看到,当执行了chmod u-x try.sh后,try文件底色变为白色,即为其执行权限被“减去” 在linux系统中,权限的减去是通过权限的数字表示来实现的&#…

elment UI el-date-picker 月份组件选定后提交后台页面显示正常,提交后台字段变成时区格式

需求&#xff1a;要实现一个日期的月份选择<el-date-picker :typeformData.dateType :value-formatdateFormat v-modelformData.leaveFactoryDateplaceholder选择月份></el-date-picker>错误示例&#xff1a;将日期显示类型(type)dateType或将日期绑定值的格式(val…