-2

コールバックの仕組みがよくわかりません。コードは次のとおりです (行 49 ～ 53 に問題があります。n をディレクトリ内の画像の数と等しくする必要があります): http://pastebin.com/HbALuzGE。onerror コールバックがすぐに発生することを期待しています (play() が私の n 変数を使用する change() を呼び出すため)、そうではありませんが、修正方法がわかりません。

4

1 に答える 1

0

コールバックは、関数を非同期的に実行するためのメソッドまたは方法と考えてください。通常、コールバックの実装は、関数を引数またはパラメーターとして既存の関数に渡すことで構成されます。指定した場合、課された条件が満たされると、この 2 番目の関数が 1 回呼び出されます。これは、最初の関数の実行コンテキストが実行されたことを確認してから、2 番目の関数に渡す場合に役立ちます。このようにして、最初の関数が完全に実行された場合にのみ 2 番目の関数がアクセスされないようにします。

コールバックを使用する最良の例は、サーバー リクエストと時間アニメーションです。これらの場合、関数内で実行されるメソッドが完全に満たされていることを確実にすることが絶対に不可欠です。コールバックを使用する非常に簡単な例を次に示します。

function start(num1, num2, callback) {
    console.log ("Number 1 is: " + num1 + " and Number 2 is : " + num2);
    sum = num1 + num2;
    if (callback) {
        callback(sum);
    }
}

start(8, 2, function(sum) { console.log ("Sum is: " + sum); });

コードを簡素化する必要があると思います。たぶん私は間違っているかもしれませんが、画像カウンターを定義しているときに問題が最後の関数にあると思いますが、関数iに渡すときにonload別の実行コンテキスト/クロージャーを作成しています。

編集

コードを分析すると、次の解決策にたどり着きました。次のような方法で、画像アセット内の画像をループできます。

var images = [...];

for (var i = 0; i< images.length; i++) {
    var img[i] = new Image();
    img[i].onload = (function(img) {    
        return function () {
          // do something here
        }

        img[i].src = images[i];
    })(i);          
}

...または別の方法:

function loadImages(images, callback) {
    var loadedImages = 0;

    for(var i=0; i< images.length; i++) {
      images[i] = new Image();
      images[i].onload = function() {
        if(++loadedImages >= images.length) {
          callback(images);
        }
      };
      images[i].src = images[i];
    }
  }

  window.onload = function(images) {

    var sources = [...]

    loadImages(sources, function(images) {
      // do something
    });
  };

この場合、別の関数に実行を委譲するため、返す関数が重要です。これが助けになることを願っていますが、あなたが何をしようとしているのかがはっきりしていませんでした。

于 2012-08-07T06:25:47.773 に答える