Creación de sitios web: JavaScript

Página 12: JavaScript

/es/creacion-de-sitios-web/css-cascading-style-sheets/content/

JavaScript

JavaScript es un lenguaje de programación lo que significa que tiene variables, funciones, ciclos y condicionales entre otras características. A través de este podemos modificar los elementos html del documento, procesar y validar datos del usuario o hacer peticiones de recursos al servidor.

Conceptos básicos

Variables

En programación una variable es un nombre por el cual nos podemos referir a un espacio en la memoria del computador. En JavaScript no es necesario especificar el tipo de dato que contendrá la variable y una variable puede contener cualquier tipo de dato en un momento dado. A continuación encuentras varias formas de declarar variables.
X

Condicionales

Un condicional es una instrucción de programación que permite ejecutar uno u otro código dependiendo si el resultado de una operación es falso o verdadero. En JavaScript contamos con comparaciones de igualdad, mayor que y  menor que y operadores lógicos como and y or. Observa el ejemplo.
X

Ciclos

En programación es muy común tener que aplicar los mismos procesos a una gran cantidad de datos, para esto usamos los ciclos, que nos permiten repetir la ejecución de un mismo código. A continuación encuentras dos ejemplos, el ciclo for y el ciclo while.
X

Funciones

El objetivo de las funciones en programación es agrupar código que se usa muy frecuentemente. En JavaScript las funciones también se pueden comportar como variables y esta es una de sus características más importantes. Revisa los comentarios en el siguiente ejemplo.


X

Objetos

La programación orientada por objetos nos permite concebir un programa de computadora como un conjunto de cosas que hacen algo. En la práctica un objeto se parece a una estructura de datos que además tiene funciones que operan sobre sus propios datos. Siendo JavaScript un lenguaje de programación orientado por objetos, puedes ver varias operaciones con objetos en el siguiente ejemplo.

Eventos

La programación orientada por eventos nos permite escribir programas que no se ejecutan linealmente, sino que ejecutan parte del código en respuesta a un evento. Un evento puede ser algo que ocurre, por ejemplo, cuando haces click con tu ratón o la apertura de una conexión de red. JavaScript es un lenguaje orientado por eventos, en el que podemos conectar funciones con eventos, para así interactuar con el usuario. En el ejemplo conectamos un evento del ratón con una función anónima.
X

JavaScript en el navegador

Los navegadores ofrecen un ambiente de ejecución de JavaScript a través del cual podemos manipular el documento html y ejecutar algunas operaciones de red. Las posibilidades que tenemos están determinadas por el DOM API (Document Object Model  - Application Program Interface) que es, simplificando un poco, un listado de objetos y métodos disponibles para esto.Son muchas las operaciones que podemos hacer sobre un documento html, a continuación mencionamos algunas.

Operaciones de selección

De forma similar a los selectores de css, tenemos operaciones que nos retornan uno o más elementos del documento. Revisa los comentarios en el ejemplo a continuación.
X

Operaciones de estilo

A través de estas podemos alterar las propiedades de los elementos html desde código JavaScript, como por ejemplo el estilo de fuente en el siguiente ejemplo.

X

Operaciones con elementos multimedia

Los elementos multimedia en particular tienen atributos y eventos especiales que no tienen los demás elementos. En el ejemplo vemos algunos atributos del elemento video.
X

Operaciones de red

Es posible hacer peticiones al mismo servidor que estamos visitando para obtener recursos como texto, html, datos o archivos, esto se hace con la técnica AJAX (Asynchronous JavaScript And XML) que nos permite hacer la petición sin abandonar el documento actual. En el ejemplo vemos una petición GET.
X

Operaciones con eventos

A través de JavaScript es posible asociar funciones con eventos del documento html, de esta forma podemos generar una mayor interacción con los usuarios. En el ejemplo asociamos una función que se ejecutará al terminar un video.

X

El código JavaScript se implementa como un archivo de texto plano con extensión js. Debes asociar el archivo js al documento html usando la etiqueta script.

/es/creacion-de-sitios-web/plantillas-web-y-frameworks/content/