Javascript 在循环内部创建变量并在循环外部使用变量时，对我的循环逻辑感到困惑

我的循环计算页面中有多少个图表，然后将这些图表值存储到变量中。我正试图利用这些价值观并将它们附加到我的DOM中

这是我的困境，当我在循环中获取变量时，例如visual_pie_val，它将返回两个值，即20和10。另一方面，如果我在循环外获取它，它将只返回最后一个值，即10

我需要它来返回它们各自的值

例如：

对于visualization-80，需要返回20；对于visualization-81，需要返回10

我还需要确定图表类型，因此，我使用了if语句，如果我像预期的那样将if语句放入循环中，我可以确定类型，但同时，我生成的元素是页面中当前图表数量的两倍，因为它在for循环中

这就是我的代码的样子：

这是我的小提琴，以更好地说明我的问题：

---

我需要建议。谢谢大家!

问题在第14行。将分号替换为逗号，使定义的其余变量成为全局变量。尝试将分号改为逗号，看看是否有效。

感谢您指出这一点，尽管这不是导致问题的原因。第41行将为每个目标输出两个值，而第48行将输出一个值，但这是最后一个值10尝试在循环中记录visual_pie_val的值，在它之前和之后，看看会出现什么。我做到了。我实际上在我的代码上注释了它。在循环内，它将返回2010年，在循环外，它将返回10年

//  CustomVisualizer 

function numAttrs(obj) {
  var count = 0;
  for(var key in obj) {
    if (obj.hasOwnProperty(key)) {
      ++count;
    }
  }
  return count;
}


var visual = visualizer.charts; // contains "visualization-80" and "visualization-81"
    visual_list = [],
    visual_title = [],
    visual_type = [],
    visual_pie_val = [],

    shadow_box = '<div class="percent"></div><div class="inner"></div> <div class="outer"></div>';


// load key
for(var k in visual) visual_list.push(k);


var visual_target  = '#' + visual_list.join(', #');


for (  i = 0; i < numAttrs(visual); i++ ) {

    visual_title[i] = visual[visual_list[i]].settings.title;
    visual_type = visual[visual_list[i]].type; // currently it's "pie"
    visual_pie_val = visual[visual_list[i]].data[0][1]; // "visualization-80" value is 20, "visualization-81" value is 10

    // remove title
    visual[visual_list[i]].settings.title = '';

    if(visual_type == 'pie') {
        $(visual_target).parent().append(shadow_box);
        $(visual_target).parent().find('.percent').append(visual_pie_val) // visual_pie_val will return "2010"
    } else {
        console.log('not pie');
    }

};

$(visual_target).parent().find('.percent').append(visual_pie_val); // visual_pie_val will return "10"