将对象推入循环内的数组中[重复]答案

【问题标题】：Pushing an object in an array inside a loop [duplicate]将对象推入循环内的数组中[重复]
【发布时间】：2020-11-09 23:27:18
【问题描述】：

几个小时以来，我一直在尝试破解这个，但我似乎真的无法成功。我正在尝试创建一个如下所示的 JSON 字符串，但是当将变量 obj 的值传递给变量 j 时，我得到的只是该循环的最后一个结果的数组。

而不是得到如下结果：

[{machine: "hi"...}
 {machine: "2"....}]

我得到：

[{machine: "2"...}
 {machine: "2"....
 and keep going with same value}]

我做错了什么？

var return_json = function(){
    var j = [];
    var obj = {};
    var td;
    for(var i=1;i<tr.length;i++){
        td = tr[i].getElementsByTagName("td");
        obj['machine'] = td[0].innerHTML;
        console.log(obj['machine']);
        obj['day'] = td[1].getElementsByTagName("p")[0].innerHTML;
        obj['night'] = td[2].getElementsByTagName("p")[0].innerHTML;
        j.push(obj);
        console.log(j);
    }
    return j;
};

console.log(save_limitation());

【问题讨论】：

您是在尝试创建 JSON 字符串还是迭代 JSON obj？
@Alex 我希望我能回答这个问题，但我不知道我在做什么。这是据我所知。
如果你想创建一个JSON字符串，你可以使用JSON.stringify()并传入一个数组。
在for 循环内定义var obj = {};
@Satpal omg 我花了很多时间试图解决这个问题，而我所要做的就是在循环中定义 var obj ¬¬。谢谢

标签： javascript json

【解决方案1】：

您只是在循环之前在obj 变量中创建了一个对象实例。在每次迭代中，您都会更新对象的属性并将同一个对象推送到您的数组中。

要修复它，请在每次迭代时在循环中创建一个新对象。

var return_json = function() {
    var j = [];
    var td;
    for(var i = 1; i < tr.length; i++){
        td = tr[i].getElementsByTagName("td");
        j.push({
            machine: td[0].innerHTML,
            day: td[1].getElementsByTagName("p")[0].innerHTML,
            night: td[2].getElementsByTagName("p")[0].innerHTML
        });
    }
    return j;
};

【讨论】：

【解决方案2】：

尝试在循环中为每个元素初始化 td 和 obj：

var return_json = function(){
        var j = [];
        for(var i=1;i<tr.length;i++){
        var obj = {};
        var td;
            td = tr[i].getElementsByTagName("td");
            obj['machine'] = td[0].innerHTML;
            console.log(obj['machine']);
            obj['day'] = td[1].getElementsByTagName("p")[0].innerHTML;
            obj['night'] = td[2].getElementsByTagName("p")[0].innerHTML;
            j.push(obj);
            console.log(j);
        }
        return j;
    };

    console.log(save_limitation());

【讨论】：

【解决方案3】：

obj.machine 是对td 的引用。分配后，您需要删除指向td 的链接。这应该可以解决它。

for(var i=1;i<tr.length;i++){
    td = {};
    td = tr[i].getElementsByTagName("td");
    obj['machine'] = JSON.parse(JSON.stringify(td));
    console.log(obj['machine']);
    obj['day'] = td[1].getElementsByTagName("p")[0].innerHTML;
    obj['night'] = td[2].getElementsByTagName("p")[0].innerHTML;
    j.push(obj);
    console.log(j);
}

【讨论】：

【解决方案4】：

因为obj 是在循环之外定义的，所以您在每个循环中都将相同的 对象添加到数组中。您将在每次迭代时更新 obj 的属性。在循环内定义 obj 以确保您没有这样做。

var tr = document.getElementById("myTable").getElementsByTagName("tr");

var return_json = function(){
    var j = [];
    for(var i=1;i<tr.length;i++){
        var obj = {};
        var td = tr[i].getElementsByTagName("td");
        obj['machine'] = td[0].innerHTML;
        obj['day'] = td[1].getElementsByTagName("p")[0].innerHTML;
        obj['night'] = td[2].getElementsByTagName("p")[0].innerHTML;
        j.push(obj);
    }
    return j;
};

console.log(return_json());

<table id="myTable">
<tr><td>Machine</td><td>Day</td><td>Night</td></tr>
<tr><td>1</td><td><p>1d</p></td><td><p>1n</p></td></tr>
<tr><td>2</td><td><p>2d</p></td><td><p>2n</p></td></tr>
<tr><td>3</td><td><p>3d</p></td><td><p>3n</p></td></tr>
</table>

【讨论】：