El post que buscas se encuentra eliminado, pero este también te puede interesar

Megapost Manual de Javascript completo parte 1

Manual de Javascript

¿Que es Javascript?

JavaScript es un lenguaje de programación interpretado, dialecto del estándar ECMAScript. Se define como orientado a objetos , basado en prototipos, imperativo, débilmente tipado y dinámico.

Se utiliza principalmente en su forma del lado del cliente (client-side), implementado como parte de un navegador web permitiendo mejoras en la interfaz de usuario y páginas web dinámicas, aunque existe una forma de JavaScript del lado del servidor (Server-side JavaScript o SSJS). Su uso en aplicaciones externas a la web, por ejemplo en documentos PDF, aplicaciones de escritorio (mayoritariamente widgets) es también significativo.

JavaScript se diseñó con una sintaxis similar al C, aunque adopta nombres y convenciones del lenguaje de programación Java. Sin embargo Java y JavaScript no están relacionados y tienen semánticas y propósitos diferentes.

Todos los navegadores modernos interpretan el código JavaScript integrado en las páginas web. Para interactuar con una página web se provee al lenguaje JavaScript de una implementación del Document Object Model (DOM).

Tradicionalmente se venía utilizando en páginas web HTML para realizar operaciones y únicamente en el marco de la aplicación cliente, sin acceso a funciones del servidor. JavaScript se interpreta en el agente de usuario, al mismo tiempo que las sentencias van descargándose junto con el código HTML.

Índice del manual

1: Introducción a Javascript.
2: Sintaxis Básica.
3: Variables.
4: Tipos de datos.
5: Contadores.
6: Conversion entre tipos de datos.
7: Operadores logicos y relacionales.
8: If else.
9: Bucle while.
10: Bucles for.
11: Switch case.
12: Do while.
13: Calculos iterativos.
14: El objeto math, calculos.
15: Variable temporal en javascript.
16: Funciones sin retorno de parametro.
17: Funciones que devuelven parametros.
18: Arrays.
19: Matrices con varias dimensiones.
20: Codigo ascii/unicode y javascript.
21: Buscar una letra en un string.
22: Temporizadores.
23: Introduccion a Javascript y html.
24: Javascript escribiendo en el navegador.
25: Formularios en javascript.
26: Botones en javascript.



1 Introduccion a Javascript

* De todos los servicios que ofrece INTERNET, no cabe duda de que el mas popular es la WWW (World Wide Web).

La WWW no es mas que millones de paginas en formato electronico, con los contenidos y tematicas mas diversas a las que podemos acceder gracias a un ordenador + modem + browser (navegador).

* Una pagina WEB no es mas que un fichero de texto (ASCII), escrito en formato HTML (Hyper Text Markup Language = lenguaje etiquetado de hipertexto).

* HTML es un lenguaje basado en pares de tags (etiquetas). Un tag es un codigo entre <>, si es de apertura o un codigo entre </ > si es de cierre.

Los browsers (navegadores de Internet), son capaces de traducir estas etiquetas (tags) de forma que presentan visualmente la pagina.


* Estructura de un fichero HTML

Basicamente consta de cuatro pares de etiquetas:

<HTML>

<HEAD>

<TITLE>Nuestra primera pagina</TITLE>

</HEAD>

<BODY>

..........................

..........................

..........................

</BODY>

</HTML>

* El par <HTML> y </HTML>

Determina que un fichero sea HTML

* El par <HEAD> y </HEAD>

Determina la cabecera del fichero HTML, que puede contener un título.

* El par <TITLE> y </TITLE>

Encierra el "título": frase de texto que aparecera en el marco del navegador (primera línea), al ejecutar el fichero HTML

* El par <BODY> y </BODY>

Encierra el contenido de la pagina html, es decir lo que se visualizara en el navegador.

Los navegadores (browsers) mas conocidos son:

* Mozilla
* Opera
* Microsoft Internet Explorer

* Ejecuta el "Bloc de Notas", es decir:



Programas

Accesorios

Bloc de Notas

* Escribe:

<HTML>

<HEAD>

<TITLE>PROG000.HTM</TITLE>

</HEAD>

<BODY>

<P>Esto aparecera en el navegador porque es un parrafo</P>

<P>Esto es otro parrafo</P>

<P>Observa lo que aparece en la línea de título</P>

<P>La línea de título es la frase que aparece en el marco

del navegador, línea superior</P>

<P>¿Esta claro para qué sirven los tags P, /P?</P>

</BODY>

</HTML>

* Graba el fichero anterior con el nombre PROG000.HTM en TuCarpeta

* Ejecuta el "Explorador de Windows". Sitúate en TuCarpeta y haz un doble click en PROG000.HTM

De esta forma, se ejecuta el navegador de tu ordenador (supondré que es Internet Explorer) y se "carga" la pagina PROG000.HTM

El navegador nos muestra la pagina HTML "visualmente", para ver su codigo debes hacer:

Menú Ver

Codigo fuente

* La programacion en HTML no tiene ninguna utilidad para un usuario normal, ya que en el mercado existen herramientas que evitan la necesidad de tener que introducir manualmente los "tags": HotMetal, FontPage, Word, etc.

Lo que sí tienen sentido es el estudio de la programacion en JavaScript.

* JavaScript es un lenguaje de programacion creado por la empresa Netscape (creadora de uno de los navegadores mas conocido)

Es el lenguaje de programacion mas utilizado en Internet para añadir interactividad a las paginas Web

* No confundirJavaScript conJava.Java es un lenguaje de programacion de proposito general como lo son C++ oVisual Basic.

* Un programa en JavaScript se integra en una pagina Web (entre el codigo HTML) y es el navegador el que lo interpreta (ejecuta). Es decir JavaScript es un lenguaje interpretado, no compilado (no se genera ningún tipo de fichero objeto o exe).

* Para programar en JavaScript solo necesitamos un editor de texto (utilizaremos el Bloc de Notas del Windows) y un navegador (utilizaremos Microsoft Internet Explorer) para ejecutarlo.

* ¿Porqué JavaScript y no otro lenguaje de programacion?

Porque:

* Es moderno (tiene pocos años)
* Es sencillo (su hermano mayor: Java, es bastante mas complejo)
* Es útil (el desarrollo de Internet, se prevé muy rapido en los proximos años)
* Es barato: solo necesitamos un editor de textos (el "Bloc de Notas" esta incluido en Windows) y un navegador (es gratuito, ya sea "Internet Explorer" o "Mozilla".
* Es visual: permite la moderna "programacion visual" (ventanas, botones, colores, formularios, etc.).

En definitiva: es ideal para un primer curso de introduccion a la programacion.

Y has de tener en cuenta que hay un "dicho" en informatica, que afirma: "Si dominas un lenguaje de programacion, los conoces todos".


2 Sintaxis basica


* Escribe, utilizando el "Bloc de Notas" de Windows, el siguiente programa:

<HTML>

<HEAD>

<TITLE>PROG001.HTM</TITLE>

<SCRIPT LANGUAGE='JavaScript'>

alert('¡Hola Mundo!')

</SCRIPT>

</HEAD>

<BODY>

<P>

Programa 1 en JavaScript

</P>

</BODY>

</HTML>



* Graba el fichero anterior en tu carpeta con el nombre Prog001.htm

* Ejecuta el programa Prog001.htm, es decir:

* Ejecuta el "Explorador de Windows"
* Sitúate en TuCarpeta
* Clic-Click en Prog001.htm

* Estudio del Prog001.htm:

* Un programa "JavaScript" se escribe integrado en una pagina HTML, por lo tanto no es mas que un fichero de texto que contiene una serie de pares de tags correspondientes a la pagina Web, como mínimo el par: <HTML>, </HTML>, ademas del par de tags característico de un programa JavaScript. Dicho fichero se ha de grabar necesariamente con la extension HTM (característica de una pagina HTML).
* Un programa "JavaScript" no es mas que una secuencia de ordenes, que deben terminar en punto y coma, entre los tags:

<SCRIPT LANGUAGE="JavaScript">

y

</SCRIPT>

* En nuestro Prog001.htm, hemos incluido el programa en la cabecera (HEAD) de la pagina, pero podríamos colocarlo en cualquier parte del fichero htm
* Nuestro primer programa JavaScript contiene una única sentencia: alert:""¡Hola Mundo!"

Que "abre" una ventana con el mensaje que tenemos entre comillas.

Al hacer clic en el de la ventana "alert", se acaba el programa JavaScript se encuentra el tag </SCRIPT> y continua ejecutandose la pagina HTML.



* Utilizando el "Bloc de Notas" escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG002.HTM

var nom;

nom=prompt: 'Escribe tu nombre ','Paco'

alert('Mucho gusto '+ nom)

</SCRIPT>

</HTML>

* Grabalo en TuCarpeta con el nombre Prog002.htm

* Ejecútalo varias veces, observando detenidamente lo que sucede.

* Estudio del Prog002.htm

1º) Primera y última línea: <HTML> y </HTML>

Es decir: pagina html mínima que necesitamos para incluir un programa JavaScript.

2º) Segunda y penúltima líneas: <SCRIPT LANGUAGE=.....> y </SCRIPT>, es decir programa en JavaScript

3º) Primera sentencia del programa: // PROG002.HTM

Única línea del programa que no es necesario acabarla con punto y coma.

Todas las líneas que empiezan por // son comentarios para el programador, es decir no forman parte del programa, dicho de otra forma: el navegador si encuentra una línea que empieza por //, la salta.

4º) var nom;

Definimos una variable de nombre nom

5º) nom = prompt: "Escribe tu nombre","Paco"

Aparece un recuadro con un mensaje y un campo donde podemos escribir algo; el mensaje corresponde a lo que escribimos en el primer argumento de la funcion prompt, encerrado entre comillas. El segundo argumento del prompt contiene el valor que aparece por defecto en el campo del cuadro de dialogo.

El valor del prompt es nom, es decir lo que nosotros escribamos en el cuadro sera el valor que tomara la variable nom.

Si no escribimos nada y hacemos click en , el prompt, es decir la variable nom tomara el valor de Paco, porque es el valor que aparece por defecto.

6º) alert('Mucho gusto '+nom)

Aparece un cuadro con el mensaje 'Mucho gusto' y a continuacion el valor de la variable 'nom', que sera lo que hemos escrito en el primer cuadro que nos ha aparecido.

En definitiva:

* La funcion prompt nos permite introducir 'valores', dichos valores se han de guardar en variables, que previamente hemos de declarar con la palabra reservada 'var'
* La funcion 'alert' muestra mensajes y/o valores de variables.



* Utilizando el 'Bloc de Notas del Windows' escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG003.HTM

/*Programa que sirve para calcular

el area de un rectangulo */

var base,altura;

base=prompt('Escribe la base del Rectangulo','')

altura=prompt('Escribe la altura del Rectangulo','')

alert('El area del Rectangulo es = '+(base*altura)

</SCRIPT>

</HTML>



* Grabalo en TuCarpeta con el nombre Prog003.htm

* Ejecútalo varias veces. Sería conveniente utilizar números enteros y también decimales (5.72, 0.531: observa que has de utilizar el punto decimal inglés).

* Si has ejecutado el programa una vez, para volverlo a ejecutar, no es necesario que 'cierres' el navegador, basta que hagas:

Menú Ver

Actualizar

o si quieres ir mas rapido, pulsa la tecla [F5]

* Es importante que tengas claro este programa:

* Declaramos dos variables (var), que necesitamos para introducir la base y la altura del rectangulo, a través de dos 'prompts':

base= prompt......

altura= prompt.....

* Por último necesitamos dos 'alerts' que nos muestre el resultado del programa, que es simplemente el producto base * altura

* El único elemento nuevo que aparece en el Prog003.htm es:

/*Programa que sirve para calcular

el area de un rectangulo */

Todo lo que aparece escrito entre /* y */ no es mas que un comentario para el programador, igual que pasaba con las líneas que empezaban por //

La diferencia entre // y /* */ esta en que esta última forma de incluir un comentario, nos permite colocarlo de forma que ocupe mas de una línea.

variables en javascript

3 Variables

* Declaracion de variables

Una variable se puede declarar en JavaScript, de dos formas:

* Forma Explícita: var nombre Variable;
* Forma Implícita: var nombre Variable= valor;

En el último caso no es imprescindible escribir var, pero es conveniente, ya que de esta forma localizamos rapidamente todas las variables del programa.

El 'JavaScript' es un lenguaje de programacion 'Case Sensitive', esto es: no es lo mismo las mayúsculas que las minúsculas. Es decir, para el JavaScript: pepe es distinto de Pepe y distinto de pEpe.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE=''JavaScript''>

// PROG004.HTM

/* Programa que utiliza una variable explícita

y dos implícitas */

var Expli;

var pi=3.141592;

var radio=7;

Expli=pi*radio*radio;

alert('area del Círculo = '+Expli);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog004.htm

* Ejecútalo

4 Tipos de Datos

Cuando declaramos una variable, ésta no pertenece a ningún tipo de dato en concreto, se dice que es Undefined. Es al asignarle un valor cuando pasa a ser de uno u otro tipo, según el dato que albergue.

Existen 6 tipos de datos:

String: cadenas de texto Object: objetos

Number: valores numéricos Null: nulo

Boolean: true o false Undefined: no definido.

Podemos averiguar el tipo de dato que contiene una variable si utilizamos la funcion incorporada typeof

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE=''JavaScript''>

// PROG005.HTM

var Pepe;

var PEPE='Hola que tal ';

var pepE=75.47;

var pEpe=' ¿Como estas?';

Pepe=PEPE+pEpe;

alert('PEPE='+PEPE);

alert('PEPE es '+typeof(PEPE));

alert('pepE='+pepE);

alert('pepE es '+typeof(pepE));

alert('pEpe='+pEpe);

alert('pEpe es '+typeof(pEpe));

alert('Pepe='+Pepe);

alert('Pepe es '+typeof(Pepe));

</SCRIPT>

</HTML>


* Grabalo en tu carpeta con el nombre Prog005.htm

* Ejecútalo tantas veces como quieras.


El tipo de dato 'String'


En JavaScript los textos se denotan por comillas dobles o comillas simples, pero no ambas a la vez.

Variable1 = 'Pepito'

Variable2 = 'Paquito'

Podemos incluir un caracter de control en una cadena de texto, si utilizamos el llamado caracter de escape que es:

Los caracteres de control mas usados son:

n salto de línea

t tabulador

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG006.HTM

var num;

alert('Hola que tal');

alert('Hola nque tal');

alert('Holat'+'que'+'n'+'tal');

alert('Holan quen tnal');

num=prompt('Escribe un número: ','');

alert('El ndoblen es: n'+(num*2));

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog006.htm

* Ejecútalo, observando detenidamente la accion de n y t

* Si no introducimos un número en el 'prompt', en el 'alert' correspondiente al doble del número, aparecera NaN, que quiere decir que no es un número.

El tipo de datos 'Number'

Podemos guardar indistintamente en una variable number un número entero, decimal, positivo o negativo.

Ejemplos:

var numNatural= 1234;

var numEntero = -479;

var numDecimal = 3.141592;

var numDecimal2 = -0.123;

* Bases de Numeracion en JavaScript (números enteros)

Por defecto, el sistema de numeracion es el decimal.

* Base Hexadecimal (base 16): anteponemos el prefijo 0X
* Base Octal (base 8): anteponemos un cero

Dígitos del sistema decimal: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9

Dígitos del sistema hexadecimal: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A (que corresponde al 10 en base decimal), B (que corresponde al 11 en decimal), C (12), D (13), E (14), F (15)

Ejemplo:

FF32 en base 16 es 2 + 3*16 + 15*162 + 15*163 = 65330 en sistema decimal

Es decir: 0xFF32 (número en base 16, según notacion de JavaScript) = FF3216 = 6533010

123458 = 5 + 4*8 + 3*82 + 2*83 + 1*84 = 534910

Es decir: 012345 (número en base 8, según notacion de JavaScript) = 123458 = 534910

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE=''JavaScript''>

// PROG007.HTM

var n1=57; // número en base 10

var n2=012345; //base 8, porque empieza por 0

var n3=0xFF32; //base 16, porque empieza por 0x

alert('número decimal= '+n1);

alert('el 12345 en base 8 es en decimal= '+n2);

alert('el FF32 en base 16 es en decimal= '+n3);

/* Observa que al escribir una variable numérica en un 'alert'

siempre nos da el número en decimal,

aunque sea en octal o hexadecimal */

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog007.htm y ejecútalo.


En el programa anterior aparecen 3 "alerts", uno para cada uno de los tres números. No hay ningún problema para incluir los tres "alerts" en uno solo....

* En efecto, escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE=''JavaScript''>

// PROG007b.HTM

var n1=57; // número en base 10

var n2=012345; //base 8, porque empieza por 0

var n3=0xFF32; //base 16, porque empieza por 0x

alert('número decimal= '+n1+'n'+

'el 12345 en base 8 es en decimal= '+n2+'n'+

'el FF32 en base 16 es en decimal= '+n3);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog007b.htm y ejecútalo.

* Observa que la solucion de nuestro problema esta:

* Unir texto (entre comillas) y variables (sin comillas), con el signo "+"

* Cada vez que deseemos un cambio de línea, incluimos "n"

Veamos otra forma de incluir en un "alert" muchos datos ...

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// Prog007bb.htm

var x,y,z;

salida='';

var x1='Pepito Grillo', y1='Paquita Gonzalez';

var num1=37, num2=3.752;

x=prompt('Escribe tu nombre:','');

y=prompt('Escribe tu primer apellido:','');

z=prompt('Escribe tu segundo apellido:','');

salida=salida+'Ahora un alert largo ';

salida=salida+x+y+z;

salida=salida+x1+' '+y1;

salida=salida+num1+' '+num2;

salida=salida+' ,ya me he cansado';

alert(salida);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog007bb.htm y ejecútalo.

* Observa de qué forma acumulamos muchos datos en un solo "alert" (ésta sera la forma de proceder, cuando necesitemos una "salida" con muchos valores):

* definimos una variable "vacía": var salida="";

* acumulamos a la variable salida todo lo que queramos: salida=salida+ lo que sea

* "lo que sea" puede ser una cadena (un texto) o una variable (sea numérica o de texto).

salida=salida + x1 + " " + y1;

salida=salida + "ya me he cansado";

* Para acabar, un solo "alert": alert(salida);

Variables nulas

Cuando una variable no contiene ningún valor, su contenido es nulo

Ejemplo: miVariable = 'Hola';

miVariable= null; // la vaciamos para que no ocupe memoria.

Valores especiales para variables numéricas

NaN: no es un número.

Infinity: infinito, por ejemplo 3/0

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG008.HTM

var var1='Pepe';

var var2='Paquito';

var var3=5/0;

alert('Pepe es '+var1);

alert('Paquito + 2 es ='+(var2+2));

alert('5/0 es ='+var3);

</SCRIPT>

</HTML>


* Grabalo en tu carpeta con el nombre Prog008.htm y ejecútalo.


5 Contadores

Uno de los instrumentos mas utilizados en todo lenguaje de programacion es el llamado contador

Observa:

var x= 10;

x = x+1;

x = x-5;

Declaramos una variable 'x', que es numérica y que inicialmente es 10.

La línea 'x = x+1' es un contador, que hemos de leer: El nuevo valor de 'x' es igual al anterior valor de 'x' mas una unidad. Es decir, que en estos momentos nuestra variable 'x' es igual a 11.

La siguiente línea: 'x = x-5' es otro contador que hemos de leer: el nuevo valor de 'x' es igual al anterior valor de 'x' menos 5 unidades. Es decir, que el valor de la variable 'x' es ahora 11 - 5 = 6

* Haz un programa para comprobar lo que hemos dicho sobre los contadores, es decir:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG009.HTM

var x=10;

alert('El valor inicial de x es '+x);

x=x+1;

alert('Después de x=x+1, x='+x);

x=x-5;

alert('Después de x=x-5, x='+x);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog009.htm y ejecútalo.

6 Conversion entre tipos de datos

* Conversion implícita de tipos

Observa: var var1 = '75';

var var2 = 25;

var var3, var4;

var3 = var1 + var2;

var4 = var2 + var1;

Las varibles var3 y var4 contienen ¿números o textos?

Cuando se suman cadenas de texto con cualquier otra cosa, los otros tipos de datos se convierten en cadenas de texto. Pero si restamos, multiplicamos o dividimos 'cadenas de texto', ¿sucede lo mismo?. Vamos a descubrirlo en los siguientes programas.


* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG010.HTM

var num1='30';

var num2='15';

// Observa que definimos dos cadenas de texto

alert('30+15= '+(num1+num2));

alert('30*15= '+(num1*num2));

</SCRIPT>

</HTML>


* Graba el programa en tu carpeta con el nombre Prog010.htm

* Ejecútalo.

* La conclusion esta clara:

* Si sumamos dos cadenas (aunque contengan números) de texto se produce la concatenacion (union) de los dos textos.
* Si multiplicamos (o hacemos cualquier operacion aritmética que no sea la suma), dos cadenas de texo que en realidad contienen números, se produce una conversion implícita de las cadenas a números y aparece el producto aritmético de los números.

* ¿Qué sucede si introducimos dos números a través de la funcion prompt?. Vamos a verlo:

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

//PROG011.HTM

var num1,num2;

num1=prompt('Escribe un número','');

num2=prompt('Escribe otro número','');

alert('La suma es ='+(num1+num2));

</SCRIPT>

</HTML>


* Grabalo en TuCarpeta, con el nombre Prog011.htm

* Ejecútalo. No funciona como deseamos debido a que el resultado de un prompt, siempre es una cadena de texto.

El problema que tenemos pendiente, es ¿como sumar en JavaScript?

* Conversion explícita de tipos

parseFloat(cadena)

Toma la 'cadena' y la transforma en un número en coma flotante, si es posible.

parseFloat ('123.456') = 123.456

parseFloat ('123ABC') = 123

parseFloat ('ABC') = NaN

parseInt(cadena, número)

Devuelve números enteros, el segundo argumento nos permite escoger la base de numeracion (entre 2 y 36)

parseInt ('ABC',16) = 2748 ABC16 = 274810

Si no especificamos el segundo argumento, por defecto es 10.

Si la cadena empieza por 0x y no existe el segundo argumento, se entiende que es 16.

Si la cadena empieza por 0 y no existe el segundo argumento, se entiende que es 8

toString(argumento)

Si argumento = número

Devuelve una cadena que contiene el número

Puede haber un argumento opcional:

(13).toString(16) ="d" siendo 1310 = d16

(13).toString(2) = "1101" siendo 1310 = 11012

* Vamos a hacer un programa que sume números en JavaScript. Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

//PROG012.HTM

var num1,num2;

num1=prompt('Escribe un número','');

num1=parseFloat(num1);

num2=prompt('Escribe otro número','');

num2=parseFloat(num2);

alert('La suma es ='+(num1+num2));

</SCRIPT>

</HTML>

* Grabalo en TuCarpeta con el nombre Prog012.htm

* Ejecútalo, utilizando números enteros, naturales y decimales.

A partir de este momento hemos de tener claro si los "prompts" corresponden a números enteros, decimales o de texto:

* Si "x" ha de ser un número entero escribiremos:

x = parseInt(prompt("Escribe un número entero",""

* Si "x" ha de ser un número decimal escribiremos:

x = parseInt(prompt("Escribe un número entero o decimal",""

* Si "x" ha de ser una cadena de texto escribiremos:

x = prompt("Escribe el texto correspondiente",""

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// Prog012b.htm

var x,y;

x=parseInt(prompt('Escribe un entero ',''));

y=parseInt(prompt('Escribe otro entero ',''));

alert('La suma de '+ x +' + ' + y +' es =' + (x+y) +'n'+

'El producto de '+ x +' y '+ y +' = '+(x*y)+'n'+

'El promedio de '+ x +' y '+ y +' es '+ (x+y)/2);

</SCRIPT>

</HTML>

* Grabalo con el nombre Prog012b.htm, y ejecútalo.

En el ejercicio Prog007.htm habíamos visto una forma de convertir un número en base 8 o base 16 en base 10. Pero dichos números debíamos de escribirlos implícitamente, es decir en el programa. Nos gustaría hacer un programa que:

* Nos preguntara un número en base 16 (prompt)
* Nos diera como resultado el número anterior pero en base 10

Vamos a ver si lo conseguimos:

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// Prog012bb.htm

var m,n,x;

m=prompt('Escribe un número en base 16','');

n=parseInt(m,16);

alert('El número '+m+' en base 16, es igual a '+n+' en base 10');

</SCRIPT>

</HTML>


* Grabalo con el nombre Prog012bb.htm en tu carpeta y ejecútalo para el número "FF32", a ver si es verdad que nos da "65330" como resultado.

Observa el funcionamiento del programa Prog012bb.htm:

* m = prompt("Escribe un número en base 16", ""

Lo que escribamos (un número en base 16), se guardara en la variable "m" como texto (ya que no hemos puesto ningún "parseInt" ni "parseFloat"

* n =parseInt(m,16)

La variable "n" guardara el número en base 10

Es decir: parseInt(cadena, 16), transforma la "cadena", en nuestro ejemplo un número escrito en base 16, en el correspondiente número (no cadena) pero en base decimal.

Vamos a ver si el procedimiento sirve para cualquier otra base...

Antes de todo veamos unos cuantos números en diferentes bases:

367 = 6 + 3.7 = 27 en base 10

1234 = 3 + 2.4 + 1.42 = 27 en base 10

51346 = 4 + 3.6 + 1.62 + 5.63 = 1138 en base 10


* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// Prog012bbb.htm

var m7,n7;

var m4,n4;

var m6,n6;

m7=prompt('Escribe un número en base 7',''

n7=parseInt(m7,7)

m4=prompt('Escribe un número en base 4',''

n4=parseInt(m4,4)

m6=prompt('Escribe un número en base 6',''

n6=parseInt(m6,6);

alert('El número '+m7+' en base 7, es igual a '+n7+' en base 10n'+

'El número '+m4+' en base 4, es igual a '+n4+' en base 10n'+

'El número '+m6+' en base 6, es igual a '+n6+' en base 10');

</SCRIPT>

</HTML>

* Grabalo con el nombre Prog012bbb.htm y ejecútalo, probandolo con los números anteriores.

Veamos el problema inverso: dado un número en base 10, nos interesa convertirlo a base 7, por ejemplo.

Matematicamente:

Sea 593 un número en base 10:

Megapost Manual de Javascript completo parte 1

59310 = 15057 , porque:

En JavaScript deberíamos hacerlo de la siguiente forma, escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// Prog012bbbb.htm

var m,n;

n=parseInt(prompt('Escribe un número entero en base 10',''));

m=(n).toString(7);

alert('El número '+n+' en base 10, es igual a '+m+' en base 7');

</SCRIPT>

</HTML>

7 Operadores Logicos y Relacionales

>, <, <=, >=

== igualdad

!= diferente

&& y

|| o

! No

8 If else

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG013.HTM

var num;

num=parseFloat(prompt('Escribe un número',''));

if(num==100)

{

alert('El número que has escrito es 100');

}

else

{

alert('El número que has escrito no es 100');

}

if(num>0)

{

alert('El número que has escrito es positivo');

}

else

{

alert('El número es negativo o 0');

}

</SCRIPT>

</HTML>

* Grabalo con el nombre Prog013.htm en TuCarpeta

* Ejecútalo.

* La Estructura de programacion "if-else"

Sintaxis:

if(condicion)

{

sentencia1;

sentencia2;

sentencia3;

}

else

{

sentencia4;

sentencia5;

sentencia6;

}

Significado:

Si se cumple la condicion, se ejecutan las sentencias 1, 2 y 3 y si no se cumple se ejecutan las sentencias 4, 5, 6. La opcion "else" es opcional.

* Observa la diferencia entre "=" y "=="

a = 3*9 es una asignacion, es decir la variable "a" es 27. En cambio if(a==5) es una condicion: si "a" es idéntico a 5 (si el valor de "a" es el número 5)...

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG014.HTM

var a,b;

a=parseFloat(prompt('Escribe el primer número',''));

b=parseFloat(prompt('Escribe el segundo número',''));

if(a==b) alert('Los dos números son iguales');

if(a != b) alert('Los dos números son distintos');

if(a>b)

{

alert('El primer número es mayor que el segundo');

}

else

{

alert('El primer número no es mayor que el segundo');

}

if((a>b) && (100>a))

{

alert('El primero es mayor que el segundo');

alert('Ademas los dos son menores de 100');

}

else

{

alert('El primero no es mayor que el segundo');

alert('O uno de los dos números es mayor o igual a 100');

}

</SCRIPT>

</HTML>

* Grabalo con el nombre Prog014.htm en TuCarpeta.

* Ejecuta el programa para los siguientes casos, observando detenidamente lo que aparece:

1. a=70, b=2
2. a=50, b=30
3. a=7, b=11
4. a=100, b=50
5. a=50, b=100

* Observa:

a==b "a" es igual a "b"

a != b "a" es diferente a "b"

(a>b) && (100>a)

"a" es mayor que "b" y ademas "100 es mayor que -a-"

El else correspondiente a la condicion anterior, sería equivalente a no(a>b) || no(100>a), es decir la negacion de la primera condicion o la negacion de la segunda (o las dos negaciones a la vez).


9 Bucle While(condicion)

{

setencia1;

sentencia2;

sentencia3;

}

Significado:

"Mientras" se cumpla la condicion, se iran repitiendo las sentencias 1, 2 y 3.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG015.HTM

var x=0;

while(x<6)

{

alert('El valor de x es= '+x);

x=x+1;

}

</SCRIPT>

</HTML>

* Grabalo con el nombre Prog015.htm en tu carpeta y ejecútalo.

* Estudio del Prog015.htm

* En "palabras", nuestro programa nos dice: "mientras" la x sea inferior a 6;

escribe el valor de "x";

incrementa en una unidad el valor de "x";

* Al principio x=0

Se cumple la condicion del while: x<6

Aparece escrito x=0

Al pasar por el contador x=1

Se cumple la condicion x<6

Aparece escrito x=1

Al pasar por el contador x=2

Aparece escrito x=2

...

...

Cuando x=6 no se cumple la condicion y por lo tanto se acaba el programa.


4.- Contadores en JavaScript

a=a+1 es equivalente a escribir a++

a=a-1 es equivalente a escribir a—

num=num+2 es equivalente a escribir num += 2

num=num*2 es equivalente a escribir num *= 2

num=num/2 es equivalente a escribir num /= 2

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG016.HTM

var i=2;

var res='';

var j=7;

while (i<j)

{

res=res+' '+i+' '+j+'n';

i++;

j--;

}

alert(res);

</SCRIPT>

</HTML>

* Grabalo con el nombre Prog016.htm en tu carpeta

* Ejecuta el programa, es importante que tengas claro el funcionamiento del Prog016.htm: compara el listado del programa con lo que sucede al ejecutarlo. Observa como conseguimos escribir toda la salida en un único "alert" (variable "res"

Programa que repite un texto cualquiera, el número de veces que queramos, utilizando un "while"

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG017.HTM

var nom;

var indice=1;

var num;

var respuesta=' ';

nom=prompt('Escribe tu nombre','');

num=prompt('Cuantas veces quieres que lo repita','');

num=parseInt(num,10); // era una cadena y ahora es un número

while (indice <= num)

{

respuesta=respuesta+nom+'n';

indice++;

}

alert(respuesta);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog017.htm y ejecútalo

* Recuerda que en el "ParseInt" no es necesario escribir el 10, ya que por defecto (si no lo escribimos), es base 10.





Programa que acumula la suma y el producto de los números que queramos

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG018.HTM

var num;

var sum=0;

var pro=1;

var respuesta='';

num=prompt('Escribe un número diferente de cero=','');

num=parseFloat(num);

while(num != 0)

{

sum=sum+num;

pro=pro*num;

respuesta=respuesta+num+'tsuma parcial:'+sum+'tproducto parcial:'+pro+'n';

num=prompt('Escribe otro número (para acabar introduce cero)','');

num=parseFloat(num);

}

alert(respuesta);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog018.htm y ejecútalo.

* Observa como acumulamos la suma y el producto:

Contador que acumula la suma de los números "num": sum=sum+num;

Hemos de inicializar a 0 la variable "sum".

Contador que acumula el producto de los números "num": pro=pro*num

Hemos de inicializar a 1 la variable "pro".


10 Bucles For

for (contador = valor inicial; condicion; expresion de incremento)

{

...;

...;

...;

}

Ejemplo:

for (i=1;i<=10;i++)

{

sentencia1;

sentencia2;

sentencia3;

}

En palabras significa:

"Desde i=1, hasta i=10 de 1 en 1, repite las sentencias 1, 2 y 3"

Es decir: Repite 10 veces las sentencias 1, 2 y 3

Observa que el contador o índice del "for", en nuestro caso la "i", es una variable que no es necesario declararla, ya que la expresion "i=1" la declara e inicializa.

Programa que repite un texto cualquiera en número de veces que queramos, utilizando un "for"

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG019.HTM

var texto;

var num;

var salida='';

texto=prompt('Escribe un texto','');

num=prompt('Cuantas veces quieres que lo repita','')

num=parseInt(num,10);

for(i=1;i<=num;i++)

{

salida=salida+texto+'n';

}

alert(salida);

</SCRIPT>

</HTML>


* Graba el fichero en tu carpeta, con el nombre Prog019.htm y ejecútalo unas cuantas veces.

Programa que calcula todos los múltiplos de 11 menores de 3000 y por último nos da la suma de todos ellos.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG020.HTM

var salida='';

var sum=0;

for(multi=11;multi<3000;multi=multi+11)

{

salida=salida+multi+' ';

sum=sum+multi;

}

alert(salida+'nLa Suma de todos ellos es= '+sum);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta, con el nombre Prog020.htm y ejecútalo.

Programa que calcula el factorial de un número

Recuerda que el factorial del número "x" es: 1*2*3*4*5*...*x

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG021.HTM

var salida='';

var fact=1;

var num;

num=prompt('Calculo del factorial del numero ','');

num=parseInt(num,10);

for(i=1;i<=num;i++) fact=fact*i;

alert('El factorial de '+num+' es '+fact);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog021.htm y ejecútalo varias veces.

Observa que nuestro "for" no necesita llaves, porque contiene una única sentencia.

Programa que calcula los 10 primeros múltiplos del número que queramos, por último nos da la suma de todos ellos.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG022.HTM

var salida='';

var num;

var mult;

var sum=0;

num=prompt('¿Múltiplos de qué número?','');

num=parseInt(num,10);

for(i=1;i<=10;i++)

{

mult=num*i;

salida=salida+mult+' ';

sum=sum+mult;

}

alert(salida+'nSuma= '+sum);


</SCRIPT>

</HTML>

* Grabalo con el nombre Prog022.htm en tu carpeta y ejecútalo varias veces.

Tabla de valores de la funcion y=x2-5x+10

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG023.HTM

var x1,x2,paso;

var salida='';

var y;

x1=prompt('Escribe el menor valor de x','');

x1=parseFloat(x1);

x2=prompt('Escribe el mayor valor de x','');

x2=parseFloat(x2);

paso=prompt('Escribe el incremento de x:','');

paso=parseFloat(paso);

for(i=x1;i<=x2;i=i+paso)

{

y=i*i-5*i+10;

salida=salida+i+' '+y+'n';

}

alert(salida);

</SCRIPT>

</HTML>



* Graba el fichero en tu carpeta con el nombre Prog023.htm y ejecútalo varias veces.

* Al ejecutar el programa anterior, nos podemos encontrar con una serie de problemas, por ejemplo si introducimos en el valor menor de "x" (x1), un valor que sea mayor que el introducido en la variable x2, o también puede suceder que en la variable paso escribamos un número negativo.

* Vamos a solucionar estos posibles problemas, es decir vamos a "mejorar" el programa anterior.

Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG024.HTM

var x1,x2,paso;

var salida='';

var y;

x1=prompt('Escribe el menor valor de x de la tabla','');

x1=parseFloat(x1);

x2=prompt('Escribe el mayor valor de x de la tabla','');

x2=parseFloat(x2);

if (x1>=x2)

{

alert('No tiene sentido lo que intentas hacer');

}

else

{

paso=prompt('Escribe el incremento de x','');

paso=parseFloat(paso);

if (paso<=0)

{

alert('No tine sentido lo que intentas hacer');

}

else

{

for (i=x1;i<=x2;i=i+paso)

{

y=i*i-5*i+10;

salida=salida+i+' '+y+'n';

}

alert(salida);

}

}

</SCRIPT>

</HTML>

* Grabalo con el nombre Prog024.htm en tu carpeta y ejecútalo, convendría probar los casos x1>=x2 y paso<0

* Observa de qué forma salimos del programa si introducimos datos que no tienen sentido.

11 Switch Case

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG031.HTM

var opc='0';

var num;

while (opc != '10')

{

opc=prompt('Escribe la opcion que desees: (1)El Triple-(2)El Cuadrado-(3)El Logaritmo Neperiano(4)El Seno-(5)El Coseno-(10)SALIR','');

switch(opc)

{

case '1':

num=prompt('Escribe el número','');

num=parseFloat(num);

alert('El triple de '+ num +' es ' +(3*num));

break;

case '2':

num=prompt('Escribe el número','');

num=parseFloat(num);

alert('El cuadrado de '+ num +' es ' +(num*num));

break;

case '3':

num=prompt('Escribe el número','');

num=parseFloat(num);

alert('El Logaritmo Neperiano de '+ num +' es ' +(Math.log(num)));

break;

case '4':

num=prompt('Escribe el angulo en radianes','');

num=parseFloat(num);

alert('El seno de '+ num +' es ' +Math.sin(num));

break;

case '5':

num=prompt('Escribe el angulo en radianes','');

num=parseFloat(num);

alert('El coseno de '+ num +' es ' +Math.cos(num));

break;

}

}

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog031.htm y ejecútalo.

* La estructura "switch-case"

switch(x)

{

case valor 1:

sentencia1;

sentencia2;

...;

...;

break;

case valor 2:

sentencia3;

...;

...;

break;

...

...

...

}

Según el valor que tome la variable "x", se ejecutaran las líneas de programa del "case" correspondientes. Observa que cada "case" termina con "break".

Programa que nos da la 'nota' cualitativa a partir de la cuantitativa

* El programa nos pide el número total de preguntas y el número de respuestas acertadas. A partir de aquí y utilizando la estructura 'switch-case', el programa nos da la 'nota' cualitativa.

* En efecto, escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG031a.HTM

var num,bien,notanum,notacual;

num=parseInt(prompt('Escribe el número total de preguntas',''));

bien=parseInt(prompt('Escribe el número de resouestas acertadas',''));

notanum=parseInt(10*bien/num);

switch(notanum)

{

case 0:

notacual='Muy Deficiente';

break;

case 1:

notacual='Muy Deficiente';

break;

case 2:

notacual='Deficiente';

break;

case 3:

notacual='Deficiente';

break;

case 4:

notacual='Insuficiente';

break;

case 5:

notacual='Suficiente';

break;

case 6:

notacual='Bien';

break;

case 7:

notacual='Notable';

break;

case 8:

notacual='Notable';

break;

case 9:

notacual='Excelente';

break;

case 10:

notacual='Matricula de Honor';

break;

}

alert('La nota cualitativa es '+notacual);

</SCRIPT>

</HTML>

- Grabalo con el nombre Prog031a.htm en tu carpeta y ejecútalo varias veces para comprobar que funciona.


12 Do while

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG032.HTM

var x=1;

var salida='while:n';

while (x<5)

{

x=x+1;

salida=salida+x+'t';

}

salida=salida+'ndo while:n';

x=1;

do

{

x=x+1;

salida=salida+x+'t';

} while (x<5);

alert(salida);

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog032.htm y ejecútalo.

¿Qué diferencia hay entre la estructura while y la do-while?

* Estructura de programacion do-while:

Do

{

sentencia1;

sentencia2;

sentencia3;

} while(condicion);

Mientras se cumpla la condicion, se repetira la ejecucion de las sentencias 1, 2 y 3.

Como la evaluacion de la condicion se efectúa al acabarse el ciclo, el do-while se ejecutara siempre como mínimo una vez. Ésta es la diferencia que hay entre la estructura do-while y la while.

* Para comprobarlo escribe el siguiente programa (aprovecha el Prog032.htm, porque practicamente es el mismo):

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG033.HTM

var x=1;

var salida='while:n';

while (x<5)

{

x=x+1;

salida=salida+x+'t';

}

salida=salida+'ndo while:n';

x=1;

do

{

x=x+1;

salida=salida+x+'t';

} while (x>5);

alert(salida);

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog033.htm y ejecútalo varias veces, comparandolo con el Prog032.htm

13 Calculos iterativos

* La llamada sucesion de FIBONACCI es: 0, 1, 1, 2, 3, 5, 8, 13, ...

Es decir, cada término es igual a la suma de los dos anteriores.

Vamos a "programar" la sucesion de Fibonacci.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG034.HTM

var anterior,ultimo,aux;

anterior=0;

ultimo=1;

var solucion;

solucion='0 - 1';

while (ultimo<=25000000000000)

{

aux=anterior+ultimo;

anterior=ultimo;

ultimo=aux;

if (ultimo>0) solucion=solucion+' - '+ultimo;

}

alert(solucion);

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog034.htm y ejecútalo.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG035.HTM

// Calculo de factoriales

var fin;

var num=2;

var fact;

var solucion='';

fin=prompt('Factoriales hasta el número?','');

fin=parseFloat(fin);

while (num<=fin)

{

fact=1;

for (i=1;i<=num;i++)

{

fact=fact*i;

}

solucion=solucion+' - '+fact;

num++;

}

alert(solucion);

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog035.htm y ejecútalo.


14 El Objeto Math

Nos permite trabajar con funciones matematicas.

Concretamente:

Math.log(x) = ln(x)

Math.exp(x) = ex

Math.sqrt(x) = raiz cuadrada de "x"

Math.pow(a, b) = ab

Math.floor(): número entero mas cercano y menor

Math.ceil(): número entero mas cercano y mayor

Math.round(): redondea al entero mas proximo.

Math.random(): número aleatorio entre 0 y 1

Math.round(y-x)*Math.random()+x: número aleatorio entre "x" e "y".

Math.sin(x)= sin(x) x en radianes

Math.cos(x)= cos(x) x en radianes

Math.tan(x)= tg(x) x en radianes

Math.atan(x)= arctg(x) resultado en radianes

Math.abs(x): valor absoluto de "x"

Math.max(a,b) : maximo valor de los dos

Math.min(a,b): mínimo valor de los dos.

Programa que calcula la hipotenusa de un triangulo rectangulo

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG025.HTM

var cat1,cat2,hipo;

cat1=prompt('Escribe el valor de un cateto','');

cat2=prompt('Escribe el valor del otro cateto','');

cat1=parseFloat(cat1);

cat2=parseFloat(cat2);

hipo=Math.sqrt(cat1*cat1+cat2*cat2);

alert('La hipotenusa del triangulo de catetos '+cat1+' y '+cat2+' es '+hipo);

</SCRIPT>

</HTML>

* Graba el fichero con el nombre Prog025.htm en tu carpeta y ejecútalo unas cuantas veces.

Programa que calcula tantas hipotenusas como queramos

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG026.HTM

var opcion='S';

var cat1,cat2,hipo;

while(opcion=='S' || opcion=='s')

{

cat1=prompt('Escribe el valor de un cateto','');

cat2=prompt('Escribe el valor del otro cateto','');

cat1=parseFloat(cat1);

cat2=parseFloat(cat2);

hipo=Math.sqrt(cat1*cat1+cat2*cat2);

alert('La hipotenusa del triangulo de catetos '+cat1+' y '+cat2+' es '+hipo);

opcion=prompt('¿Quieres calcular otra hipotenusa? (S/N)','');

}

alert('Adios muy buenas');

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog026.htm y ejecútalo.

Programa que resuelve una ecuacion de segundo grado

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG027.HTM

var a,b,c;

var discri;

var x1,x2;

a=prompt('Escribe el coeficiente de la x^2','');

a=parseFloat(a);

b=prompt('Escribe el coeficiente de la x','');

b=parseFloat(b);

c=prompt('Escribe el término independiente','');

c=parseFloat(c);

discri=b*b-4*a*c;

if(discri<0) alert('Soluciones Imaginarias');

if(discri==0)

{

x1=-b/(2*a);

alert('Solucion doble que es '+x1);

}

if(discri>0)

{

x1=(-b+Math.sqrt(discri))/(2*a);

x2=(-b-Math.sqrt(discri))/(2*a);

alert('Las soluciones son = '+x1+' y '+x2);

}

</SCRIPT>

</HTML>


* Graba el programa en tu carpeta con el nombre Prog027.htm

* Ejecútalo para los casos:

a= 1, b= 1, c= 1

a= 2, b=-6, c= -20

a= 1, b= 4, c= 4

Programa que construye una tabla de senos

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG028.HTM

var gra,rad;

var salida='';

for(gra=0;gra<=360;gra=gra+10)

{

rad=3.141592*gra/180;

salida=salida+gra+'tt'+Math.sin(rad)+'n';

}

alert(salida);

</SCRIPT>

</HTML>

* Graba el fichero con el nombre Prog028.htm en tu carpeta y ejecútalo.

Programa que calcula el logaritmo en base cualquiera de un número dado

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG029.HTM

var num;

var opc,base;

num=prompt('Escribe un número positivo','');

num=parseFloat(num);

opc=prompt('1 Logaritmo Neperiano. 2 Logaritmo Decimal. 3 Logaritmo en base anEscribe el número de la opcion','');

opc=parseInt(opc,10);

if(opc==1)

{

alert('El logaritmo Neperiano de '+num+' es '+Math.log(num));

}

if(opc==2)

{

alert('El logaritmo Decimal de '+num+' es '+(Math.log(num)/Math.log(10)));

}

if(opc==3)

{

base=prompt('Introduce el valor de la base a','');

base=parseFloat(base);

alert('El Logaritmo en base '+base+' del número '+num+' es '+(Math.log(num)/Math.log(base)));

}

</SCRIPT>

</HTML>

* Graba el fichero anterior con el nombre Prog029.htm en TuCarpeta y ejecútalo varias veces.

Programa que calcula "potencias"

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG029a.HTM

var bas,exp,resul

bas=parseFloat(prompt('base de la potencia?',''));

exp=parseFloat(prompt('escribe el exponente',''));

resul=Math.pow(bas,exp)

alert(bas+' elevado a '+exp+' es igual a '+resul)

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog029a.htm
* Utiliza el programa anterior para calcular las siguientes expresiones:

23

0.32 4.5291

raíz cuadrada de 2

raíz cúbica de 5.01527

Programa que calcula la raíz enésima de un número

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG029b.HTM

var ind,rad,resul

ind=parseFloat(prompt('índice de la raíz?',''));

rad=parseFloat(prompt('escribe el radicando',''));

resul=Math.pow(rad,1/ind)

alert('La raíz '+ind+' de '+rad+' es igual a '+resul)

</SCRIPT>

</HTML>

* Graba el programa en tu carpeta con el nombre Prog029b.htm
* Utiliza el programa anterior para calcular las siguientes expresiones:

raíz 5-ésima de 32

raíz 7-ésima de 4.7201

raíz 0.5-ésima de 2

Programa que calcula el número "e"

Recuerda que "e" es el límite de la expresion: (1+1/n)n, cuando n tiende a infinito.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG029c.HTM

var cad;

var salida='';

for(i=1;i<=5;i=i+1)

{

cad='n= '+i+'tte= '+Math.pow(1+1/i,i)+'n';

salida=salida+cad;

}

for(i=100;i<=50000000000;i=i*10)

{

cad='n= '+i+'tte= '+Math.pow(1+1/i,i)+'n';

salida=salida+cad;

}

salida=salida+'Verdadero valor de e ='+Math.E

alert(salida);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog029c.htm y ejecútalo.
* Observa que Math.E nos da el número "e" con la maxima precision que admite el JavaScript.

Números Aleatorios

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG029d.HTM

var a;

var x,y;

var salida='';

salida=salida+'5 números aleatorios entre 0 y 1n';

for(i=1;i<=5;i++)

{

salida=salida+Math.random()+'n';

}

salida=salida+'nn5 números aleatorios entre 3 y 7n';

for(i=1;i<=5;i++)

{

salida=salida+(Math.round(7-3)*Math.random()+3)+'n';

}

salida=salida+'nn5 números aleatorios entre 15 y 70n';

for(i=1;i<=5;i++)

{

salida=salida+(Math.round(70-15)*Math.random()+15)+'n';

}

alert(salida);

alert('Vamos a ver 5 números aleatorios entre los dosnque tú quieras');

x=parseFloat(prompt('Escribe el número menor (puede ser decimal)',''));

y=parseFloat(prompt('Escribe el número mayor (puede ser decimal)',''));

salida='';

salida=salida +'5 números aleatorios entre '+x+' y '+y+'nnn';

for(i=1;i<=5;i++)

{

a=Math.round(y-x)*Math.random()+x;

salida=salida+a+'n';

}

alert(salida);

/* Si quieres números aleatorios enteros basta

cambiar los paréntesis de la siguiente forma:

Math.round((y-x)*Math.random()+x) */

salida='';

salida=salida+'150 números enteros aleatorios entre 2 y 17n';

for(i=1;i<=150;i++)

{

salida=salida+Math.round((17-2)*Math.random()+2)+' - ';

}

alert(salida);

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog029d.htm y ejecútalo.

Adivinanzas

Vamos a hacer un programa que nos pregunte un número entero del 1 al 10, y el usuario del programa tiene 5 tentativas para adivinarlo.

* Escribe:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG029e.HTM

var x,num;

var i=0;

var control=0;

x=Math.round(9*Math.random()+1);

while(i<5)

{

i++;

num=parseInt(prompt('Escribe un entero entre 1 y 10, intento '+i,''));

if(num==x)

{

alert('Lo has acertado en '+i+' tentativas');

i=5;

control=1;

}

}

if(control==0)

{

alert('Lo siento pero se han acabado tus 'vidas', el número era '+x);

}

</SCRIPT>

</HTML>

* Grabalo en tu carpeta con el nombre Prog029e.htm y ejecútalo varias veces.
* Observa la utilidad de las variables control y i. Proximamente veremos una forma mas elegante de salir de una estructura while (o for).


15 Variable temporal

En el programa Prog034 ya utilizabamos una variable auxiliar, vamos a hacer otro programa que la utilize.

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG036.HTM

/* Programa que lee la longitud de los 3 lados de un

triangulo y analiza qué tipo de triangulo es: no es triangulo,

equilatero, isosceles, escaleno, rectangulo */

var lado1,lado2,lado3,auxiliar;

var solucion='';

lado1=prompt('Primer lado: ','');

lado1=parseFloat(lado1);

lado2=prompt('Segundo lado: ','');

lado2=parseFloat(lado2);

lado3=prompt('Tercer lado: ','');

lado3=parseFloat(lado3);

// Toma nota del uso de la variable auxiliar

if (lado1>lado2)

{

auxiliar=lado1;

lado1=lado2;

lado2=auxiliar;

}

if (lado3<lado1)

{

auxiliar=lado3;

lado3=lado2;

lado2=lado1;

lado1=auxiliar;

}

if (lado3<lado2)

{

auxiliar=lado2;

lado2=lado3;

lado3=auxiliar;

}

/* Vamos a ver si la ordenacion es la correcta */

solucion=solucion+lado1+'t'+lado2+'t'+lado3+'n';

/* Clasificacion del triangulo */

if (lado3>=lado1+lado2)

{

solucion=solucion+'Esto no es un triangulo';

}

else

{

if ((lado1==lado2)&&(lado2==lado3))

{

solucion=solucion+'Triangulo Equilatero';

}

else

{

if ((lado1==lado2)||(lado1==lado3)||(lado2==lado3))

{

solucion=solucion+'Triangulo Isosceles';

}

else

{

solucion=solucion+'Triangulo Escaleno';

}

if ((lado3<lado1+lado2)&&(lado3*lado3==lado1*lado1+lado2*lado2))

{

solucion=solucion+' ademas Rectangulo';

}

}

}

alert(solucion);

</SCRIPT>

</HTML>

* Graba el programa con el nombre Prog036.htm en tu carpeta, y ejecútalo varias veces.


16 Funciones sin retorno de parametro

* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG039.HTM

alert('Programa que ahora llamara a una funcion');

mediageo();

alert('Se acabo lo que se daba');

/* ¡Atencion!: a continuacion tenemos la funcion */

function mediageo()

{

var a,b;

a=prompt('Escribe un número','');

a=parseFloat(a);

b=prompt('Escribe otro número','');

b=parseFloat(b);

alert('La media geométrica de '+ a +' y '+ b +' es '+Math.sqrt(a*b));

}

</SCRIPT>

</HTML>

* Graba el programa anterior con el nombre Prog039.htm en tu carpeta y ejecútalo varias veces.

* Estudio del Prog039.htm

Estructura de una funcion:

function nombreFuncion()

{

sentencia1;

sentencia2;

...;

...;

}

Se dice que la funcion es sin retorno de parametros, porque no devuelve nada; para que la funcion devuelva un valor, debería haber la instruccion return.

Si una funcion no retorna nada se le denomina también con el nombre de MÉTODO.

Nuestra funcion mediageo(), calcula la media geometrica de dos números. Como no retorna nada, lo que hace en realidad la funcion es "agrupar" en un lugar determinado del fichero HTML, una serie de sentencias que por ellas mismas ya forman un programa, se dice también que es un subprograma.

<HTML>

<SCRIPT LAN....

// Programa Principal

sentencia1;

mediageo(); // llama a la funcion y se ejecuta en este lugar

sentencia2();

// Fin del programa Principal

function mediageo()

{

sentencia3;

...;

....;

}

</SCRIPT>

</HTML>


* Escribe el siguiente programa:

<HTML>

<SCRIPT LANGUAGE='JavaScript'>

// PROG040.HTM

var opc='0';

while (opc != 'T')

{

opc=prompt('Escribe la letra de la opcion deseada: (S) Sumar - (R) Raíz Cuadrada - (L) Logaritmo Neperiano - (A) Ayuda - (T) Terminar','');

if (opc=='S') suma();

if (opc=='R') raiz();

if (opc=='L') logaritmo();

if (opc=='A') ayuda();

}

function suma()

{

var a,b;

a=prompt('Escribe el primer sumando','');

a=parseFloat(a);

b=prompt('Escribe el segundo sumando','');

b=parseFloat(b);

alert('La suma de '+ a +' y '+ b +' es '+(a+b));

}

function raiz()

{

var a;

a=prompt('Escribe el radicando ','');

a=parseFloat(a);

alert('La raíz cuadrada de '+ a +' es '+Math.sqrt(a));

}

function logaritmo()

{

var x;

x=prompt('Escribe un número positivo','');

x=parseFloat(x);

alert('El logaritmo neperiano de '+ x +' es '+Math.log(x));

}

function ayuda()

{

alert('Es bastante tonto que me pidas ayudanpero aquí la tienes:ntPulsa S si quieres sumarntPulsa R para la raíz cuadradantPulsa L para el logaritmo neperianontPulsa A para acceder a la ayudantPulsa T para acabar');

}

</SCRIPT>

</HTML>

* Graba el programa con el nombre Prog040.htm en tu carpeta y ejecútalo unas cuantas veces.

Parte 2

http://www.taringa.net/posts/info/9777887/Megapost-Manual-de-Javascript-completo-parte-2.html

6 comentarios - Megapost Manual de Javascript completo parte 1

supernaut +2
en pdf estaria barbaro!!!
hpinven
esta copiado de un pdf
DJLXLO777
Disculpa amigo, pero podrías subir de nuevo la segunda parte? Me interesa mucho leerla.
Excelente post socio.
Jackrull
Escribir un comentario...
Jackrull
Escribir un comentario...