Javascript var가 초기에 릴리스되었습니다.

Question

나는 여러 번 사용했지만이 수정의 경우에는 뭔가 빠져있는 것처럼 보입니다. 내가 루프를 완료 한 후 div의 HTML을 업데이트 할 수 있도록 HTML을 추가 할 수있는 기본으로 사용하고있는 var listHTML을 가지고 있지만 루프가 완료되면 var의 값이 NULL 인 이유가 무엇이든간에. 루프가 실행되기 전에 루프 외부의 var에 대한 참조를 작성하면 함수의 결론이 될 때까지 메모리에 유지할 수있을 것이라고 생각했습니다.

코드 : CONSOLE.LOG for 루프, 그것이 내가 기대 적절한 값을 반환 내에서 실행되지만 루프에 대한 외부 함수의 끝에서 하나가 null를 돌려

var listHTML = ''; 

    for(var j = 0; j < arr.length; j++) 
    { 
     var product = arr[j].split(","); 
     var key = product[1]; 

     $.ajax({ 
      url:"http://domain.com/dir/get.php?key="+encodeURIComponent(key), 
      dataType: 'jsonp', 
      success:function(json){ 

       var i = 0; 

       while(json[i]) 
       { 
        listHTML += '<div class="row">'; 
        listHTML += '<div class="image"><img src="'+json[i]["image"]+'"/></div>'; 
        listHTML += '<div class="title">'+json[i]["title"]+'</div>'; 
        listHTML += '<div class="quantity"><input type="number" id="'+key+'" value="'+product[0]+'"/></div>'; 
        listHTML += '<div class="actions"><img src="/_newsite/images/icons/trash.png" onclick="removeFromCart('+"'"+key+"'"+')" title="Remove From Cart/><img src="/_newsite/images/icons/update.png" onclick="updateCart('+"'"+key+"'"+')" title="Update Quantity"/></div>'; 
        listHTML += '</div>'; 

        i++; 
       } 

       console.log(listHTML); 

      }, 
      error:function(){ 
       alert("Error"); 
      }, 
     }); 

    } 

    console.log(listHTML); 

.

Answer 1

함수 완료 후 나중에 ajax success 콜백이 호출됩니다. Ajax의 "A"는 비동기를 나타냅니다.

따라서 함수가 완료되면 listHTML은 수정되지 않았습니다. 성공 콜백 함수 내에 listHTML을 수정하여 거기에 사용하거나 성공 콜백 내에서 호출하는 인수로 다른 함수에 전달해야합니다. 시도하는 방식으로 성공 처리기 외부에서 사용할 수 없습니다.