JavaScript - mostrar datos de un objeto

 
Vista:

mostrar datos de un objeto

Publicado por Sam (106 intervenciones) el 02/12/2015 22:35:58
Hola amigas y amigos, verán estoy intentando hacer que mediante un formulario, poder

introducir datos creando objetos pero no me funciona lo que he programado.

Estoy seguro que el problema está en la manera que intento pasar el valor de las variables: nombre, apellido y ciclo. a los parametros cuando intento crear el nuevo alumno, pero no se como parar los valores de las variables a los parametros del objeto.

si pudieran ayudarme lo agradeceria mucho.

Miren:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<script>
 
    function incluir_alumno(nombre, apellido,ciclo)
 
                            {
                                //Atributos
                                this.nombre = nombre,
                                this.apellido = apellido,
                                this.ciclo = ciclo,
 
    document.getElementById("resultado").innerHTML = nombre + " " + apellido + " " + ciclo;
 
    }
 
 
 
    var nombre = document.getElementById("nombre").value;
 
    var apellido = document.getElementById("apellido").value;
 
    var ciclo = document.getElementById("ciclo").value;
 
 
    var nuevo_alumno = new nuevo_alumno(nombre, apellido, ciclo);
 
    document.write(nuevo_alumno.nombre);
 
    document.write(nuevo_alumno.apellido);
 
    document.write(nuevo_alumno.ciclo);
 
</script>
 
<html>
 
    <input name="nombre" type="text" id="nombre" /></br>
 
            <input name="apellido" type="text" id="apellido" /></br>
 
            <input name="ciclo" type="text" id="ciclo" /></br>
 
 
            <input name="calcular" type="button" onClick="incluir_alumno()" value="incluir alumno" /></br></br>
 
 
            <div id="resultado"></div>
 
 
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Jordi
Val: 4
Ha aumentado su posición en 10 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

mostrar datos de un objeto

Publicado por Jordi (2 intervenciones) el 05/12/2015 12:39:55
Buenas Sam,

Tienes mal el planteamiento del problema. En tu evento onclick estás llamando a la función incluir_alumno() sin ningún parámetro, y la función está tratando de obtener esos parámetros para crear un objeto.

Además, tu llave en la línea 13 cierra la función, con lo que nunca se va a ejecutar el resto del planteamiento. Y en la línea 24 defines un new_alumno(arg1, arg2, arg3), pero no has definido ninguna función new_alumno(arg1, arg2, arg3).

El procedimiento a seguir es:

1) Definir una función (alumno) que actúe como inicializador del objeto que quieres crear (como tu incluir_alumno).
2) Definir otra función (incluir_alumno) que coja los valores de los elementos del formulario y llame a la primera función (alumno) para crear el usuario.
3) Que el evento onclick llame a incluir_alumno.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<script>
 
    function alumno(nombre, apellido, ciclo) {
        // Inicializador del objeto.
		var obj = {
			nombre : nombre,
			apellido: apellido,
			ciclo : ciclo
		}
		return obj;
    }
 
	function incluir_alumno() {
		var nombre = document.getElementById("nombre").value;
		var apellido = document.getElementById("apellido").value;
		var ciclo = document.getElementById("ciclo").value;
 
		// Crea el nuevo alumno
		var nuevo_alumno = alumno(nombre, apellido, ciclo);
 
		// Escribe el nuevo alumno
		document.getElementById("resultado").innerHTML = alumno.nombre + " " + alumno.apellido + " " + alumno.ciclo;
	}
</script>
 
<html>
	<input name="nombre" type="text" id="nombre" /></br>
    <input name="apellido" type="text" id="apellido" /></br>
    <input name="ciclo" type="text" id="ciclo" /></br>
    <input name="calcular" type="button" onclick="incluir_alumno()" value="incluir alumno" /></br></br>
    <div id="resultado"></div>
</html>

Lo primero que hay que tener en cuenta es que javascript no funciona como java. Java trabaja con objetos clase, pero javascript trabaja nativamente con objetos JSON. Estos objetos pueden contener cualquier tipo de atributos y son accesibles en todo momento, como se muestra en el código que he añadido, al crear un objeto alumno.

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
2
Comentar

mostrar datos de un objeto

Publicado por Sam (106 intervenciones) el 07/12/2015 10:27:49
Muchas gracias Jordi por explicarmelo tan bien, ahora lo entiendo.

Pero el ejemplo que me has puesto, cuando meto valores en los inputs,, luego me sale:

"undefined", "undefined", "undefined"

¿?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Jordi
Val: 4
Ha aumentado su posición en 10 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

mostrar datos de un objeto

Publicado por Jordi (76 intervenciones) el 07/12/2015 11:05:19
Buenas,
Me alegro de que lo hayas entendido ;)
Te sale undefined porque estás intentando imprimir alumno.nombre, etc. Es decir, las variables de un objeto que realmente no tiene esos atributos. En este caso la culpa es mía, que te he puesto el código mal. Tienes que imprimir los datos del objeto nuevo_alumno que has creado, no de "alumno" a secas, que no es ninguna variable.

1
document.getElementById("resultado").innerHTML = nuevo_alumno.nombre + " " + nuevo_alumno.apellido + " " + nuevo_alumno.ciclo;
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar