JavaScript-子元素在使用for循环时被复制

问题：

    let dishes = '';
    let additions = '';

    var msg =  MessageContent.orderedDishes.forEach(function(element) {
      for(var i of element.selectedAdditions){
       additions += i.optionName +
       ' : '
       + i.Name + '\n';
    }

    dishes +=
       'Meal : ' + element.dishName + '\n' +
       'Options : \n' + additions + '\n' +
       'Category : ' +  element.categoryName + '\n' +
       'Qty : ' + element.qty+ '\n' +
       'Price : ' + element.price + '\n\n';
});

我希望得到一个名为

optionName

的子元素（您可以查看下面的JSON数组，以便更清楚地了解发生了什么），这需要我提供一个嵌套的for循环才能得到它。到目前为止，我可以得到；但是，当我尝试将该子元素的值分配给变量（代码部分的第5行）时，问题出现了，而我正在执行以下操作

additions+=I.optionName

，这使得

I.optionName

的值可以排序（一个接一个，类似于数组），子元素将累积，从而显示以下内容：

 Meal : Big Mac
 Options : 
 Normal Ou Maxi ? : Maxi
 Choix du boisson : Fanta Orange
 Choix des frites : Frites steak house
 Category : Menus
 Qty : 1
 Price : 49

 Meal : Chicken McNuggets X6
 Options : 
 //The first block is repeated again which is normal as I used additions +=**
 Normal OR Big ? : Big
 Choix du boisson : Fanta Orange
 Choix des frites : Steak house

 Normal OR Big ? : Normal
 Choix du boisson : Sprite
 Choix des frites : Steak house**
 Category : Menus
 Qty : 1
 Price : 45

简言之，随着父元素的增加，情况变得越来越糟。您可能会说我为什么这样做，答案是因为下面的变量

disks

在这种特殊情况下需要是字符串

当前代码：

    let dishes = '';
    let additions = '';

    var msg =  MessageContent.orderedDishes.forEach(function(element) {
      for(var i of element.selectedAdditions){
       additions += i.optionName +
       ' : '
       + i.Name + '\n';
    }

    dishes +=
       'Meal : ' + element.dishName + '\n' +
       'Options : \n' + additions + '\n' +
       'Category : ' +  element.categoryName + '\n' +
       'Qty : ' + element.qty+ '\n' +
       'Price : ' + element.price + '\n\n';
});

下面是我尝试迭代的JSON数组：

[{
"objectId": "Kakao0MiRE",
"price": 49,
"dishName": "Big Mac",
"categoryName": "Menus",
"selectedAdditions": [{
    "optionName": "Normal Ou Big ?",
    "Name": "Big",
    "Price": 5
}, {
    "optionName": "Drink",
    "Name": "Fanta Orange",
    "Price": 0
}, {
    "optionName": "Fries",
    "Name": "Steak house",
    "Price": 0
}],
"additionalPrice": 5,
"qty": 1
}, {
 "objectId": "kOP90Ld8b9",
 "price": 45,
 "dishName": "Chicken McNuggets X6",
 "categoryName": "Menus",
 "selectedAdditions": [{
    "optionName": "Normal Ou Maxi ?",
    "Name": "Normal",
    "Price": 0
}, {
    "optionName": "Drink",
    "Name": "Sprite",
    "Price": 0
}, {
    "optionName": "Fries",
    "Name": "Frites steak house",
    "Price": 0
}],
 "additionalPrice": 0,
 "qty": 1 }]

---

您的

additions

变量是在对

forEach

的调用之外定义和声明的

当forEach迭代时，可以将值连接到现有的加法值，但每次迭代都不会将其重置为空字符串。这就是为什么您的数据会累积

您可以通过在

forEach

回调的开头将

additions

的值设置为空字符串，或者在

forEach

中声明，以便每次迭代都以空数组开始，来解决此问题。我建议后者：

let dishes = ''; 

var msg = MessageContent.orderedDishes.forEach(function(element) { 
  // declaring your variable here ensures that
  // it is empty at the beginning of the iteration
  // rather than accumulating over all of them:
  let additions = ''; 
  for(var i of element.selectedAdditions){ 
    additions += i.optionName + ' : ' + i.Name + '\n';
  } 
  dishes += 'Meal : ' + element.dishName + '\n'
    + 'Options : \n' + additions + '\n' 
    + 'Category : ' + element.categoryName + '\n'
    + 'Qty : ' + element.qty+ '\n' 
    + 'Price : ' + element.price + '\n\n'; 
});

---

您的

additions

变量是在对

forEach

的调用之外定义和声明的

当forEach迭代时，可以将值连接到现有的加法值，但每次迭代都不会将其重置为空字符串。这就是为什么您的数据会累积

您可以通过在

forEach

回调的开头将

additions

的值设置为空字符串，或者在

forEach

中声明，以便每次迭代都以空数组开始，来解决此问题。我建议后者：

let dishes = ''; 

var msg = MessageContent.orderedDishes.forEach(function(element) { 
  // declaring your variable here ensures that
  // it is empty at the beginning of the iteration
  // rather than accumulating over all of them:
  let additions = ''; 
  for(var i of element.selectedAdditions){ 
    additions += i.optionName + ' : ' + i.Name + '\n';
  } 
  dishes += 'Meal : ' + element.dishName + '\n'
    + 'Options : \n' + additions + '\n' 
    + 'Category : ' + element.categoryName + '\n'
    + 'Qty : ' + element.qty+ '\n' 
    + 'Price : ' + element.price + '\n\n'; 
});

---

太棒了！我不知道为什么我没有看到它！谢谢大家!+1小伙子，你发现这很有帮助：）太棒了！我不知道为什么我没有看到它！谢谢大家!+1Glad您觉得这很有用：）