테이블 빌드 Javascript 함수로 인해 페이지로드시 오류가 발생합니다.

Question

최근에 특정 폴더의 모든 파일을 포함하는 테이블을 html로 동적으로 만들려고했습니다. 모든 파일의 목록을 포함하는 텍스트 파일을 만들기 위해 배치 파일을 만든 다음 자바 스크립트 함수에서 생성 된 텍스트 파일을 사용하여 테이블을 채우기로 결정했습니다.

기능 showDownloads는 페이지로드라는, 다음과 같은 오류가 발생한다 :

Uncaught TypeError: Cannot read property 'length' of undefined 
    at showDownloads (script.js:8) 
    at onload ((index):9) 

그러나, 나는 콘솔에서 showDownloads()을 실행하면, 제대로 오류를 던지고없이 테이블을 생성합니다.

var downloadPath = "../builds/dev-versions/"; 
var downloads; 

function showDownloads() { 
    getData(); 
    var table = document.getElementById('downloadTable'); 

    for (var i = 0; i < downloads.length; i++) { //Error happens here 
    var row = document.createElement('tr'); 
    for (var j = 0; j < downloads[i].length; j++) { 
     var cell = document.createElement('td'); 
     var file = document.createElement('a'); 
     file.setAttribute('href', downloadPath + downloads[i][j]); 
     file.setAttribute('download', downloads[i][j]); 
     file.innerHTML = downloads[i][j]; 

     cell.appendChild(file); 
     row.appendChild(cell); 
    } 
    table.appendChild(row); 
    } 
} 

function getData() { 
     var xmlhttp; 

     if (window.XMLHttpRequest) { 
      xmlhttp = new XMLHttpRequest(); 
     } 
     else { 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 

     xmlhttp.onreadystatechange = function() { 
      if (xmlhttp.readyState == 4) { 
      var lines = xmlhttp.responseText; 

      intoArray(lines); 
      } 
     } 

     xmlhttp.open("GET", "devFiles.txt", true); 
     xmlhttp.send(); 
} 

function intoArray (lines) { 

    var lineArr = lines.split('\n'); 
    lineArr.pop(); 

    downloads = new Array(lineArr.length/2); 

    var j = 0; 
    for (var i = 0; i < lineArr.length; i += 2) { 
    downloads[j] = [lineArr[i], lineArr[i + 1]]; 
    j++; 
    }; 
} 

은 왜 배열 downloads는 첫 번째 호출시에 정의되지 않은 것으로 간주됩니다?

getData을 호출하면 왜 생성되지 않습니까?

Answer 1

비동기 문제인 경우 for 루프는 getData가 완료 될 때까지 기다리지 않으므로 페이지로드시 다운로드는 여전히 비어 있지만 콘솔에서 시도 할 때마다 다운로드가 완료되어 저장됩니다 다운로드 된 데이터 전역 변수이기 때문에 콘솔에서 실행할 때 이전 데이터 가져 오기에서 실제로 데이터를 처리하고있을 것입니다.