javascript - スコープ外で Ajax から呼び出される変数を使用する

Question

jquery ajax 呼び出しからの戻り値を取得する際に助けが必要です。変数をスコープ外に渡すことができません。タイマー付きの配列に一連の画像があります。最後の画像は、ajax 呼び出しから渡される変数です。

ログ: GET https://domain.com/undefined?6 404 (見つかりません)

ありがとう。

               $(document).ready(function() {

               // slideshow
               var preload = [];
               var i;
               var current = 0;
               var slideshowInterval;
               var instagramInterval;
               var image;

               // instagram
               var settings = {
                  hashtags: "foo",
                  client_id: "", // instagram API key
                  images_to_fetch: 1, // fetch 1 images every request to instagram
               }

               function instagram() {
                  $.ajax({
                     dataType: "jsonp",
                     url: "https://api.instagram.com/v1/tags/" + settings.hashtags + "/media/recent",
                     data: {
                        access_token: null,
                        client_id: settings.client_id,
                        count: settings.images_to_fetch
                     },
                     success: data
                  });

               }

               function data(response) {
                     photos = response.data;
                     console.log("Number of pictures fetched: " + photos.length);
                     for(var i = 0; i < photos.length; i++) {

                        photo = photos[i];
                        image = photo.images.standard_resolution.url; // get photo url
                     }

                     console.log("new instagram image ======> : " + image);                  

                  } // data response


               var path = [ // relative paths of images
                  'images/cat.jpg',
                  'images/fox.jpg',
                  'images/dog.jpg',
                  image // passed variable from ajax
               ];

               //preload images    
               for(i = 0; i < path.length; i++) {
                  preload[i] = new Image();
                  preload[i].src = path[i] + "?";
               }

               function slideshow() {
                  var slideshow = $("#slideshow");

                  slideshow.fadeTo('fast', 0, function() {
                     slideshow.css({
                        'background': 'url(' + preload[current++ % preload.length].src + new Date().getDate() + ')'
                     });
                  }).fadeTo('fast', 1);
               }


               setInterval(instagram, 15000);

               setInterval(slideshow, 15000);

            });