Buenas tardes. Mediante la presente hago entrega de una posible solución del ejercicio CU01190E del curso JavaScript desde cero.
EJERCICIO
Dado este fragmento de código. Revísalo y responde a las siguientes preguntas:
<!DOCTYPE html>
<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<script type="text/javascript">
var x = 'Hola amigos'; // variable global
function ejemplo(){
alert( x ); // esperamos el valor global
var x;
x = 'Saludos desde Costa Rica'; // redefinimos la variable en contexto local
alert( x ); // esperamos el nuevo valor local
}
</script></head>
<body><div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemplo()"> Probar </div>
</body></html>a) Realiza una prueba pulsando en “Probar”. ¿Qué resultados obtienes? ¿Cómo se explican esos resultados?
En este código tenemos dos varialbes con el mismo nombre, pero una es de ámbito global y la otra de ámbito local. Cuando ejecutamos una función, la misma primero busca las variables de ámbito más cercano a ella, es decir, de ámbito local y posteriormente de ámbito global.
En la primera vez la variable "x" nos aparece como undefined, en la segunda ya podemos saber su valor. Porque el intérprete sólo iza la definición de la variable, pero no su inicialización. Por eso cuando intentamos ver la variable sin inicializarla obtenemos una variable undefined (no nos muestra el valor de la variable global, porque existe una variable local con el mismo nombre, pero no está inicializada, sólo está difinida). Luego, sí se inicializa y podemos obtener su valor.
b) Cambia el código y declara la variable x dentro de la función al mismo tiempo que la inicializas. ¿Qué resultados obtienes? ¿Cómo se explican esos resultados?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Ejemplo aprenderaprogramar.com</title>
<script type="text/javascript">
var x = "Hola amigos"; // variable global
function ejemplo(){
alert(x); //esperamos el valor global
var x = 'Saludos desde Costa Rica'; //redefinimos la variable en contexto local
alert(x); //esperamos el nuevo valor local
}
</script>
</head>
<body>
<div id="cabecera">
<h2>Cursos aprenderaprogramar.com</h2>
<h3>Ejemplos JavaScript</h3>
</div>
<div id="pulsador" style="color: blue;" onclick="ejemplo()">Probar</div>
</body>
</html>El resultado es el mismo, a la primera vez cuando intentamos saber el valor de la variable "x" la misma no está inicializada. La elevación se ha hecho sólo a nivel de definición, pero no de inicialización.
c) De los dos casos anteriores ( a y b ). ¿En cuáles se produce hoisting: en el a), en el b) ó en ambos?
En ambos casos. Tenemos un alert con la variable "x" antes de tu línea de definición, por lo tanto, el intérprete hace una elevación(hoisting) de la variable "x".
d) En este caso, ¿el hoisting está afectando a los resultados obtenidos? ¿Por qué? ¿Cuáles serían los resultados de ejecutar estos códigos si no existiera hoisting?
Sí que afecta, porque si no existiera se produciría un error y el script no funcionaría. Es como si no existiera la variable hasta que no sea definida. Sería lo mismo como escirbir en el código esto:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Ejemplo aprenderaprogramar.com</title>
<script type="text/javascript">
var x = "Hola amigmos"; //variable global
function ejemplo(){
alert(hola);
alert(x); //esperamos el valor global
var x = 'Saludos desde Costa Rica'; //redefinimos la variable en contexto local
alert(x); //esperamos el nuevo valor local
}
</script>
</head>
<body>
<div id="cabecera">
<h2>Cursos aprenderaprogramar.com</h2>
<h3>Ejemplos JavaScript</h3>
</div>
<div id="pulsador" style="color: blue;" onclick="ejemplo()">Probar</div>
</body>
</html>Aquí la variable "hola" ni siquiera está definida. Es lo mismo como si no existiera el hoisting, nos daría un error: "ReferenceError: hola is not defined" y el código no se ejecutaría.
Gracias.
Tema: JavaScript ReferenceError: is not defined hoisting elevación variables CU01190E (Leído 2521 veces)
RSS -
WAP2