0

flickr ユーザーの最新の 200 枚の写真から 4 枚のランダムな (そして異なる) 写真を表示したいと考えています。コードには 3 つの部分があります

  1. FlickrへのJsonリクエスト【作品】
  2. Javascript 乱数ジェネレーター [ほぼ動作]
  3. Jsonの解析[作品]

flickr から 200 枚の写真をリクエストしたところ、変数 myArray に保存する Json が返されました。この var に対して、乱数 (0 ~ 200) を生成する関数を実行します。splice を使用して、乱数に対応する項目を新しい変数 selArray に保存します。これにより、アイテムが myArray からも削除され、再びランダムに選択されなくなります。この関数は x 回実行されます。x は必要な乱数の量です。この関数は、私がやりたいことを完全には実行しません。コードの最後の部分は Json を解析します。最後の部分自体は、myArray で使用すると機能しますが、selArray では機能しません。

これが問題です。関数 getRandoms が終了すると、selArray には、単に 4 つのオブジェクトを保持するのではなく、それぞれがオブジェクトを保持する 4 つの配列が含まれます。これはコンソールが示すものです:

0 [Object { id="...}]

しかし、私はこれが欲しいです:(これはmyArrayが示すものです)

0 Object { id="...}

それで、ここに私の質問があります: どうすればこれを修正できますか? 私は何を間違っていますか?備考: コードの $.each 部分で item を item[0] に置き換えることで、このコードを機能させることができました。

2 番目の質問です。これは良いコードですか?私は特にパフォーマンス、スピードに興味があります。

<script>
$(document).ready(function(){

    var apikey = '[set api here]';
    var userid = '[set id here]';

    $.getJSON('http://api.flickr.com/services/rest/?&method=flickr.people.getPublicPhotos&api_key='+apikey+'&user_id='+userid+'&per_page=200&format=json&jsoncallback=?',
        function(data){

        // flickr request ok
        if(data.stat == 'ok'){

            var myArray = data.photos.photo;
            var selArray = new Array;

            function getRandoms(number){
                for(var i=0; i < number; i++){
                    var randomNumber = Math.floor(Math.random()*myArray.length);
                    selArray.push(myArray.splice(randomNumber,1));
                }
            }

            // get random numbers 
            getRandoms(4);

            //look at selArray in console
            console.dir(selArray);

            //parse json, this works
            $.each(selArray, function(i,item){
                var purl = 'http://farm' + item.farm + '.static.flickr.com/' + item.server + '/' + item.id + '_' + item.secret + '_s.jpg';
                var container = '<a target="_blank" href="http://www.flickr.com/photos/'+userid+'/'+item.id+'/"><img class="span4" alt="'+item.title+'" src="' + purl + '"/>';
                $(container).appendTo('#images');
            });

        // flickr request problem
        }else{
            console.log(" The request to get the array was not good ");
        }
    });

});
</script>
4

1 に答える 1