Ajax: Call несколько API с циклом

Question

Поскольку мне нужно вызвать бранч данных, чтобы сделать диаграмму, мне нужно позвонить 10 или более различные API, так что я создал функцию как этого

function trend1() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile0").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend2() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile1").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend3() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile2").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend4() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile3").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend5() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile4").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend6() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile5").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend7() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile6").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend8() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile7").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend9() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile8").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

function trend10() { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile9").html(), //getting the api 
    type: 'get', 
    success: function(data) { 

    } 
    }); 
} 

$.when(trend1(), trend2(), trend3(), trend4(), trend5(), trend6(), trend7(), trend8(), trend9(), trend10()).done(function(trend1_data, trend2_data, trend3_data, trend4_data, trend5_data, trend6_data, trend7_data, trend8_data, trend9_data, trend10_data) { 
    //do something        
}) 

Как МАЯ Я помещал этот массивный код в цикл for? ajax позволяет мне это делать?

UPDATE 1:

function trend0()... 
function trend1()... 
function trend2()... 
function trend3()... 
.... 

$.when(trend1(), trend2()).done(function(trend1_data, trend2_data) { 
for (var i = 0; i<N; i++) // with N your n* of cycles 
    eval("trend" + i + "()"); 
} 

}

я делаю что-то вроде ниже?

Решение:

   var i = ""; 
       for (var i=0; i<5; i++) { 
       var trend = function(i) { 
        if ($(".numberOfProfile"+i).length) { 
         return $.ajax({ 
          url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile"+ i).html(), //getting the api 
          type: 'get', 
          success: function(data) { 

          } 
         }); 
        } 
        else 
        { 
         return false; 
        } 
       } 
        i++ 
       } 

Answer 1

---

Важно: Вы не должны писать все функции, так как все они, кажется, так! В будущем будет сложнее поддерживать

Если вы знаете номер класса профилей из существующего массива, вы должны его заколлировать. Если он просто идет от 0 до 10, как выше, вы можете пройти этот путь:

var responses = []; 

for (var i=0; i<10; i++) { 
responses[i] = $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile" + i).html(), 
    type: 'get', 
    success: function(data) { 

    } 
} 

Примечание фактический день ответ будет найден в responses[i]['response'], или скорее responses[i]['responseJSON']

EDIT: с помощью $ .when является хорошая идея, но у вас, похоже, довольно длинный набор аякс-звонков, чтобы сделать так, что я не могу принять окончательные решения, так как я не знаю окончательного приложения. Из приведенных выше примеров было бы так:

var trend = function(profileNo) { 
    return $.ajax({ 
    url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile" + profileNo).html(), 
    type: 'get', 
    success: function(data) { 

    } 
} 

$.when(trend(0), trend(1), ..., trend(10)).done(function(t1, ..., t10) { 
     //handle the results here 
}) 

EDIT2: Я действительно удивлен, что ваше новое решение работает. Ты это пробовал? В этом духе я бы сделал так:

var trend = function(profileNo) { 
     return $.ajax({ 
     url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + $(".numberOfProfile" + profileNo).html(), 
     type: 'get', 
     success: function(data) { 
      //You could also use this callback to assign the retrieved to a "global" variable for instance 
     } 
    }); 
} 

var i=0; 
var responses = []; 

while($(".numberOfProfile"+i).length) { 
    responses[i] = trend(i); 
    i++; 
} 

Answer 2

Если вызов апи одно и то же все время, которое вы можете сделать для петли

for (var i = 0; i<N; i++) // with N your n* of cycles 
    trend(); 
} 

, если они разные, то вы можете сделать что-то (на основании ваш код)

function trend0()... 
function trend1()... 
function trend2()... 
function trend3()... 
.... 

for (var i = 0; i<N; i++) // with N your n* of cycles 
    eval("trend" + i + "()"); 
} 

eval разработает строки как javasc НИИИТ код https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval

Btw на самом деле не выполняет, чтобы сделать что-то вроде этого, я предлагаю вам найти другой способ

Если вы хотите, чтобы вызывать эту функцию на странице загрузки вы можете сделать:

function trend0()... 
function trend1()... 
function trend2()... 
function trend3()... 
.... 

jQuery(document).ready(function(){ 
    for (var i = 0; i<N; i++) // with N your n* of cycles 
     eval("trend" + i + "()"); 
    } 
}); 

или, возможно, при нажатии на действие?

function trend0()... 
function trend1()... 
function trend2()... 
function trend3()... 
.... 

jQuery(document).ready(function(){ 
    jQuery('#myButtonId').click(function(e){ 
     e.preventDefault(); 
     for (var i = 0; i<N; i++) // with N your n* of cycles 
      eval("trend" + i + "()"); 
     } 
    }); 
}); 

Это до вашего приложения логики

Answer 3

Ваш формат кажется фиксированным, поэтому вы можете сделать что-то подобное.

function trend() { 
    var trends = []; 
    for(var i=0;i<10;i++) 
    { 
     var urlX = '/dashboard/getTrend' + '?period=30d' + "&profileId="+$(".numberOfProfile"+i).html(), //getting the api 

     $.ajax({ 
      url: urlX 
      type: 'get', 
      success: function(data) { 
          trends.push(data);  
         } 
       }); 
     } 
} 

$.when(trend()).done(function(trendsData){ 
    // you have all the trends now 
});