javascript - Javascriptスコープとnewarray（）

Question

私はJavaScriptコードのスコープ規則に違反していることを知っており、何が悪いのかを知っていると確信しています。私は自分が間違っていることをする規則やそれを修正する方法を理解していません。

フォトギャラリーを備えたアプリケーションを作成しています。システムは一度に9枚の写真を表示します。ユーザーが新しい写真を見たいときは、画面の右側にある矢印をクリックできます。このアクションは、サーバーにさらに写真を照会し、その後、jsonリストとして返されます。ユーザーが画面の左側にある矢印をクリックすると、以前に見た写真を表示できます。このため、クライアント側のすべての写真URLをキャッシュすることは理にかなっています。

このキャッシュは、photoDataという名前のグローバル変数（悪いことはわかっていますが、JSを理解しておらず、他にどのように機能させるかもわかりません）で行われます。photoDataは、特定の写真が表示された写真のセット（基本的に、ユーザーがこの写真に到達する前に右矢印をクリックした回数）とそのセットに表示されたすべての写真のURLを含む2次元配列です。GetNewPhotos（）関数で写真がphotoDataに正しく入力されるという問題が発生していますが、関数がスコープ外になると、写真は配列を離れます。

コードを投稿する前に、どんな批判も歓迎します。私は2日前にjavascriptを使い始めましたが、うまくいきません。幸い、jQueryがほとんどの作業を行います。

これが私のコードです：

var photoData = new Array();
var currentPhotoSet = 1;
var maxPhotoSet = 1;

//I originally tried using a closure to avoid global variables and it wasn't working properly, but this is still lingering here.
(function() 
{
    $(document).ready(function()
    {
        //Irrelevant functions removed for clarity's sake
        GetNewPhotos();
    });
})();

function GetNewPhotos()
{
    $("#right-arrow").click(function(event) 
    {
        currentPhotoSet++
        if (currentPhotoSet <= maxPhotoSet)
        {
          // Load photos from cache
        }
        else
        {
            $.ajax({
                 type: "POST",
                 url: "/match/",
                 data: {"arrow" : "right", "currentPhotoSet" : currentPhotoSet},
                 dataType: "json",
                 success: function(jsonObject) 
                 { 
                    photoData[currentPhotoSet] = new Array();
                    photoData[currentPhotoSet] = jsonObject;
                 }
            });
        }
        SwapOnscreenPhotos(currentPhotoSet)
    });
}

function SwapOnscreenPhotos(currentPhotoSet)
{
    $("#photo-list img").each(function(index) 
    { 
        $(this).attr("src", photoData[currentPhotoSet][index+1]); 
    }); 
}

したがって、新しいURLはAJAXクエリを実行した後にphotoDataに表示されますが、SwapOnscreenPhotosに到達すると、それらは消え、追加された配列はphotoData内に表示されなくなります。これは、この行と関係があると思いますphotoData [currentPhotoSet] = new Array（）;

このスコープで配列を宣言すると、この関数を終了するとスコープ外になりますか？このデータはphotoDataグローバル変数に属しているため、これは奇妙なことです。この関数の外で新しい配列を宣言する必要があった場合、世界でこれをどのように行うのでしょうか？コンパイル時にAJAXリクエストが何回呼び出されるかわかりません。

ちなみに、サーバー側ではなくクライアント側のレンダリングを行うという私の決定について誰かがコメントを持っているなら、私はそれを聞きたいです。JSONで必要なURLのみを返送するか、画像を含むDOM要素全体を送信してからそれらをキャッシュするかについて議論していました。私はjavascriptが遅いことを知っているので、後者の選択がより良いかもしれません。

お手伝いありがとう！

javascript - Javascriptスコープとnewarray（）

0 に答える 0

Related

Reference