Problem when entering and reading data in JavaScript class

Question

Problem when entering and reading data in JavaScript class

Navigation

#1 by (6 votes)

1

In this fragment of object-oriented programming I must create a single class with a "building" indicator and the properties "name", "description", "address", "data inauguration", "architect" and "cost". Must have methods to consult and modify the mentioned properties, a method constructor of the class (that I intuit that it will be the creation of the function of the class) and, later, create another method that shows in a modal window all the properties. Finally I must create an instance of the previous class and call the method that shows the properties.

Later I added an HTML5 document with the following fragment to call the javascript program with a button.

This is the code I used:

function edificio() {
  this.nombre = nombre;
  this.descripcion = descripcion;
  this.direccion = direccion;
  this.inauguracion = inauguracion;
  this.arquitecto = arquitecto;
  this.coste = 0;
}
edificio.prototype.consultarnombre() {
  return nombre;
}
edificio.prototype.nombrar(nombre) {
  this.nombre = nombre;
}
edificio.prototype.consultardescripcion() {
  return descripcion;
}
edificio.prototype.describir(descripcion) {
  this.descripcion = descripcion;
}
edificio.prototype.consultardireccion() {
  return direccion;
}
edificio.prototype.direccion(direccion) {
  this.direccion = direccion;
}
edificio.prototype.consultarinauguracion() {
  return inauguracion;
}
edificio.prototype.inaugurar(inauguracion) {
  this.inauguracion = inauguracion;
}
edificio.prototype.consultararquitecto() {
  return arquitecto;
}
edificio.prototype.arquitecto(arquitecto) {
  this.arquitecto = arquitecto;
}
edificio.prototype.consultarcoste() {
  return coste;
}
edificio.prototype.precio(coste) {
  this.coste = coste;
}

edificio.prototype.muestra() {
    alert(nombre + ". " + descripcion + ". " + direccion + ". Inaugurado el 
      "+inauguracion+".Creado por "+arquitecto+".Vale "+coste);
    }

    var miedificio = new edificio();
    miedificio.nombrar("Salmon")
    miedificio.muestra();

<p>POO
  <form name="miform">
    <input type="button" name="boton" value="Pulsa para empezar" onClick="javaScript: edificio()">
  </form>
</p>

The problem is that the call to the modal window is not even executed. Neither comes out nor NaN, since at the moment I have not entered any data. How can I solve it?

Neither do I know how I could modify the properties with the methods, that is, enter the data.

javascript poo

asked by J.Adell 03.04.2018 в 13:34

source

1 answer

How to Activate the hidden submit with another button using Javascript? ListView with my images

score 6 · Accepted Answer

You have some mistakes, I must emphasize that some are fundamental. In your html you call the function edificio() , if you see what you have in your js file you will realize that it does nothing except assign values to your properties, which by the way you should initialize them with default values since the constructor does not receive any parameters.

So you should create a function in your html that creates a building instance, set the properties and since you want the poster to show, then call the sample function. And finally the way to assign the functions to the prototype was not correct in your code should be objeto.prototype.function_name = function(){}

function edificio(){
  this.nombre='';
  this.descripcion='';
  this.direccion='';
  this.inauguracion=null;
  this.arquitecto='';
  this.coste=0;
}

edificio.prototype.consultarnombre = function(){
  return nombre;
}
edificio.prototype.nombrar = function(nombre){
  this.nombre=nombre;
}
edificio.prototype.consultardescripcion = function(){
  return descripcion;
}
edificio.prototype.describir = function(descripcion){
  this.descripcion=descripcion;
}
edificio.prototype.consultardireccion = function(){
  return this.direccion;
}
edificio.prototype.direccion = function(direccion){
  this.direccion=direccion;
}
edificio.prototype.consultarinauguracion = function(){
  return this.inauguracion;
}
edificio.prototype.inaugurar = function(inauguracion){
  this.inauguracion=inauguracion;
}
edificio.prototype.consultararquitecto = function(){
  return this.arquitecto;
}
edificio.prototype.arquitecto = function(arquitecto){
  this.arquitecto=arquitecto;
}
edificio.prototype.consultarcoste = function(){
  return this.coste;
}
edificio.prototype.precio = function(coste){
  this.coste=coste;
}

edificio.prototype.muestra = function(){
  alert(this.nombre+". "+this.descripcion+". "+
      this.direccion+". Inaugurado el "+this.direccion+
      ". Inaugurado el "+this.inauguracion+". Creado por "+
      this.arquitecto+". Vale "+this.coste);
}
  
var mi_edificio = function(){
   var ed = new edificio();
   ed.nombrar("Principal");
   ed.precio(2200);
   ed.muestra();
}

<p>POO
		<form name="miform">
			<input type="button" name="boton" value="Pulsa para empezar" 
			onClick="javaScript: mi_edificio();" >
		</form>
		</p>