美文网首页
搞懂深浅拷贝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内存之栈和堆

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