js基础----dom节点使用console.log打印始终是最新的现象（待验证）

今天在复习dom节点的创建的时候发现打印日志的时候，不管log的位置在哪里，打印出的节点始终是最新的

这就让我很困惑了，js不是由上到下执行的吗，然后问了同事，他分享了打印对象时候的类似的现象

先展示下打印dom节点的demo

<script>
/* 创建标签节点 */
var p_tag = document.createElement('p');
console.log('p_tag: ', p_tag);
 
/* 创建文本节点 */
var text_node = document.createTextNode('我是文本节点');
console.log('text_node: ', text_node);

/* 创建标签节点 */
var style_attribute = document.createAttribute('style');
style_attribute.value = "color: red;"
console.log('style_attribute: ', style_attribute);

/* 组合标签节点，文本节点，标签节点 */
p_tag.appendChild(text_node);
p_tag.setAttributeNode(style_attribute);
console.log('p_tag complex: ', p_tag);
console.log('p_tag complex text: ', p_tag.innerHTML);
 
// /* 给标签设置内容 */
p_tag.innerHTML = "我是p的文案"
console.log('p_tag txt: ', p_tag);
console.log('p_tag txt innerHtml: ', p_tag.innerHTML);

</script>

控制台打印出的内容如下：

圈出来的三个地方打印出来的都是最新的p标签， 但是innerHTML的属性值是不一样的

同事分享的场景demo如下

    var people = {name: "Summer", look: "beautiful"}
    console.log('people: ', people);
    people.name= "hanMeiMei";
    people.look = "handsome";

控制台打印如下， 打印出的对象内容和展开里面显示的不一致

 第一种场景造成的原因我是这么理解的，dom节点是一个对象，在内存中是分堆/栈存储的，打印的时候p_tag实际是dom节点存储的地址，根据地址找到的就是更新后的dom节点

第二个场景： chrome控制台打印对象，默认没有展开（此时是原始people)，显示的是更改前的对象；展开后才是内存中地址对应栈中存储的对象----修改后的对象(newPeople)

我还是不明白默认没有展开的时候为什么还是原始的people， 我使用safari浏览器打印出来是下面这样的

 所以大胆猜测chrome浏览器打印对象必须以展开后的为准