美文网首页
普通类型和对象的区别

普通类型和对象的区别

作者: Jason_Shu | 来源:发表于2018-09-15 19:30 被阅读0次

    1.Chrome 打开即占用 1G 内存
    2.Chrome 各每个网页分配一定数量的内存
    3.这些内存要分给页面渲染器、网络模块、浏览器外壳和 JS 引擎(V8引擎)
    4.JS 引擎将内存分为代码区和数据区
    5.我们只研究数据区
    6.数据区分为 Stack(栈内存) 和 Heap(堆内存)
    7.简单类型的数据直接存在 Stack 里
    8.复杂类型的数据是把 Heap 地址存在 Stack 里
    接下来我们用四个典型的面试题来剖析一波:

    1. 四个面试题
      第一题:
    var a = 1
    var b = a
    b = 2
    请问 a 显示是几?  
    
    image.png

    b=a就是把a在stack中的东西放到b在stack中的位置,然后b=2,就是把b在stack中的值改为2,不影响a在stack里面的值。

    第二题:

    var a = {name: 'a'}
    var b = a
    b = {name: 'b'}
    请问现在 a.name 是多少?
    
    image.png

    第一句:申明一个变量a,将一个{name: 'a'}这个对象赋值给a,{name: 'a'}存在heap中,在stack中只存{name: 'a'}的地址(此处假设为address:110)。
    第二句:b=a就是把a在stack中的地址复制一份放在b在stack中的位置。
    第三句:在heap中创建一个新对象{name: 'b'},将这个新对象赋值给b,则是把这个对象的地址放在b对应在stack中的位置。则b在stack中的值由原先的address:110,变为address:120.

    第三题:

    var a = {name: 'a'}
    var b = a
    b.name = 'b'
    请问现在 a.name 是多少?
    
    image.png

    前两句如上分析,第三句b.name = 'b',直接修改了在heap中的{name: 'a'},那么a.name也是修改后的对象,即输出‘b’。

    第四题:

    var a = {name: 'a'}
    var b = a
    b = null
    请问现在 a 是什么?
    
    image.png

    前两句还是如上分析,但是第三句b=null, 就是直接把b在stack中的值改为null,不影响a。

    总结:简单数据类型在stack中直接存值,而复杂数据类型则是把对象的地址存在stack中,对象存在heap中,通过这个地址来对对象进行‘引用’。

    1. 深拷贝和浅拷贝
    var a = 1
    var b = a
    b = 2 //这个时候改变 b
    a 完全不受 b 的影响
    那么我们就说这是一个深复制
    

    对于简单类型的数据来说,赋值就是深拷贝。
    对于复杂类型的数据(对象)来说,才要区分浅拷贝和深拷贝。

    这是一个浅拷贝的例子:

    var a = {name: 'frank'}
    var b = a
    b.name = 'b'
    a.name === 'b' // true
    

    因为我们对 b 操作后,a 也变了。

    深拷贝就是对 Heap 内存进行完全的拷贝:

    var a = {name: 'frank'}
    var b = deepClone(a) // deepClone 暂时还不知道怎么实现
    b.name = 'b'
    a.name === 'a' // true
    

    相关文章

      网友评论

          本文标题:普通类型和对象的区别

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