Error en Javascript al tratar de recorrer un objeto y por consola se muestra "undefined"

Question

No logro encontrar el error de por qué, si el código funciona, me pinta error en consola:

Uncaught ReferenceError: CLIENTE is not defined
at main.js:27

Al parecer estoy recorriendo mal la constante CLIENTE, la cual en realidad almacenaría un objeto instanciado.

function Cliente(nombreClienteParam, apellidoClienteParam, telClienteParam, mailClienteParam) {
  this.nombre = nombreClienteParam;
  this.apellido = apellidoClienteParam;
  this.tel = telClienteParam;
  this.mail = mailClienteParam;
}

document.write("<ul>");

for (let indice = 1; indice <= 3; indice++) {
  let nombre = prompt("Ingresa tu nombre");
  let apellido = prompt("Ingresa tu apellido");
  let tel = prompt("Ingresa tu telefono");
  let mail = prompt("Ingresa tu mail");

  const CLIENTE = new Cliente(nombre, apellido, tel, mail);

  document.write("<ul>");
  document.write("<li>" + CLIENTE.nombre + "</li>");
  document.write("<li>" + CLIENTE.apellido + "</li>");
  document.write("<li>" + CLIENTE.tel + "</li>");
  document.write("<li>" + CLIENTE.mail + "</li>");
  document.write("</ul>");
}

for (const propiedades in CLIENTE) {
  console.log(propiedades);
}

score 1 · Answer 1 · answered Oct 14 '21 at 05:23

Hay que cambiar el document.write por document.body.appendChild.

Si se agrega el ul con write provoca una redirección:

document.write ("<ul>");

La URL redireccionada es la siguiente:

wyciwyg://1/file:///...

Eso hace que interrumpa el script... Por eso hay que usar appendChild y createElement.

Nota: Usar appendChild también evita la pérdida de eventos del ratón y teclado.

Código:

function Cliente(nombre) {
    this.nombre = nombre;
}

var CLIENTE = new Cliente("Juan")

var ul = document.createElement("ul");
var li = document.createElement("li");
li.innerHTML = CLIENTE.nombre
ul.appendChild(li)
document.body.appendChild(ul)

for(var i in CLIENTE){
  console.log(i)
}

score 0 · Answer 2 · answered Oct 14 '21 at 05:58

0

El problema que tienes es que estás definiendo el objecto CLIENTE dentro del bucle for, utilizando const, por lo tanto el objeto solo existe dentro del for. Para solucionarlo, deberías declararlo antes.

También funcionaría si lo declaras como var, aunque no es una buena práctica.

answered Oct 14 '21 at 05:58

Fastigos

94
4

Entiendo lo que me comentas @Fastigos pero eso derivaría el cambiar toda la lógica pues al sacar esa variable y tratar de mantenerla como const tampoco andarían los prompts que está dentro del for y si saco tanto la constante como las otras variables, ya no serviría de nada el for... – OtroMasComoTu Oct 14 '21 at 16:19
A lo que se refiere es a que solo saques `CLIENTE` del for y lo declares con `let`. Solo tienes que hacer una mínima modificación dentro del for -todo lo demás permanece igual- (y de hecho si lo haces el código funciona como se espera) porque efectivamente, estás obteniendo `undefined` porque el scope de `CLIENTE` no es el mismo que el que se usa para leer sus propiedades, ahí no existe `CLIENTE`. Para que tengas un mejor contexto lee acerca de los [scopes](https://developer.mozilla.org/es/docs/Glossary/Scope). – ricardo-dlc Oct 14 '21 at 16:37
Claro, todo eso lo entiendo perfectamente @ricardo-dlc, gracias por tu explicación... pero mi reto es que se mantenga CLIENTE como una constante pero con la misma lógica del for... por eso me refería a que quizás deba plantearme otra lógica para que eso suceda pues veo imposible hacerlo tal como está. – OtroMasComoTu Oct 14 '21 at 17:04
Entonces valdria la pena, que especifíques ese detalle puesto que en tu pregunta no lo mencionas y si es algo importante para considerar tienes que especificar hasta el más mínimo detalle. Puesto a que en el segundo for solo se muestran las props de la última asignación podrías colocar algún contador que te ayude a identificar si se trata de la última iteración y entonces realizar ese segundo for dentro del primero solo cuando se trate de la última iteración. Otra opción sería guardar esos clientes en un arreglo y luego recorrer ese arreglo (o solo el último) para ver sus props. – ricardo-dlc Oct 14 '21 at 17:36

Error en Javascript al tratar de recorrer un objeto y por consola se muestra "undefined"

2 Answers2