D3を使用して連想配列にデータを読み込む

Question

私は値のセットをループし、別のファイル（d3.jsを使用）をjavascript関連配列に読み込もうとしていますが、引数が内部関数に正しく渡されません。例えば：私はこれを実行すると

var reg_list = []; 
var all_region_data = []; 
reg_list[0]="region1"; 
reg_list[1]="region2"; 

// Function to read in data from all regions in reg_list. 
function read_regional_data(region_list) { 
    for (i=0;i<reg_list.length;i++) { 
     region = region_list[i]; 
     console.log("Read data for " + region) // THIS RETURNS REGION1, THEN    
      // REGION2 
     all_region_data[region]=new Array() 
     d3.csv('filepath' + region + '.csv', function(csv){ 
        console.log('reading for ' + region) // THIS RETURNS REGION2 TWICE 
      csv.map(function(x) { 
       all_region_data[region].push(x.cause); 
      }) 
     console.log("Finished Reading Data for " + region) 
     }) 
    } 
} 

は、私は、ループ内の両地域を反復処理が、地域1はd3.csv関数に渡されることはありません。これはd3.csvが非同期に実行されることと関係がありますか？これを避ける方法や改善する方法についての考えは高く評価されます。代わりに、領域にわたって反復するループの

Answer 1

使用再帰 -

var reg_list = [], 
    all_region_data = []; 
reg_list[0]="region1"; 
reg_list[1]="region2"; 

function read_regional_data(i) { 
    var region = reg_list[i]; 
    console.log("Read data for " + region); 
    all_region_data[region]=new Array(); 
    d3.csv('filepath' + region + '.csv', function(csv){ 
     console.log('reading for ' + region); 
     csv.map(function(x) { 
      all_region_data[region].push(x.cause); 
     }); 
     console.log("Finished Reading Data for " + region); 
     if(i < reg_list.length) { 
      read_regional_data(i+1); 
     } 
    }); 
} 
read_regional_data(0);