zoukankan      html  css  js  c++  java
  • console.log-对象引用

    现象

    现象1

    利用简单的例子描述下

    打印出的结果为

    很明显可以看出,对象在打印之后改变,但最终结果还是改变后的值,因此console.log保存的事对象的引用。

    现象2

    但是,在debugger的过程中我发现,如果在对象改变之前去控制台展开对象看,结果就不太一样了


    发现这时候即使后面执行了a.b.c = 2,控制台的输出也没有变化了

    现象3

    而如果第一次展开时不全部展开,像这样

    那第二次去看的时候,就是会有个很奇怪的现象

    此时再展开,就是这样

    小结

    从以上现象看,好像就是不展开看就是引用,展开看了就不是了;且展开了上一层,只要下一层还没展开,那下一层就还是引用(现象3)。

    原因

    以上的小结其实有误导,研究了一下我发现原因远在天边,近在眼前。展开对象后,打印结果右上角有个感叹号,把鼠标放在上面

    这句英文意思是:以下结果是刚刚被执行的。这也就很好解释上面的现象了,也就是展开之前保存的是快照,展开对象时 ,才会去引用里执行取值操作。
    还发现一个现象,如果在现象2中,看到结果1后收起对象,看结果2时再展开,结果不会有任何变化,也就是说只要展开过一次,第二次就不会再进行取值操作了。

    可选解决方案

    如果想要真正看到console.log所在行对象当时的值,可以用

    • JSON.stringify(a),将对象转换为字符串
    • JSON.parse(JSON.stringify(a))
      备注:在用console.log调试时,看到的不一定是真实的,要多多注意。
  • 相关阅读:
    【题解】P3388 【模板】割点(割顶)
    【题解】T156527 直角三角形
    【题解】T156526 各数字之和
    【题解】P5318 【深基18.例3】查找文献
    数据结构:邻接表
    【题解】P3387 【模板】缩点
    全网最最详细!一文讲懂Tarjan算法求强连通分量&缩点
    vue组件间通信
    vue实现头像上传
    解读JavaScript中的Hoisting机制(js变量声明提升机制)
  • 原文地址:https://www.cnblogs.com/youhong/p/9984375.html
Copyright © 2011-2022 走看看