Javascript 从JSF创建动态选择框

我试图用vanila JavaScript创建几个动态选择框。正如您在下面看到的，我使用json对象和每个选择框的嵌套节点作为选项

我无法使用嵌套的json对象创建for循环

"use strict"

let vars = {

  kagit: {
    abr: "",
    krome: 1,
    fantezi: 6,
    kraft: 5,
    hamur: 4
   },
  ebat: {
    elli: 5,
    yetmis: 76
  },
  laminasyon:{
    parlak:7,
    mat:7
  },
  ondule:{
    bst: 88,
    tst: 0,
    dopez: 7
  },
  kesim:{
    bobst:4,
    pedal:7
  }

}

let optKagit = document.querySelector('.kagit');

let defaultOption = document.createElement('option');
defaultOption.text = 'Lütfen Seçiniz';

optKagit.add(defaultOption);
optKagit.selectedIndex = 0;

let option;
    for (let i = 0; i < vars.kagit.length; i++) {
      option = document.createElement('option');
      option.text = vars.kagit[i];
      option.value = vars.kagit[i][""];
      optKagit.add(option);
    }

“使用严格的”
设变量={
卡吉特：{
abr:“，
克罗姆：1，
范特兹：6，
卡夫：5，
哈穆尔：4
},
ebat：{
埃利：5，
yetmis:76
},
层压：{
帕拉克：7，
mat:7
},
小柱：{
英国标准时间：88，
tst:0，
多佩斯：7
},
凯西姆：{
博斯特：4，
踏板：7
}
}
让optKagit=document.querySelector（'.kagit'）；
让defaultOption=document.createElement（'option'）；
defaultOption.text='Lütfen Seçinizing'；
optKagit.add（defaultOption）；
optKagit.selectedIndex=0；
让选择权；
for（设i=0；i

下面是html代码

<select name="kagit" class="kagit">
      </select>

在“vars.kagit”上带有“for in”的示例：

每个变量上带有“Object.keys”的示例：

for (let i = 0, j = Object.keys(vars), k = j.length; i < k; i++) {
    let iVar = vars[j[i]];
    // and "for in" on each var
    for (let l in iVar) {
        console.log(l, iVar);
    }
}

for（设i=0，j=Object.keys（vars），k=j.length；i

以下是克里斯托夫·吕特扬的线索之后的答案

let option;
for (const [key, value] of Object.entries(vars.kagit)) {
  option = document.createElement('option');
  option.text = key;
  option.value = value;
  optKagit.add(option);
}

---

kagit是一个对象而不是数组。您可以使用Object.keys对其进行迭代。

let option;
for (const [key, value] of Object.entries(vars.kagit)) {
  option = document.createElement('option');
  option.text = key;
  option.value = value;
  optKagit.add(option);
}