美文网首页
搞懂深浅拷贝JavaScript内存之栈和堆

搞懂深浅拷贝JavaScript内存之栈和堆

作者: wade3po | 来源:发表于2019-02-05 09:23 被阅读26次

对于前端来说,平时开发业务代码的时候根本不会关心JavaScript的内存问题,因为根本用不到,也因此对于内存分配没有一点概念。只有理解了内存分配,对于深拷贝和浅拷贝才能真正理解。当然,理解内存分配对JavaScript才会有更深层次的理解。

基本所有程序都有内存的概念,我们只要简单理解JavaScript是怎么分配内存的就够了。JavaScript内存可以理解就分为两块,一个是栈,一个是堆。栈是有序的,拿兵乓球盒子来记忆确实很生动,先进后出。但是我不清楚真正取数据的时候程序是怎么执行的。堆是无序的,里面存放的数据通过指针获取。栈的存取速度大于堆。

我们都知道JavaScript有五个基础数据类型,Undefined、Null、Boolean、Number、String,在JavaScript内存分配中,基础数据类型存放在栈中,引用数据类型Object,也就是Array、Data等存放在堆中,但是栈存储着指向堆的指针地址。

比如:

var a = 1;
var b = 2;
var c = 3;
var d = [1];
var e = {e: 1};

在内存中大概是这样的:

d和c都只是存储一个地址,数据存储在堆中,这个地址指向堆,至于这个地址是什么,我就不知道了,这边我只是参考网上的格式。a、b、c基础数据类型则是直接存储在栈中。

知道了这个,我们就很容易理解

var a = {a: 15, b: 20};
var b = a;
b.a = 30;
alert(a.a);

为什么弹出来的是30了。如下图:

因为a和b都是对象,把a赋值给b的时候,只是把地址赋值给了b,指向的是堆内相同的数据,所以在改变b的数据的时候,堆内数据改变了,但是a和b地址指针相同,所以弹出来的也是30。

知道了基础数据类型和引用数据类型在栈和堆内的存储,深拷贝和浅拷贝是不是就变的很简单,跟知道了GC机制之后理解闭包就容易很多一样。想要真的学习JavaScript这门语言,很多基础知识真的很重要。

欢迎关注Coding个人笔记公众号

相关文章

  • 搞懂深浅拷贝JavaScript内存之栈和堆

    对于前端来说,平时开发业务代码的时候根本不会关心JavaScript的内存问题,因为根本用不到,也因此对于内存分配...

  • Js的浅拷贝与深拷贝

    堆和栈的区别 堆和栈都是内存中划分出来的用于存储的区域。 深拷贝与浅拷贝的区别就是其在内存中存储的类型不同。 栈(...

  • JavaScript 中的深拷贝和浅拷贝

    JavaScript 内存中的堆和栈 栈(stack):堆是 JavaScript 用来存储静态数据的数据结构。静...

  • 【Javascript】探究javascript中的堆/栈/任务

    堆/栈/队列 在javascript中,存在调用栈 (call stack)和内存堆(memory heap) ,...

  • 浅拷贝与深拷贝

    一、内存 我们都知道数据存放内存中,基本数据在栈内存,引用数据指针在栈内存实体在堆内存 二、深拷贝与浅拷贝 深拷贝...

  • js底层数据类型

    js底层数据类型 堆和栈的区别 其实深拷贝和浅拷贝的主要区别就是其在内存中的存储类型不同。 堆和栈都是内存中划分出...

  • JavaScript - 深浅拷贝Object.assign()

    引入:值类型存储在栈内存中,引用类型存储在堆内存,深浅拷贝主要是针对引用类型来说的(数组、对象等)。(值类型直接赋...

  • javascript拷贝

    JavaScript引用类型 浅拷贝和深拷贝 基本类型:深浅拷贝都是一样的效果,所以只有拷贝,值传递,新的内存分配...

  • js/jquery 学习笔记

    理解JavaScript中的堆和栈 这里先说两个概念:1、堆(heap)2、栈(stack)堆是堆内存的简称。栈是...

  • 栈内存与堆内存

    JavaScript中的执行环境栈和 栈内存与堆内存 小李子_前端 关注 2018.01.17 17:28 字数 ...

网友评论

      本文标题:搞懂深浅拷贝JavaScript内存之栈和堆

      本文链接:https://www.haomeiwen.com/subject/sdnssqtx.html