Maison  >  Article  >  interface Web  >  Comment utiliser correctement le mot-clé « ce » dans le rappel setTimeout de Javascript ?

Comment utiliser correctement le mot-clé « ce » dans le rappel setTimeout de Javascript ?

Barbara Streisand
Barbara Streisandoriginal
2024-10-24 10:37:30393parcourir

How to Use

setTimeout et "this" en JavaScript

Lors de l'utilisation de la fonction setTimeout en JavaScript, il est crucial de comprendre comment le mot-clé this fonctionne dans le fonction de rappel. Dans certains cas, vous pouvez rencontrer une erreur indiquant que la méthode référencée n'est pas définie après un délai d'expiration.

Considérez le code suivant :

<code class="javascript">test.prototype.method = function() {
    // method2 returns image based on the id passed
    this.method2('useSomeElement').src = "http://www.some.url";
    timeDelay = window.setTimeout(this.method, 5000);
};

test.prototype.method2 = function(name) {
    for (var i = 0; i < document.images.length; i++) {
        if (document.images[i].id.indexOf(name) > 1) {
            return document.images[i];
        }
    }
};</code>

Dans cet exemple, la fonction de méthode est appelée avec un délai d'attente de 5 000 millisecondes. Cependant, après le délai d'attente, la fonction method2 n'est plus accessible dans la fonction de rappel. En effet, le mot-clé this fait référence à l'objet global au lieu de l'instance du prototype de test.

Pour résoudre ce problème, vous pouvez lier le mot-clé this à la fonction de rappel avant d'appeler setTimeout. Ceci peut être réalisé en utilisant la méthode .bind(this) :

<code class="javascript">test.prototype.method = function() {
    // method2 returns image based on the id passed
    this.method2('useSomeElement').src = "http://www.some.url";
    timeDelay = window.setTimeout(this.method.bind(this), 5000);
};</code>

En liant le mot-clé this à la fonction de rappel, vous vous assurez que la fonction method2 reste accessible même après l'expiration du délai d'attente.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn