Question

我的for循环仅打印最后一次迭代。

将document.getElementById("alert").innerHTML = str;移入和移入for循环。

HTML（放在javascript代码之后）

<p id="alert" style="color: white"></p>

JavaScript

function execute() {
    return gapi.client.directory.chromeosdevices.list({
        "customerId": "my_customer"
    }).then(function(response1) {
        // Handle the results here (response.result has the parsed body).
        var str = "";
        var i;
        for (i = 0; i < 5; i++) {
            var obj = response1.result
            var obj2 = obj.chromeosdevices[i];
            var str = JSON.stringify(obj2.model);
            str += "The number is " + i + "<br>";
        }
        document.getElementById("alert").innerHTML = str;           
    },
    function(err) { console.error("Execute error", err); });
}

输出：

"Acer Chromebook 11 (C740)"The number is 4

想要的输出



"Acer Chromebook 11 (C740)"The number is 0
"Acer Chromebook 11 (C740)"The number is 1
"Acer Chromebook 11 (C740)"The number is 2
"Acer Chromebook 11 (C740)"The number is 3
"Acer Chromebook 11 (C740)"The number is 4

Answer 1

使用赋值运算符（=）替换先前存储在变量中的所有值。因此，当您遍历循环并击中var str = JSON.stringify(obj2.model)行时，str中的所有先前值都会被替换。因此，一旦您退出循环，只会进行最后一次分配。此外，使用var的方式是不正确的。 var在函数范围内声明变量。循环之前的var str = ''声明定义了变量，因此var str inside 循环无效，尽管引擎正在原谅并且仅在旧值的顶部进行赋值。如今，当var和let这样不太令人困惑的替代方法可用时，您应该很少使用const。

就像@CertainPerformance所说的那样，执行一堆赋值语句使代码难以遵循，因为您必须在脑海中仔细看一下变量中内容的历史。像这样的代码会更干净一些，因为它不会重新分配很多时间。注意我也在使用更现代的JS（不兼容IE），因此如果您不能使用async / await，请忽略该更改：

async function execute() {
    try {
      const { result } = await gapi.client.directory.chromeosdevices.list({
        "customerId": "my_customer"
      });

      const alertDiv = document.getElementById("alert");
      for (let i = 0; i < 5; i++) {
        const { model } = result.chromeosdevices[i];
        const line = `Device ${i} has model ${JSON.stringify(model)}`;
        alertDiv.appendChild(document.createTextNode(line)); // Safely encode text
        alertDiv.appendChild(document.createElement('br'));
      }
    } catch (err) { 
      console.error("Execute error", err); 
    }
}

仅循环打印最后一次迭代

1 个答案: