1

スライド ショーを実行するスクリプトを作成しようとしています。関数ならできるけど、プロトタイプ方式を使いたい。私が理解するのに苦労しているのは、手順です。これが私がやろうとしたことです

var displayVars = {
    slide: '',
    thumb: ''   
}

//setup display
display = function(slide,thumb) {

    displayVars.slide = $(slide);

    displayVars.thumb = $(thumb);

    // set slider width
}

display.prototype.play = function() {

    // move slide to this location

    display.hightlight();
}

display.prototype.hightlight = function() {

    // add border to element
}

$(function() {

    newdis = new display('.show-slide','.window-thumbs');

    displayVars.timer = setTimeout(newdis.play,500);

});

再生機能で気がついたらハイライトメソッドを呼び出したい。私が本当に欲しいのは、再生機能が呼び出されるたびにハイライト機能を実行することです。「display」または「this」ではハイライト機能にアクセスできないため、これがどのように行われるかを理解できません。

4

1 に答える 1

1

問題は、プロトタイプ関数の内部ではなく、タイムアウトハンドラーの設定方法にあります。

displayVars.timer = setTimeout(function() { newdis.play(); }, 500);

this次に、「再生」機能で使用できるようになります。

display.prototype.play = function() {

  // move slide to this location

  this.hightlight();
}

関数とオブジェクトの間に本質的な「メンバーシップ」関係はありません。オブジェクトプロパティは関数を参照できますが、何かを意味するのは、オブジェクトプロパティ参照を介して関数呼び出しが行われたときだけです。関数を呼び出していなかったので、関数への参照を取得して「setTimeout()」に渡すだけなので、の値を設定するものは何もありませんでしたthis。オブジェクト参照を介して明示的に「play」を呼び出す無名関数でラップすることにより、this正しく設定できます。

これを行う別の方法は、新しいブラウザで使用できる「bind()」関数を使用することです。

displayVars.tinmer = setTimeout(newdis.play.bind(newdis), 500);

これは、無名関数とほぼ同じ効果があります(ほとんどの場合、あまり違いがないいくつかの余分な微妙な点があります)。

于 2013-01-23T21:28:40.807 に答える