CreativiU: Cursos Online Para Creativos

Curso para aprender javascript básico

¿Quién quiere aprender javascript? ¡Levanten la mano! Para los principiantes que deseen aprender este lenguaje de programación puede ser muy interesante por su integración con el HTML y el desarrollo web.

Foto por Pixabay

Seguramente estás pensando que es algo dificultoso para aprender,  ya que las personas piensan que programar es dificil.

Pero, déjame decirte que nada menos acertado que esos pensamientos porque hoy día muchas personas asumen el reto de aprender este tipo de lenguajes por su cuenta y terminan dominándolo rapidamente.

¡No te lleves por juicios errados!

Por eso, he preparado este curso para aprender javascript y que de esta manera tengas un acercamiento completo de este lenguaje para que dominando las bases puedas profundizar mucho más comprendiendo lo que sucede dentro de él.

Lo primero que debes entender es qué es JavaScript y luego ir entrando en materia y estudiando los fundamentos.

¡Manos a la obra!

Para aprender JavaScript. ¿Qué es JavaScript?

Javascript es un lenguaje dinámico de programación de computadoras. Es ligero y más comúnmente utilizado como parte de las páginas web, cuyas implementaciones permiten que el script del cliente interactúe con el usuario y haga páginas dinámicas.

Es un lenguaje de programación interpretado con capacidades orientadas a objetos. JavaScript fue conocido por primera vez como LiveScript, pero Netscape cambió su nombre a JavaScript, posiblemente debido a la emoción generada por Java.

Se le vio por primera vez con Netscape 2.0 en 1995 con el nombreLiveScript. El núcleo de uso general del lenguaje ha sido incorporado en Netscape, Internet Explorer y otros navegadores web.

JavaScript es un lenguaje de programación ligero e interpretado. Fue diseñado para crear aplicaciones centradas en la red.

JavaScript del lado del cliente es la forma más común del lenguaje. El script debe estar incluido o referenciado por un documento HTML para que el código sea interpretado por el navegador.

Esto significa que una página web no necesita ser un HTML estático, pero puede incluir programas que interactúen con el usuario que controlen el navegador y creen contenido dinámico.

El mecanismo cliente de JavaScript ofrece muchas ventajas sobre los scripts de servidor CGI tradicionales. Por ejemplo, puedes utilizar JavaScript para comprobar si un usuario ha introducido una dirección de correo electrónico válida en un campo de formulario.

El código JavaScript se ejecuta cuando el usuario envía el formulario y solo si todas las entradas son válidas, se enviarían al servidor Web. ¿Excelente, no?

JavaScript puede usarse para atrapar eventos iniciados por el usuario, tales como clicks de botón, navegación de enlaces y otras acciones que un usuario inicie explícita o implícitamente.

Ventajas de JavaScript

Muchas son las ventajas que tiene usar este lenguaje y entre ellas te puedo nombrar:

Menor interacción con el servidor.  Puedes validar la entrada de cualquier usuario antes de enviar la página al servidor. Esto te generará menos tráfico al servidor, lo que significa menos carga para él.

Reacción inmediata.  No tienes que esperar a que se vuelva a cargar la página para ver si se han olvidado de ingresar algo.

Mayor interactividad.  Se pueden crear interfaces que reaccionan cuando el usuario pasa sobre ellas con un ratón o las activa a través del teclado.

Interfaces más variadas.  Puedes utilizar JavaScript para incluir elementos como componentes de arrastrar y soltar deslizantes para proporcionar una interfaz enriquecida a los visitantes del sitio.

Pero, como todo, también tiene limitaciones y no podía dejar se nombrártelas para que sepas de JavaScript

No puedes ver JavaScript como un lenguaje de programación completo. Carece de las siguientes características importantes:

Herramientas de JavaScript

Una de las principales ventajas de JavaScript es que no requiere costosas herramientas para ponerlo en marcha. Puedes comenzar con un simple editor de texto, como el Block de notas. Porque es un lenguaje interpretado dentro del ambiente de navegador web y tampoco necesitas comprar un compilador.

Con el fín de hacer la vida más sencilla, varios vendedores han llegado con excelentes herramientas de edición de JavaScript. Algunas de ellas te las presento aquí:

 Microsoft FrontPage: Microsoft desarrolló un editor para HTML que se ha vuelto muy popular llamado FrontPage. Este editorda a los desarrolladores web múltiples herramientas para JavaScript y así ayudar en la creación de web más interactivas.

 Macromedia Dreamweaver MX: Macromedia Dreamweaver MX es otro editor HTML y JavaScrip cuenta con varios útiles de JavaScript preconfigurados

 Macromedia HomeSite 5: Este es otro editor más de HTML y JavaScript. Es de la casa Macromedia y se puede utilizar para administrar muy facilmente sitios web personales.

Sintaxis del JavaScript

El JavaScript se puede implementar utilizando las sentencias JavaScript que se colocan dentro de las <script> … </ script> etiquetas HTML en una página web.

Puedes colocar las etiquetas <script>, que contienen JavaScript, en cualquier parte de tu página web, pero normalmente se recomienda que lo guardes dentro de las etiquetas <head>.

La etiqueta <script> alerta al programa del navegador para comenzar a interpretar todo el texto entre estas etiquetas como un script.

La etiqueta de script tiene dos atributos importantes:

Tu primer código JavaScript

Tomemos un ejemplo para imprimir “Hello World”. Hemos añadido un comentario HTML opcional que rodea nuestro código JavaScript. Esto es para guardar nuestro código de un navegador que no sea compatible con JavaScript.

El comentario termina con un “// ->”. Aquí “//” significa un comentario en JavaScript, por lo que agregamos que para evitar que un navegador lea el final del comentario HTML como un pedazo de código JavaScript.

A continuación, llamamos a una función document.write que escribe una cadena en nuestro documento HTML.

<Script …>

Código JavaScript

</ Script>

<Script language = “javascript” type = “text / javascript”> Código JavaScript

</ Script>

Esta función se puede utilizar para escribir texto, HTML o ambos. Echa un vistazo al siguiente código.

Espacio en blanco y salto de línea

JavaScript ignora los espacios, las pestañas y las saltos de línea que aparecen en los programas de JavaScript. Puedes utilizar espacios, pestañas y líneas de nuevo libremente en tu programa y eres libre de formatear e indexar tus programas de una manera ordenada y coherente que hace que el código sea fácil de leer y entender.

Los puntos y coma son opcionales

Las sentencias simples en JavaScript son generalmente seguidas por un carácter punto y coma, tal como están en C, C ++ y Java.

JavaScript, sin embargo, te permite omitir este punto y coma si cada una de sus declaraciones se colocan en una línea separada. Por ejemplo, el código siguiente podría escribirse sin punto y coma.

Hola Mundo!

<Script language = “javascript” type = “text / javascript”> <! –

Var1 = 10

Var2 = 20

// ->

</ Script>

Pero cuando se formatea en una sola línea de la siguiente manera, debes utilizar los puntos y coma.  Es una buena práctica de programación utilizar puntos y comas.

Sensibilidad de los caracteres

JavaScript es un lenguaje sensible a mayúsculas y minúsculas. Esto significa que las palabras clave del lenguaje, las variables, los nombres de las funciones y cualquier otro identificador se deben escribir siempre con una mayúscula consistente de letras.

Así que los identificadores Time y TIME transmitirán diferentes significados en JavaScript. Debes tener cuidado al escribir nombres de variables y funciones en JavaScript.

Comentarios en JavaScript

JavaScript admite comentarios de estilo C y estilo C ++. Así:

 Cualquier texto entre // y el final de una línea es tratado como un comentario y es ignorado por JavaScript.

 Cualquier texto entre los caracteres / * y * / se trata como un comentario. Esto puede abarcar varias líneas.

 JavaScript también reconoce la secuencia de apertura de comentario HTML <! -. JavaScript trata esto como un comentario de una sola línea, igual que hace el // comentario.

 La secuencia de cierre de comentario HTML -> no es reconocida por JavaScript, por lo que debería escribirse como // ->.

<Script language = “javascript” type = “text / javascript”> <! –

Var1 = 10; Var2 = 20;

// ->

</ Script>

Ejemplo

El siguiente ejemplo muestra cómo utilizar los comentarios en JavaScript.

<Script language = “javascript” type = “text / javascript”> <! –

// Este es un comentario. Es similar a los comentarios en C ++

Todos los derechos reservados

* Este es un comentario multilínea en JavaScript

* Es muy similar a los comentarios en la programación C * /

// ->

</ Script>

Colocación de JavaScript

Existe una flexibilidad para incluir código JavaScript en cualquier parte de un documento HTML. Sin embargo, las formas más preferidas de incluir JavaScript en un archivo HTML son las siguientes:

 Secuencia de comandos en <head> … </ head>.

 Secuencia de comandos en <body> … </ body>.

 Secuencia Script en <body> … </ body> y <head> … </ head>.

 Script en un archivo externo y luego incluirlo en la sección <head> … </ head>.

JavaScript en la sección <head> … </ head>

Tipos de datos JavaScript

Una de las características más fundamentales de un lenguaje de programación es el conjunto de tipos de datos que soporta. Estos son el tipo de valores que pueden ser representados y manipulados en un lenguaje de programación.

JavaScript te permite trabajar con tres tipos de datos primitivos:

 Números, por ejemplo, 123, 120,50, etc.

 Cuerdas de texto, p. “Esta cadena de texto”, etc.

 Booleano, p. verdadero o falso.

JavaScript también define dos tipos de datos triviales, nulos e indefinidos, cada uno de los cuales define sólo un único valor.

Además de estos tipos de datos primitivos, JavaScript soporta un tipo de datos compuesto conocido como objeto. Cubriremos los objetos en detalle en un capítulo aparte.

Variables JavaScript

Como muchos otros lenguajes de programación, JavaScript tiene variables. Las variables pueden considerarse contenedores con nombre. Puedes colocar datos en estos contenedores y luego referirte a los datos simplemente nombrando el contenedor.

Antes de utilizar una variable en un programa JavaScript, debes declararla. Las variables se declaran con la palabra clave var como sigue.

      <Script type = “text / javascript”> <! –

Var dinero;

Nombre var;

// ->

</ Script>

¿Cómo ves este lenguaje? Javascript es muy útil ya que aporta soluciones a las páginas web que con otros programas hubiera sido muy dificil ejecutar. Una de las innovaciones fue darle a los contenidos web el dinamismo que necesitaban por lo que su aparición fue un gran aporte para el diseño web y la experiencia del usuario.

Espero que te animes a aprender Javascript con esta guía básica.

¡No dejes de comentarme qué te pareció este curso para aprender javascript!