Maison > interface Web > js tutoriel > le corps du texte

Comment puis-je conserver « ce » contexte dans les méthodes prototypes lors de l'utilisation de setTimeout/setInterval en JavaScript ?

Mary-Kate Olsen
Libérer: 2024-10-18 15:02:30
original
594 Les gens l'ont consulté

How Can I Preserve \

Preserving "this" Context in Prototype Methods with setTimeout/setInterval

In Javascript, accessing "this" within a prototype method can become tricky when using setTimeouts or intervals. Unlike in Python, Javascript methods lose their context when passed externally. To overcome this challenge, we explore various solutions.

Anonymous Function Wrapper

The most straightforward approach is to wrap the method call in an anonymous function:

<code class="javascript">var that = this;
setInterval(function(){
    return that.baz();
}, 1000);</code>
Copier après la connexion

This ensures that the method call and access to "this" occur simultaneously, preserving the correct context.

Fat Arrow Function Wrapper (ES6)

For implementations supporting fat arrow functions:

<code class="javascript">setInterval( () =&gt; this.baz(), 1000 );</code>
Copier après la connexion

This concise syntax preserves the context from the surrounding function.

Function Binding

Finally, consider using a binding function like Function.prototype.bind:

<code class="javascript">setInterval( this.baz.bind(this), 1000 );</code>
Copier après la connexion

Alternatively, libraries like Dojo provide methods like "hitch" for context binding.

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!

source:php
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal