Check the new version here

Popular channels

JavaScript #1- Creando nuestro primer Script



Hola, Bienvenidos a este nuevo manual, en el cual se explicara los conceptos básicos para programar en JavaScript.

JavaScript, es un lenguaje de programación que se ejecuta en todos los navegadores modernos. Todo el código se descarga en el navegador web y posteriormente se ejecuta del lado del cliente, evitando dejar esta carga en el lado del servidor. Hay que tener este concepto bien claro, ya que JavaScript es muy diferente a los lenguajes que se ejecutan del lado del servidor como PHP, C#(ASP.NET), JAVA, PYTHON, entre otros.

Para empezar a realizar el primer Script, es necesario contar con cualquier editor de texto o un IDE (Entorno de desarrollo integrado). Para desarrollar en HTML5 y JavaScript pueden utilizar Eclipse, Sublime, NetBeans, VisualStudio, Bloc de notas, entre otros.

Eclipse Link Descarga: https://eclipse.org/downloads/

NetBeans Link Descarga: https://netbeans.org/

Sublime Text Lik Descarga: https://www.sublimetext.com/

Una vez tengan instalado el Software de su preferencia, es hora de escribir código.

Ejemplo # 1: Hola Mundo en JavaScript

En este ejemplo se creara un archivo llamado “index.html” el cual tendra todo el codigo para mostrar un mensaje de alerta con la frase “Hola mundo”.


Al ejecutar el codigo, se obtendra el siguiente resultado:



Si observan detenidamente el codigo, solo es necesario tener un conocimiento basico en HTML, creando la cabecera y el cuerpo, agregando un boton con la etiqueta “INPUT” activando el evento “ONCLICK” el cual contendra el codigo JavaScript. En este caso se agrega la sentencia “Alert” que mostrara el mensaje “Hola mundo”.

Ejemplo # 2: Creacion de variables

En JavaScript es muy sencillo la creacion de variables.



Para crear funciones en JavaScript se utiliza la siguiente sintaxis.



Una funcion es basicamente una porcion de codigo la cual se puede invocar desde cualquier parte del contexto en que me encuentre. Una funcion puede tener parametros de entrada y salida(return).

En JavaScript para obtener datos de formularios es muy comun utilizar el DOM(Document Object Model ).DOM permite a los programadores web acceder y manipular las páginas XHTML como si fueran documentos XML. De hecho, DOM se diseñó originalmente para manipular de forma sencilla los documentos XML.



En este ejemplo, se crearan dos cajones de datos de entrada y un boton el cual permitira calcular la suma de dos numeros. Aqui se observaran varios conceptos basicos en la programacion de JavaScript. Si logras entender este ejemplo a la perfeccion, estaras listo para enteder conceptos un poco mas avanzados.



Como se observa en el codigo anterior, se crean dos etiquetas “input” del tipo “text”, el cual permitira pintar en la pagina HTML dos cajones de entrada para el numero 1 y 2. Posteriormente se crea un boton el cual activara la funcion “sumar”, obteniendo los datos de cada uno de los cajones de entrada, llevando consigo los datos necesarios para que la funcion “sumar” realice la suma respectiva mostrando como resultado un mensaje de alerta.

El resultado de la ejecucion es el siguiente:



En la proxima entrada de este Curos basico de JavaScript, veremos como hacer referencia a archivos JS, como crear funciones mas avanzadas y el evento Onclick.

Recuerden seguirnos en Twitter: @toolbrary


Saludos,
0
0
0
2
0No comments yet