Comment préserver le contexte « ce » dans « setInterval() » de JavaScript ?

Préserver la référence 'this' dans le gestionnaire setInterval de JavaScript

Lorsque vous travaillez avec la fonction setInterval() de JavaScript, il est courant de rencontrer le "this" problème. Cela se produit lorsque vous devez accéder aux propriétés ou aux méthodes d'un objet à partir de la fonction de gestionnaire d'intervalles.

Considérez le code suivant :

prefs: null,
startup: function() {
  // init prefs
  ...
  this.retrieve_rate();
  this.intervalID = setInterval(this.retrieve_rate, this.INTERVAL);
},

retrieve_rate: function() {
  var ajax = null;
  ajax = new XMLHttpRequest();
  ajax.open('GET', 'http://xyz.example', true);
  ajax.onload = function() {
    // access prefs here
  }
}

Dans cet exemple, nous souhaitons accéder à la propriété prefs. à partir de la fonction de gestionnaire ajax.onload. Cependant, cela ne fonctionne pas comme prévu car la référence this est perdue dans le gestionnaire d'intervalle.

Pour résoudre ce problème, vous pouvez utiliser la méthode bind() pour créer une nouvelle fonction qui lie la référence this. Voici comment :

this.intervalID = setInterval(this.retrieve_rate.bind(this), this.INTERVAL);

En utilisant bind(), nous créons une nouvelle fonction dont la référence this est liée à l'objet d'origine (this). Cela garantit que la propriété prefs est correctement référencée dans le gestionnaire ajax.onload.

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!