Echa un vistazo a este código.
export default function MyComponent(props){ function interactWithBackend(){ // Uses a library to interact with a backend server // Takes in parameters from this component's state/redux store // Also listens to events and reacts using .on } return ( // Some JSX ) } Ahora suponga que la función se ejecuta al hacer clic en un botón. La función comienza a ejecutarse y, a mitad de camino, cambia el estado del componente. Ahora sé que esta función se redefinirá porque no estoy usando useCallback .
Pero, ¿qué sucede con la instancia de ejecución? ¿Se detiene? ¿O el propio JS tiene una herramienta de programación especial que carga el código una vez invocado, por lo que no importa?
Esta es una pregunta de JS y es irrelevante para Reach, lo mismo puede suceder en Vue o cualquier otra función de JS que cumpla con sus criterios (llamada y luego redefinida).
Cuando se llama a una función JS, se ejecutará inmediatamente si es asíncrona, y no puede suceder nada más hasta que finalice. Entonces, su caso no es posible con una función de sincronización, ya que para cuando Reach note un cambio, la función habrá terminado de ejecutarse. Puede probar esto creando un bucle muy, muy largo con una lógica pesada que bloquee el hilo durante unos segundos.
Si la función es asíncrona , aún se ejecutará, incluso si se redefinió, ya que ya se envió a la cola de funciones JS. Esperará su turno y correrá. La principal diferencia es que la función se puede redefinir antes de que se ejecute (mediante otro código de sincronización).
¿O el propio JS tiene una herramienta de programación especial que carga el código una vez invocado, por lo que no importa?
Eso se llama El bucle de eventos. Una vez que algo entre en él, eventualmente se ejecutará. (Estoy tratando de simplificar un sistema relativamente complejo, así que espero no haberme perdido nada crucial)
https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop