广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >详解JavaScript堆栈与拷贝
  • 126
分享到

详解JavaScript堆栈与拷贝

2024-04-02 19:04:59 126人浏览 独家记忆
摘要

目录一.堆栈的定义二.js堆栈研究1、栈(stack)和堆(heap)2、基本类型和引用类型3、传值与传址三.拷贝1.浅拷贝2.深度拷贝一.堆栈的定义 1.栈是一种特殊的线性表。其特

一.堆栈的定义

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

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

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

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

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

二.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堆内存中。

三.拷贝

1.浅拷贝

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


var a = {
         key1:"11111"
    }
function Copy(p) {
var c = {};
for (var i in p) { 
           c[i] = p[i];
        }
return c;
  }
     a.key2 = ['小辉','小辉'];
var b = Copy(a);
    b.key3 = '33333';
     alert(b.key1);     //1111111
     alert(b.key3);    //33333
     alert(a.key3);    //undefined

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


b.key2.push("大辉");
alert(b.key2);    //小辉,小辉,大辉
alert(a.key2);    //小辉,小辉,大辉

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

原因是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 = ['小辉','小辉'];
var b={};
     b = Copy(a,b);        
     b.key2.push("大辉");
     alert(b.key2);    //小辉,小辉,大辉
     alert(a.key2);    //小辉,小辉

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

以上就是详解javascript堆栈与拷贝的详细内容,更多关于JS 堆栈 拷贝的资料请关注编程网其它相关文章!

--结束END--

本文标题: 详解JavaScript堆栈与拷贝

本文链接: https://www.lsjlt.com/news/127956.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 详解JavaScript堆栈与拷贝
    目录一.堆栈的定义二.JS堆栈研究1、栈(stack)和堆(heap)2、基本类型和引用类型3、传值与传址三.拷贝1.浅拷贝2.深度拷贝一.堆栈的定义 1.栈是一种特殊的线性表。其特...
    99+
    2022-11-12
  • JavaScript中堆栈与拷贝的示例分析
    小编给大家分享一下JavaScript中堆栈与拷贝的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!一.堆栈的定义栈是一种特殊的线性表。其特殊性在于限定插入...
    99+
    2023-06-15
  • JavaScript中深拷贝与浅拷贝详解
    目录1 浅拷贝概念2 深拷贝概念3 浅拷贝的实现方式3.1 Object.assign()3.2 Array.prototype.concat()3.3 Array.pro...
    99+
    2022-11-13
  • JavaScript深拷贝与浅拷贝实现详解
    目录对于基本类型数据对于引用类型数据实现深拷贝简单版够用版structuredClone对于基本类型数据 可以说都是深拷贝。 对于引用类型数据 对于引用类型数据,浅拷贝 后,因为浅拷...
    99+
    2022-11-13
    JavaScript深拷贝与浅拷贝 JS深拷贝与浅拷贝
  • Golang中深拷贝与浅拷贝详解
    目录什么是深拷贝?什么是浅拷贝?示例代码小结什么是深拷贝? 深拷贝(Deep Copy)是指原对象与拷贝的新对象互相独立,对其中任何一个对象的改动都不会对另外一个对象造成影响。值类型...
    99+
    2023-05-19
    Golang 深拷贝与浅拷贝 Golang深拷贝 Golang浅拷贝 Golang拷贝
  • 详细总结Java堆栈内存、堆外内存、零拷贝浅析与代码实现
    目录一、堆栈内存二、堆外内存三、零拷贝一、堆栈内存 堆栈内存,顾名思义,指的是堆内存以及栈内存,其中,堆内存是由Java GC进行管理的内存区域,而栈内存则是线程内存。关于栈内存,这...
    99+
    2022-11-12
  • C++拷贝构造函数(深拷贝与浅拷贝)详解
    对于普通类型的对象来说,它们之间的复制是很简单的,例如:int a=88;int b=a; 而类对象与普通对象不同,类对象内部结构一般较为复杂,存在各种成员变量。下面看一个类对象拷贝...
    99+
    2022-11-15
    拷贝构造函数 深拷贝 浅拷贝
  • 怎么理解Javascript深拷贝与浅拷贝
    怎么理解Javascript深拷贝与浅拷贝,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。 前言在 javascript &nbs...
    99+
    2022-10-19
  • Java中深拷贝,浅拷贝与引用拷贝的区别详解
    目录引用拷贝浅拷贝深拷贝小结引用拷贝 引用拷贝: 引用拷贝不会在堆上创建一个新的对象,只 会在栈上生成一个新的引用地址,最终指向依然是堆上的同一个对象。 //实体类 public c...
    99+
    2022-11-13
  • 如何理解JavaScript中的浅拷贝与深拷贝
    本篇文章给大家分享的是有关如何理解JavaScript中的浅拷贝与深拷贝,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。 浅拷贝在使用JavaScript对数组进行操作...
    99+
    2023-06-16
  • Java Cloneable接口的深拷贝与浅拷贝详解
    目录Cloneable接口源码浅拷贝案例Pet类定义Person类定义浅拷贝问题-代码测试深拷贝案例Pet类重写clone()方法Person的clone()方法中调用Pet的clo...
    99+
    2022-11-13
  • python浅拷贝与深拷贝使用方法详解
    目录一、对象赋值二、浅拷贝三、深拷贝四、深入解析浅拷贝和深拷贝在面试和日常的开发中都会经常遇到 我们就从 对象赋值、浅拷贝、深拷贝 三个方面来讲 一、对象赋值 In [1]: lis...
    99+
    2022-11-13
    python浅拷贝与深拷贝 python深拷贝 python浅拷贝
  • Java Cloneable接口的深拷贝与浅拷贝详解
    Java中的Cloneable接口是一个标记接口,用于标识一个类可以被克隆。该接口没有定义任何方法,但是在使用clone()方法进行...
    99+
    2023-08-17
    Java
  • Java堆栈内存、堆外内存、零拷贝的示例分析
    这篇文章将为大家详细讲解有关Java堆栈内存、堆外内存、零拷贝的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。一、堆栈内存堆栈内存,顾名思义,指的是堆内存以及栈内存,其中,堆内存是由Java GC...
    99+
    2023-06-15
  • JavaScript深拷贝与浅拷贝是什么
    这篇文章主要介绍了JavaScript深拷贝与浅拷贝是什么,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。1 浅拷贝概念深拷贝和浅拷贝是只针对Object和Array这样的引用...
    99+
    2023-06-29
  • Python详细讲解浅拷贝与深拷贝的使用
    目录1.变量的赋值操作2.浅拷贝3.深拷贝4.总结1.变量的赋值操作 只是多生成了一个变量,实际上还是指向同一个对象 # -*- coding: utf-8 -*- class CP...
    99+
    2022-11-11
  • 老生常谈JavaScript深拷贝与浅拷贝
    目录1 浅拷贝概念2 深拷贝概念3 浅拷贝的实现方式3.1 Object.assign()3.2 Array.prototype.concat()3.3 Array.pro...
    99+
    2022-11-13
  • JavaScript浅拷贝与深拷贝如何实现
    这篇文章主要介绍“JavaScript浅拷贝与深拷贝如何实现”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“JavaScript浅拷贝与深拷贝如何实现”文章能帮助大家解决问题。在 JavaScript...
    99+
    2023-06-27
  • JavaScript中深拷贝与浅拷贝实例运用
    这篇文章主要介绍了JavaScript中深拷贝与浅拷贝实例运用的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JavaScript中深拷贝与浅拷贝实例运用文章都会有所收获,下面我们一起来看看吧。1 浅拷贝概念深拷...
    99+
    2023-06-29
  • Java中浅拷贝和深拷贝详解
    目录Java浅拷贝深拷贝实现浅拷贝实现深拷贝Java浅拷贝深拷贝 浅拷贝和深拷贝涉及到了Object类中的clone()方法 实现浅拷贝 浅拷贝的实现需要类重写clone()方法 ...
    99+
    2022-11-12
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作