Cómo hacer que el bucle espere hasta que la llamada asincrónica haya tenido éxito antes de continuar

Hola, estoy creando una actualización por lotes para mi tienda local usando for loop y async ajax call.

Mi problema es que mi ciclo continúa a pesar de que mi llamada ajax aún no ha finalizado con éxito.

¿Cómo podemos lograr que la unidad de espera de bucle sea la respuesta de la respuesta ajax antes de continuar el bucle?

Cualquier ayuda es apreciada. ¡¡¡Gracias!!!

A continuación se muestra mi código de muestra:

var counter =0;
var totalRow = 3000;
for (var i = 0, l = totalRow; counter <= l; i++) {

    var defectssurl = 'https://test.com/mywcf.svc/GetListAllPaging?id=' + counter;

    Ext.Ajax.request({
        url: defectssurl,
        method: "POST",
        params: '',
        success: function (resp) {

            console.log("load first 500 records");
            var data = Ext.JSON.decode(resp.responseText); //encode Json List

            if (counter == 0) {
                defectsLocalStore.getProxy().clear();
                // Also remove all existing records from store before adding
                defectsLocalStore.removeAll();
            }

            Ext.Array.each(data, function (record) {
                counter = counter + 1;
                defectsLocalStore.add(record);
            });

            defectsLocalStore.sync(); // The magic! This command persists the records in the store to the browsers localStorage

            //records is now same as the total records
            if (counter >= totalRow) {
                pCallback();
            }

            //continue loop
        },
        headers: {
            'Content-Type': 'application/json; charset=utf-8'
        },
        failure: function (resp) {

        }
    });

}

Respuestas a la pregunta(1)

Su respuesta a la pregunta