동적으로 빌드 할 때 JSON 객체의 속성에 액세스 할 수 없지만 정적으로 빌드 할 수있는 경우

Question

나는 한 시간 동안이 작업을 해왔으며 도움이 필요합니다. 이것은 나를 어리둥절칩니다. 내 코드에서 개체의 명시 적 설정을 고려

일하고 CASE :

---

var terms={}; 
      terms[0]={}; 
      terms[1]={"label":"bag","cell_src":"images/bag.jpg","clue_type":"audio","clue_src":"/audio/bus.wav"}; 
      terms[2]={"label":"crayon","cell_src":"images/crayon.jpg","clue_type":"audio","clue_src":"/audio/car.wav"}; 
      terms[3]={"label":"pen","cell_src":"images/pen.jpg","clue_type":"audio","clue_src":"/audio/car.wav"}; 
      terms[4]={"label":"pencil","cell_src":"images/pencil.jpg","clue_src":"/audio/boat.wav"}; 
      terms[5]={"label":"pencil_case","cell_src":"images/pencil_case.jpg","clue_src":"/audio/train.wav"}; 
      terms[6]={"label":"rubber","cell_src":"images/rubber.jpg","clue_src":"/audio/taxi.wav"}; 
      terms[7]={"label":"ruler","cell_src":"images/ruler.jpg","clue_src":"/audio/plane.wav"}; 
      terms[8]={"label":"sharpener","cell_src":"images/sharpener.jpg","clue_src":"/audio/taxi.wav"}; 
      window.terms= terms; 
window.terms= terms; // for using globaly 

나는 CONSOLE.LOG을 할 경우 (window.terms [1]); 나는 "가방"을 얻는다. 그게 내가 원하는거야.

명시 적 용어 {}의 값을 정의하는 경우, 대신 CASE

---

작동하지, 내가 JSON 파일에서 내용을 읽어와 같은 각 열거 된 인덱스에 할당 :

var terms={}; 
terms[0]={}; 
$.getJSON('content.json', function(data){ 

    $.each(data,function(i){ 
    //terms[i]={"label":"bag","cell_src":"images/bag.jpg","clue_type":"audio","clue_src":"/audio/bus.wav"}; 
    terms[i+1]={"label":data[i].headword,"cell_src":data[i].image,"clue_type":"audio","clue_src":data[i].audio}; 

    }); 
    window.terms=terms; 
}); 

console.log를 사용하는 경우 (window.terms [1]); "잡히지 않은 TypeError : 정의되지 않은 '1'속성을 읽을 수 없습니다. 참고로 잡아 내려는 값과 함께 뭔가 이상한 일이 생길 가능성을 제거하는 대체 시도가 있습니다. 명시 적으로 모든 색인에 동일한 정적 값을 지정하십시오. 그 같은 오류가 발생합니다.

어떻게 될 수있는 아이디어?

Answer 1

$.getJSON AJAX 호출을 수행 할 때 차단되지 않습니다. 콜백 체인을 라이브 상태로 유지해야합니다.

Answer 2

$.getJSON() 함수는 $.ajax()을 호출하여 JSON 파일을로드하는 것의 축약 형일뿐입니다. AJAX 호출이 비동기 적이기 때문에 데이터가로드되어 변수에 저장되기 전에 $.getJSON()의 실행이 완료되고 코드가 실행 된 후 완료됩니다.

terms과 작업하려면 $.getJSON()에 전달하는 success 콜백 함수를 사용하십시오.

은 당신의 코드는 다음과 같습니다 경우

var terms={}; 
terms[0]={}; 
$.getJSON('content.json', function(data){ 

    $.each(data,function(i){ 
    //terms[i]={"label":"bag","cell_src":"images/bag.jpg","clue_type":"audio","clue_src":"/audio/bus.wav"}; 
    terms[i+1]={"label":data[i].headword,"cell_src":data[i].image,"clue_type":"audio","clue_src":data[i].audio}; 

    }); 
    window.terms=terms; 
}); 

// use window.terms here 

그 다음이 작동하지 않습니다는 // 사용 window.terms 여기 부분이 AJAX 호출이 완료 전에 을 실행하기 때문이다. 당신은 success 콜백에서 해당을 별도의 기능이 이동하고 전화를해야합니다 :

function workWithTerms() { 
    // use window.terms here 
} 

var terms={}; 
terms[0]={}; 
$.getJSON('content.json', function(data){ 

    $.each(data,function(i){ 
    //terms[i]={"label":"bag","cell_src":"images/bag.jpg","clue_type":"audio","clue_src":"/audio/bus.wav"}; 
    terms[i+1]={"label":data[i].headword,"cell_src":data[i].image,"clue_type":"audio","clue_src":data[i].audio}; 

    }); 
    window.terms=terms; 
    workWithTerms(); 
}); 

Answer 3

난 당신이 객체의 배열로 용어를 정의하려는 생각합니다. 현재는 속성 1, 2, 3 등을 가진 객체로 정의되어 있습니다. var terms = {}과 같은 구문은 terms을 의미하고 terms[1] = {"label": "bag"}을 지정하면 "객체 용어 1의 속성은 {"label": "bag"}입니다.그냥이에 용어 선언을 변경 : 난 아무것도 볼 수 없습니다

console.log(terms[2].label);