Métodos Avanzados / Matemática y Formas

Matemática y Formas
(Math & Forms)

Calcula el cuadrado o Raíz Cuadrada

(Calculate the Square or Square Root

Este ejemplo ilustra un poco sobre las habilidades matemáticas de Javascript's. También te muestra como puedes usar una forma para input/output con Javascript sin tener que someter la forma en el servidor.


Entra un número aquí:

Oprime el botón de función para que empiece:

Resultados:


El código te permite crear esta micro-calculadora es:

<form method="POST"   
  
enctype=application/x-www-form-urlencoded>   
  
Enter a number here:    
  
<input name="number" type="INT" size=10 value="0">    
  
<p>   
  
Press button of function to perform:    
  
<input name="sqrt" value="SqrRt" type="BUTTON"   
  
Onclick =   
  
"form.answer.value=Math.sqrt(form.number.value)">   
  
<input name="square" value="x**2" type="BUTTON"   
  
Onclick =   
  
"form.answer.value=Math.pow(form.number.value,2)">   
  
<p>   
  
Result:   
  
<input name="answer" type="INT" value="0"> <br>   
  
</form>                                             
  

Notas:

  1. La etiqueta HTML <form> corresponde al objeto de form de Javascript.
  2. Una forma elemental llamada abc puede ser entrada a través de Javascript como form.abc (si se la da nombre a la forma, digamos (cosa)"stuff" en la etiqueta de la forma <form>, este nombre también puede ser usado para entrar un elemenmto de una forma, ej., stuff.abc.
  3. El valor de algunos elementos, por ejemplo los elementos de textos entrados(input), no solo pueden ser entrados sino que cambiados vía form.abc.value. (De nuevo, el nombre de la forma puede ser usado aquí si lo tuviera.)
  4. <input name="sqrt" value="SqrRt" type="BUTTON"
    Onclick = "form.answer.value=
    Math.sqrt(form.number.value)"
    >
    añade un elemento de forma tipo botón llamado "sqrt" a la forma; "SqrRt" es el nombre del botón. Cuando el botón se oprime Javascript toma el valor del elemento de la forma llamado "número" "number" (i.e., form.number.value) y le pasa el número a Math.sqrt, el sqrt método de objeto de Javascript's Math. El valor devuelto es la raíz cuadrada del argumento. Entonces, es asignado as form.answer.value, preparando el valor del elemento de la contestación ("answer") (encasillado de entrar información [input box]) en la forma.
  5. El Onclick para elbotón llamado cuadrado "square" funciona de forma similar, excepto que pasa el valor entrado en el elemento del número de la forma al método pow del objeto de Math (i.e., to Math.pow). Este objeto tiene dos argumentos y trae como primer argumento al poder del segundo.

Aunque un número puede ser entrado dentro de el elemento del número de la forma (el encasillado del texto llamado (entra un número aquí)"Enter a number here"). Cuando uno de los botones es oprimido, el número del cuadrado o la raíz cuadranda es calculado, dependiendo de cual botón es oprimido. Los resultados del cálculo son mostrados en el encasillado del elemento de la contestación "answer" element (encasillado adyacente a Resultado "Result").

Con un poco más de esfuerzo, puedes crear una calculadora real de Javascript calculator. Y aquí hay una página que utiliza el método de matemáticas de Javascript para convertir números entre deciamles y hexadecimales) convert between decimal and hexadecimal numbers que encuentrarás muy útil, por ejemplo cuando entallas tus páginas a colores.