Question

我有一个要动态分配给另一个值列表的值列表：

var activeMachines = [41,44,46]

for(i = 0; i < activeMachines.length; i++){
    var temp + activeMachines[i] = document.getElementById("tempData"+activeMachines[i]);
    var humid + activeMachines[i] = document.getElementById("humidData"+activeMachines[i]);
    var time + activeMachines[i] = document.getElementById("timeData"+activeMachines[i]);
 }

我希望实现的是，此循环将总共创建6个新变量：

temp41 = document.getElementById("tempData41");
temp44 = document.getElementById("tempData44");
...

以上操作无效。我读过其他一些建议使用数组的文章，但我认为我需要以某种方式动态创建字典，而且我似乎无法正确地实现这一目的。有什么建议吗？

Answer 1

您可以使用window对象执行此操作，但是，我建议您创建自己的对象，以将那些“变量”作为属性存储在该新key-value对象中。

var activeMachines = [41,44,46]
var obj = {};

for(i = 0; i < activeMachines.length; i++){
    obj['temp' + activeMachines[i]] = document.getElementById("tempData"+activeMachines[i]);
    obj['humid' + activeMachines[i]] = document.getElementById("humidData"+activeMachines[i]);
    obj['time' + activeMachines[i]] = document.getElementById("timeData"+activeMachines[i]);
 }

Answer 2

尝试一下

var activeMachines = [41,44,46];
var output = {};

for(i = 0; i < activeMachines.length; i++){
    output["temp" + activeMachines[i]] = document.getElementById("tempData"+activeMachines[i]);
    output["humid" + activeMachines[i]] = document.getElementById("humidData"+activeMachines[i]);
    output["time" + activeMachines[i]] = document.getElementById("timeData"+activeMachines[i]);
 }

console.log(output);

所有变量均在此variable中定义。像output['temp41']

这样的访问

Answer 3

任何时候，您都难以动态定义变量名时，这表明您应该退后一步，重新考虑数据结构。几乎总是错误的选择，导致难于处理的代码混乱。

在这种情况下，您似乎拥有三个具有id和temp，湿度和时间属性的属性。这正是对象的用途。

例如，您可以将数据表示为：

let data = { machine_41: {temp: 40, humid: 10, time: 200},
             machine_44: {temp: 30, humid: 15, time: 500},
           } // etc

现在所有数据都放在一个位置，您可以使用简单的属性访问它：

 data.machine_41.temp

使用reduce()从数字数组转到该对象很简单：

var activeMachines = [41,44,46]

let data = activeMachines.reduce((obj, machineID) => {
    // some fake data
    temp = 20       // or document.getElementById etc..
    humidity = 10
    time = 600
    obj['machine_'+machineID] = {temp, humidity, time}
    return obj
}, {})
console.log("machine_41 humidity:",data.machine_41.humidity)
console.log(data)

这可能不是您需要的确切数据结构（例如，最好是作为数组），但这种方法比尝试创建一堆单个变量要好。

Answer 4

您可以使用对象并创建属性而不是变量。

var context = {};
for (i = 0; i < activeMachines.length; i++) {
    context[`temp${activeMachines[i]}`] = document.getElementById("tempData"+activeMachines[i]);
}

然后使用context.temp41或context["temp41"]

访问这些数据

使用for循环创建动态变量名称和值：JavaScript

4 个答案: