Saltar al contenido principal
Codigo Heroe
Tarea anterior
Introducción a los eventos16/21
A la lista de tareas
  1. 1. Eventos del usuario
  2. 2. Añadir un manejador de eventos
  3. 3. Sintaxis de los manejadores
  4. 4. Acciones predeterminadas
  5. 5. Funciones como argumentos
  6. 6. Eliminar clases con classList.remove()
  7. 7. Eventos de teclado
  8. 8. Identificar una tecla
  9. 9. Cerrar una ventana con ESC
  10. 10. Seleccionar los elementos de una galería
  11. 11. Añadir manejadores en un ciclo
  12. 12. Cambiar el src de una imagen
  13. 13. Depurar un manejador
  14. 14. Ámbito local
  15. 15. Ámbito global
  16. 16. Cambiar variables externas
  17. 17. Funciones dentro de funciones
  18. 18. Cierres
  19. 19. Un cierre en cada llamada
  20. 20. Usar cierres en los manejadores
  21. 21. Completar la galería
Siguiente tarea
  • Matriz de skills
  • Cursos
  • Registro
  • Iniciar sesión

Loading…
En unos segundos, estará listo.

  • Teoría
  • Teoría

Cambiar variables externas

Como las variables se buscan desde dentro hacia fuera, podemos reasignar desde fuera una variable que se utiliza dentro de una función.

Imagina que estás en la escuela y por fin llega la hora del almuerzo. Vas al comedor: hoy hay croquetas. ¡Y con puré en lugar de pasta! Comes y vuelves a estudiar. Después de muchas clases y actividades, llega la hora de la cena. Regresas al comedor, pero se acabaron las croquetas. Ahora solo hay apio. No te queda otra que cenar apio. Veamos este ejemplo en código.

var food = 'croquetas con puré';

var eatDinner = function () {
  console.log('Comí ' + food);
};

eatDinner();
// Muestra: Comí croquetas con puré

// Reasignamos la variable food
food = 'apio';

eatDinner();
// Muestra: Comí apio

Al principio, la variable global food valía 'croquetas con puré'. Llamamos a la función y utilizó ese valor porque era el que tenía en ese momento. Después cambiamos food a 'apio'. Al llamar a la función después de la reasignación, utilizó el valor nuevo.

  • script.js
JavaScript
var food = 'empanadas'; var eatDinner = function () { console.log('Comí ' + food); };
Consola

El código ha cambiado, haga clic en "Ejecutar" o active la ejecución automática.

Resultado de la ejecución

ObjetivosRealizado
0
    1. Después de definir eatDinner, llama a la función.
    2. Debajo de esa llamada, reasigna food con el valor 'ensalada de remolacha'.
    3. Debajo, vuelve a llamar a eatDinner.
    Codigo Heroe

    © 2023-2026, codigoheroe.com