Bienvenidos a este mini-vídeo
cuyo título es "JavaScript: ejemplo básico".
Mi nombre es Emilio Letón
y pertenezco al departamento de Inteligencia Artificial de la UNED.
En este mini-vídeo
se trata de conocer la sintaxis básica del lenguaje JavaScript,
que es un lenguaje de programación interpretado orientado a objetos,
y que permite que las páginas web sean dinámicas.
A un nivel de ejemplo básico
el código JavaScript se escribe embebido (incorporado)
en el código HTML de una página web.
Para ello hay que tener definida una estructura tipo HTML
dada por la etiqueta de inicio html, ,
y la etiqueta de cierre html, ,
por la etiqueta de inicio head,
y de cierre head,
y por la etiqueta de inicio body,
y de cierre body, .
Para que la página web no esté completamente vacía,
escribiremos en la zona head un título descriptivo
dado por "JS: ejemplo básico",
delimitado por la etiqueta de inicio title (título),
es decir,
y la etiqueta de cierre title, .
También escribiremos un pequeño texto en la zona body
dado por el texto "Una forma sencilla",
delimitado por la etiqueta de inicio p de "paragraph" (párrafo"), ,
y por la etiqueta de cierre p, .
En este momento es bueno parar el mini-vídeo,
grabar el código escrito hasta ahora
en un archivo con extensión htm o html
y abrirlo con un navegador para visualizar lo realizado.
El ejemplo de JavaScript que vamos a estudiar
es el correspondiente a resolver una ecuación de segundo grado.
Una ecuación de segundo grado está dada por la expresión
ax²+bx+c=0.
Por ejemplo, imaginemos que queremos resolver
la ecuación de segundo grado dada por los coeficientes
a=1, b=-1 y c=-2.
Es decir, que queremos resolver x²-x-2=0.
Resolver dicha ecuación
es encontrar el valor o valores de x
que cumple o cumplen la igualdad anterior.
Es conocido que la expresión general
que resuelve una ecuación de segundo grado está dada por x
igual a una fracción, en cuyo numerador aparece -b
más/menos raíz cuadrada del término dado por b²-4ac,
y que en el denominador aparece 2a.
Por lo que en principio habrá dos valores para x
uno x1 correspondiente al más de la raíz
y otro x2 correspondiente al menos de la raíz.
Es conveniente a la hora de aplicar la expresión general
calcular el valor intermedio que se llama discriminante
y que se denota por d,
que corresponde al término de dentro de la raíz dado por b²-4ac.
En nuestro caso d=9.
Por último, haciendo cuentas, x1=2 y x2=-1.
Para implementar el procedimiento anterior con código JavaScript
es conveniente escribir la siguiente sintaxis
en la zona head de la página HTML.
En primer lugar hay que delimitar el código JavaScript
con la etiqueta de inicio script
y la etiqueta de cierre script, .
Hay que tener en cuenta que dentro de la etiqueta de inicio script
tiene que aparecer el atributo type (tipo)
que indica que el script es del tipo javascript,
para ello hay que escribir
Dentro de la zona script, en la primera línea se escribe
var a=1; var b=-1; var c=-2;
Con esto se crea la variable local a
y se almacena en ella el valor de 1,
se crea la variable local b y se almacena en ella el valor de -1
y la variable local c donde se almacena el valor de -2.
A continuación se calcula el valor intermedio d
correspondiente al término de dentro de la raíz
y que se calcula con var d=Math.pow(b,2)-4*a*c,
donde Math es de "Mathematics" (Matemáticas),
pow es de "power" (potencia),
(b,2) indica que la potencia que hay que calcular es b².
Y por último -4*a*c, indica -4 por a por c.
La siguiente línea calcula el valor x1 con
var x1=(-b+Math.sqrt(d))/(2*a),
donde sqrt es de "square root" (raíz cuadrada).
Por último, la línea que calcula el valor de x2 es
var x2=(-b-Math.sqrt(d))/(2*a).
En esta nueva transparencia
aprenderemos cómo escribir los valores calculados x1 y x2.
Para ello, antes de la etiqueta de cierre script
se escribe el literal Soluciones con document.write('Soluciones:')
donde document es documento y write es escribir.
En otra línea se escribe el valor de x1, por ejemplo con
document.write(''+x1+''),
donde y
se han puesto para mejorar la presentación a la hora de escribir x1
y donde el símbolo + indica concatenación.
Por último, otra línea para escribir el valor de x2, por ejemplo con
document.write('x2='+x2),
donde x2
se ha puesto para poder escribir el literal x sub 2.
En este momento es bueno volver a parar el mini-vídeo,
y grabar el código escrito hasta ahora
en un archivo con extensión htm o html
y abrirlo con un navegador para visualizar lo realizado.
Hasta ahora no ha habido problemas
porque la ecuación de segundo grado tenía realmente solución.
Sin embargo, si consideramos la ecuación de segundo grado dada por
a=1, b=-1 y c=2.
al calcular el valor intermedio d obtenemos d=-7
y no se puede calcular la raíz de dicho número.
Esto significa que para la ecuación de segundo grado anterior
no hay soluciones reales.
En esta transparencia vamos a mejorar el código JavaScript
para que no se bloquee en estas situaciones.
Para ello, justo después de calcular el valor de d,
escribimos la siguiente línea alert("El valor de d es: "+d)
para que dé un mensaje de alert (alerta) por pantalla
con el literal del mensaje entre comillas
y concatenando el valor de d.
Después la línea if (d>=0) {
donde if (es un si condicional)
que evalúa si es cierta la condición de si d es mayor o igual que 0,
en cuyo caso se ejecuta el código que venga entre llaves:
en este caso ponemos en las siguientes líneas
todas las líneas del código JavaScript
escrito en anteriores diapositivas,
correspondiente a var x1, a var x2
y a las tres líneas de document.write.
Otra línea con }
para delimitar el código que hay que ejecutar con este if.
A continuación, una nueva línea con
if (d<0) {alert ("No hay soluciones reales")},
que evalúa si es cierta la condición de si d es menor que 0
y a continuación, el código que se ejecuta en ese caso,
es el correspondiente a un alert
avisando que no hay soluciones reales,
en este ejemplo, para la ecuación de segundo grado.
Es conveniente, a veces, escribir comentarios
dentro del código JavaScript
que no afectan al comportamiento del programa,
pero que son útiles para recordar lo que hemos hecho.
Por ejemplo, si queremos escribir
dos líneas de comentarios que nos recuerdan
dónde está recomendado colocar el código JavaScript,
se escriben dos líneas de texto normal.
"Recomendado que el código JavaScript
esté colocado dentro de la zona head"
y se delimitan por la etiqueta de inicio de comentarios JavaScript,
que es /* (en una línea antes de las líneas de los comentarios)
y por la etiqueta de fin de comentarios JavaScript,
que es */ (en una línea después de las líneas de los comentarios).
Para terminar vamos a ver
qué es lo que hemos visto en este mini-vídeo.
Intentad vosotros pararlo
y escribid en esta transparencia lo que hemos visto en él.
Yo voy a seguir, pero, repito, intentad pararlo y hacerlo vosotros.
Hemos visto que el lenguaje JavaScript
se escribe dentro de la zona script.
Que es recomendado escribirlo dentro de la zona head
de una página HTML.
Hemos aprendido funciones matemáticas
Math.pow y Math.sqrt.
Hemos visto cómo se hace una entrada y salida de datos básica.
Los coefientes de entrada los hemos escrito con la ayuda de var
y la salida de datos con la ayuda de document.write.
También hemos visto la sentencia de control if
y mensajes de alert.
Y hemos aprendido a escribir comentarios.
Por último, recordaos que es conveniente ver
la información complementaria en la web asociada a este mini-vídeo.