为什么js object在被分配前console.log中不为空？

Question

I am running into an unexpected behaviour regarding JS objects.我遇到了关于 JS 对象的意外行为。 Please correct me what I am doing wrong.请纠正我做错了什么。

<?php // BISMILLAHIRRAHMANIRRAHEEM
?>
<!DOCTYPE html>
<head>
    <title>test</title>
    <script>
        var testobj = {};
        var ret = '{"status":true,"Action":"GetContacts","data":{"0":{"company":"abc","faxnumber":"111"},"1":{"company":"def","faxnumber":"222"},"2":{"company":"ghi","faxnumber":"333"}},"message":""}';
        var retobj = JSON.parse(ret);
        function Process() {
            var list = retobj["data"];
            // Label 1
            testobj = {};
            console.log(testobj);
            // Label 2
            testobj = {};
            console.log(testobj); // Not empty!!
            // Label 3
            //testobj = {};
            //console.log(testobj);
            Object.keys(list).forEach(function(key) {
                testobj[key] = {};
                testobj[key]["Name"] = list[key]["company"];
                testobj[key]["Number"] = list[key]["faxnumber"];
            });
            // Label 4
            console.log("After assigned:");
            console.log(testobj);
        }
    </script>
</head>
<body>
    <a href="javascript:Process();">Click</a>
</body>
</html>

I need to reset an object back to empty.我需要将 object 重置为空。 (I read the posts regarding delete on this site). （我在这个网站上阅读了关于delete的帖子）。 While experimenting other options, I am looking for an explanation as to why testobj is not logged empty to console output?在尝试其他选项时，我正在寻找关于为什么testobj没有在控制台 output 中记录为空的解释？ console outputs testobj filled with data that is expected to be filled later in the code.控制台输出testobj填充的数据，预计稍后将在代码中填充。 If I comment out the two lines of code under // Label 2 , the console output under // Label 1 gives a filled testobj .如果我注释掉// Label 2下的两行代码，控制台 output 下// Label 1会给出一个填充的testobj 。 Likewise if // Label 1, 2, 3 are all uncommented, the console output gives first two testobj as empty and the third one filled with data to be filled later.同样，如果// Label 1, 2, 3注释，则控制台 output 将前两个testobj为空，第三个填充有待填充的数据。 Somehow the latest assignment of testobj = {};不知何故testobj = {};的最新分配is getting the object assigned to the about-to-be-assigned data.正在将 object 分配给即将分配的数据。 It happens for the first click/ iteration of Process();它发生在Process(); as well when the object is supposed to be empty initially atleast.当 object 至少最初应该是空的时也是如此。

Please point me to the right direction.请指出正确的方向。 I've tested this on Firefox v75.0 and Chrome v81.0.4044.129我已经在 Firefox v75.0 和 Chrome v81.0.4044.129 上对此进行了测试

Reading the answers to this post , it makes sense that the console shows the first two objects empty until expanded:阅读这篇文章的答案，控制台将前两个对象显示为空直到展开是有道理的：

Object {  } // <--- empty

Object {  } // <--- not empty

After assigned:
Object { 0: {…}, 1: {…}, 2: {…} }

... at which point it should show the current state of the object. ...此时它应该显示 object 的当前 state。 However, no matter in which order you expand the object nodes in console, the last testobj = {};但是，无论您在控制台中以哪种顺序展开 object 节点，最后一个testobj = {}; before forEach loop is the one that shows the current/ updated value of the object.在forEach循环之前是显示 object 的当前/更新值的循环。 Why is that?这是为什么？ Uncommenting all the three labels gives:取消注释所有三个标签给出：

Object {  } // <--- empty

Object {  } // <--- empty

Object {  } // <--- not empty

After assigned:
Object { 0: {…}, 1: {…}, 2: {…} }

Also, i in Chrome debugger shows for each object:此外，我在 Chrome 调试器中显示每个 object：

Value below was evaluated just now下面的值是刚才评估的

Update: console.log(JSON.parse(JSON.stringify(testobj)));更新： console.log(JSON.parse(JSON.stringify(testobj))); shows expected output (all objects empty before being assigned) in all the three label cases.在所有三个 label 案例中显示预期的 output（所有对象在分配之前为空）。 I still find it strange that console showed current/ (realtime?) object value only for the last testobj = {};我仍然觉得奇怪的是控制台显示当前/（实时？） object 值仅适用于最后一个testobj = {}; prior to being assgined the values.在分配值之前。

Answer 1

Your code logs two empty objects, underneath label 1 and 2.您的代码在 label 1 和 2 下记录了两个空对象。

Under label 3, you assign properties to the object from label 2, based on the list object, and log that.在 label 3 下，您根据列表 ZA8CFDE6331BD59EB2AC96F89 将属性从 label 2 分配给 object 2。

Next, when you expand the object from label 2, the browser re-interprets what was logged (it doesn't keep a copy), and looks at the current state of the object, which you modified under label 3. That is what you are looking at. Next, when you expand the object from label 2, the browser re-interprets what was logged (it doesn't keep a copy), and looks at the current state of the object, which you modified under label 3. That is what you正在看。

为什么js object在被分配前console.log中不为空？

问题描述

1 个解决方案

解决方案1
0 2020-05-01 11:34:16

为什么js object在被分配前console.log中不为空？

问题描述

1 个解决方案

解决方案1 0 2020-05-01 11:34:16

解决方案1
0 2020-05-01 11:34:16