NUCBA

Javascript
Variables, operadores y
condicionales

apuntes
Introducción a Javascript

Lenguajes de programación: ¿Qué son?

Los lenguajes de programación son sistemas formales de comunicación diseñados para
permitir a los programadores expresar algoritmos y procesos computacionales de manera
clara y concisa.

En esencia, los lenguajes de programación son un conjunto de reglas y símbolos que

permiten a los programadores escribir instrucciones que las computadoras pueden
entender y ejecutar. Estas instrucciones pueden ser tan simples como sumar dos
números o tan complejas como diseñar un sistema operativo completo.

Hay muchos tipos diferentes de lenguajes de programación, cada uno con sus propias
características y aplicaciones específicas. Algunos lenguajes de programación están
diseñados para ser fáciles de entender y aprender, mientras que otros están diseñados
para ser altamente eficientes y de alto rendimiento.

Los lenguajes de programación se utilizan en una amplia variedad de campos y

aplicaciones, desde el desarrollo de software hasta la inteligencia artificial, la robótica y la
simulación de sistemas complejos. A medida que la tecnología continúa evolucionando,
los lenguajes de programación seguirán siendo una herramienta crítica para los
programadores y los innovadores tecnológicos en todo el mundo.

Javascript
JavaScript es un lenguaje de programación que se utiliza principalmente en el
desarrollo web para crear sitios y aplicaciones web interactivos.

A diferencia de los lenguajes de programación tradicionales, que se ejecutan en la

computadora del usuario, JavaScript se ejecuta en el navegador web del usuario. Esto
significa que los programadores pueden utilizar JavaScript para crear efectos visuales,
animaciones y funciones interactivas en tiempo real sin tener que comunicarse con el
servidor.

JavaScript se utiliza en conjunto con HTML y CSS para crear páginas web dinámicas e
interactivas. HTML proporciona la estructura básica de la página, mientras que CSS se
utiliza para dar estilo y diseño a la página. JavaScript se utiliza para agregar interactividad
a la página, como botones que realizan acciones, menús desplegables y ventanas
emergentes.

Además de su uso en el desarrollo web, JavaScript también se utiliza en otras áreas, como
el desarrollo de aplicaciones móviles y de escritorio, el desarrollo de juegos y la creación de
sistemas de automatización de tareas. Nos enfocaremos durante la carrera en su
utilización para el desarrollo web.

1
Breve historia de Javascript

La historia de JavaScript comienza en 1995, cuando Brendan Eich, un ingeniero de

software de Netscape, fue contratado para crear un lenguaje de programación que
pudiera ser utilizado en el navegador web Netscape Navigator.

Inicialmente, el lenguaje fue llamado Mocha, pero luego fue renombrado a LiveScript y
finalmente a JavaScript, para capitalizar la popularidad del lenguaje de programación
Java en ese momento.

JavaScript se lanzó junto con Netscape Navigator 2.0 en septiembre de 1995 y

rápidamente se convirtió en uno de los lenguajes de programación más populares en el
mundo de la tecnología.

En 1997, la empresa Netscape se unió con la organización de estándares web, la W3C, para
crear un estándar para JavaScript, conocido como ECMAScript. ECMAScript fue diseñado
para garantizar que el lenguaje fuera interoperable entre diferentes navegadores y
plataformas.

En 1998, se lanzó la especificación de ECMAScript 2.0, que incluía nuevas características

como la gestión de excepciones y la creación de objetos personalizados. Desde entonces,
se han lanzado varias versiones de ECMAScript, cada una con nuevas características y
mejoras.

En 2009, Ryan Dahl creó Node.js, un entorno de tiempo de ejecución de JavaScript que
permite que el lenguaje se ejecute en el servidor, lo que permitió la creación de
aplicaciones web altamente escalables y de alto rendimiento.

En los años siguientes, JavaScript continuó evolucionando y creciendo en popularidad. En

2015, se lanzó ECMAScript 6, que introdujo características importantes como las clases, los
módulos y las promesas, y ayudó a establecer a JavaScript como un lenguaje de
programación maduro y completo.

Hoy en día, JavaScript es uno de los lenguajes de programación más populares y

ampliamente utilizados en el mundo, y se utiliza en una amplia variedad de aplicaciones,
desde el desarrollo web y de aplicaciones móviles hasta la inteligencia artificial y la
robótica. Con su rica historia y amplia gama de aplicaciones, JavaScript sigue siendo una
herramienta fundamental para cualquier persona que quiera trabajar en el mundo de la
tecnología.

2
¿Cómo funciona Javascript?
JavaScript es un lenguaje de programación interpretado que se ejecuta en el
navegador web del usuario. Cuando se carga una página web que incluye código
JavaScript, el navegador descarga y ejecuta el código para realizar las tareas programadas
por el desarrollador.

JavaScript funciona interactuando con el Document Object Model (DOM), que es una
interfaz que representa la estructura de la página web en el navegador. El DOM se
compone de nodos que representan los elementos de la página, como encabezados,
párrafos y botones, y los desarrolladores pueden utilizar JavaScript para acceder y
manipular estos nodos.

Además, JavaScript también puede interactuar con el objeto global del navegador, que
incluye cosas como el historial del navegador, la pantalla, el tiempo de espera y más. Los
desarrolladores pueden utilizar JavaScript para manipular estos objetos globales y realizar
tareas como redireccionar a otra página, mostrar mensajes emergentes y crear efectos
visuales.

También es capaz de comunicarse con el servidor web, lo que permite a los

desarrolladores crear aplicaciones web dinámicas y en tiempo real. Los desarrolladores
pueden utilizar JavaScript para enviar y recibir datos a través de tecnologías como AJAX
(Asynchronous JavaScript and XML) y WebSockets.

Javascript como lenguaje débilmente tipado

En programación, los lenguajes de programación se dividen en dos categorías principales:
lenguajes tipados y lenguajes no tipados. Los lenguajes tipados son aquellos en los que
cada variable tiene un tipo de datos específico y debe ser declarada con ese tipo de datos.
Por otro lado, los lenguajes no tipados, también conocidos como lenguajes débilmente
tipados, son aquellos en los que las variables no están asociadas con un tipo de datos
específico y pueden cambiar de tipo durante la ejecución del programa.

JavaScript es un lenguaje de programación débilmente tipado, lo que significa que las

variables no tienen un tipo de datos fijo y pueden cambiar de tipo durante la ejecución
del programa. Por ejemplo, una variable que inicialmente contiene un número puede
cambiar su valor a una cadena de texto en cualquier momento del programa.

Este enfoque flexible de tipos de datos tiene ventajas y desventajas. Por un lado, hace que
sea fácil escribir código más rápido, ya que no es necesario declarar explícitamente los
tipos de datos de las variables. Por otro lado, también puede aumentar el riesgo de
errores en tiempo de ejecución y dificultar la detección de errores durante la fase de
desarrollo.

3
¿Cómo empiezo a usar Javascript?
Existen dos maneras de comenzar a utilizar Javascript vinculándolo con nuestro archivo
html. En ambas, utilizaremos la etiqueta script, que se utiliza para contener código de
Javascript, ya sea dentro de las etiquetas o bien vinculando un archivo externo.

Podemos colocar esta etiqueta en dentro del <head> de nuestra página, lo que hará que
se cargue primero Javascript y luego el resto del contenido de nuestra página, o bien
colocarla luego de todo el contenido dentro del <body> , lo que hará que primero se
carguen los elementos de la página y luego nuestro código de Javascript.

Durante la cursada, vamos a estar colocando esta etiqueta como último elemento dentro
del body. Veamos ahora cuales son las formas de uso de esta etiqueta

Dentro de la Etiqueta <script>

La primer forma implica colocar la etiqueta script en nuestro html y escribir código de
javascript dentro de la etiqueta:

Vincular archivo externo

La segunda forma, y la que vamos a estar utilizando durante la cursada, es vincular un

archivo externo de javascript utilizando el atributo src de nuestra etiqueta script:

Tal como hacíamos con las imágenes, debemos indicarle al atributo src la ruta en la que
se encuentra nuestro archivo de Javascript.

4
Variables en programación
Una variable es un espacio de memoria reservado para almacenar un valor que puede
cambiar a lo largo del tiempo. Es una entidad que se utiliza para almacenar y representar
datos en un programa.

Cada variable tiene un nombre que se utiliza para hacer referencia a ella en el código.

Las variables se utilizan para almacenar valores que se utilizan en un programa, como
resultados intermedios de cálculos, entradas del usuario, configuraciones del programa,
entre otros. Al utilizar variables, podemos hacer que nuestro código sea más legible y fácil
de mantener, ya que podemos asignar nombres significativos a los valores que
almacenamos en ellas. Además, son una herramienta que nos permitirá reutilizar código
dentro de nuestra aplicación.

A diferencia de otro lenguajes, las variables en JavaScript son dinámicamente tipadas, lo

que significa que no es necesario especificar un tipo de datos al declararlas, ya que el
tipo se determina automáticamente en función del valor que se les asigna.

Var
En JavaScript, "var" es una palabra reservada que se utiliza para declarar una variable. Con
la palabra clave "var", se reserva un espacio en la memoria para almacenar un valor que se
puede cambiar a lo largo del tiempo.

Por ejemplo, para declarar una variable llamada "edad" con un valor de 25, se podría
escribir:

También se puede declarar una variable sin asignarle un valor inicial:

En este último caso, la variable existirá, pero su valor no estará definido.

Tal como con las clases e id’s en el módulo anterior, es importante que los nombres que le
coloquemos a nuestras variables sean claros, concisos y descriptivos.

A continuación, vamos a ver los diferentes tipos de datos que pueden utilizarse para
definir este valor.

5
Tipos de datos
Los tipos de datos son un concepto fundamental en cualquier lenguaje de programación,
y JavaScript no es una excepción. En JavaScript, los tipos de datos se utilizan para
representar diferentes tipos de valores, como números, texto, booleanos, objetos y más.

Cada tipo de dato tiene sus propias características y comportamientos únicos, y es

importante conocerlos para poder escribir código JavaScript efectivo y sin errores.

En JavaScript, los tipos de datos se dividen en dos categorías principales: tipos de datos
primitivos y tipos de datos compuestos. Los tipos de datos primitivos incluyen valores
simples como números, cadenas de texto y booleanos y no tienen métodos ni
propiedades, mientras que los tipos de datos compuestos incluyen objetos, arrays y
funciones y si los tienen.

Como mencionamos antes, los tipos de datos en Javascript son dinámicos, lo que
significa que el tipo de una variable puede cambiar durante la ejecución del programa.
Por ejemplo, una variable que inicialmente contiene un número puede cambiar su valor a
una cadena de texto en cualquier momento del programa.

Booleans

Son un tipo de dato primitivo que puede tomar los valores ‘true’, que significa verdadero,
y ‘false’ que significa falso. Son valores muy importantes para el control de flujo y la toma
de decisiones en aplicaciones de Javascript, ya que se utilizan para evaluar el valor de
verdad de una expresión.

Number

Son un tipo de dato primitivo que representa números. Estos números pueden ser
enteros (-4, 0, 42) o decimales (18.1222 ,3.14,-2.5).

Se puede utilizar para operaciones aritméticas y también pueden representar otros tipos
de datos, como códigos de caracteres y fechas.

6
Strings

Son un tipo de dato primitivo que representa una secuencia de caracteres.

Los strings se utilizan para representar texto, nombres, direcciones de correo electrónico,
direcciones web y otros tipos de información basada en caracteres. Los strings pueden ser
de cualquier longitud, desde una letra hasta miles de caracteres.

Se definen utilizando comillas dobles o simples:

Además existen los template literals que permiten crear de manera sencilla y legible
strings que necesitan incluir variable u otras expresiones dentro del string que se va a
crear.

Se definen utilizando comillas invertidas en lugar de comillas simples o dobles, y permiten

agregar variables o expresiones encerrándolas entre llaves y precediéndolas con el signo
de dólar

También podemos concatenar strings utilizando el operador de suma de la siguiente

manera

Recomendamos que vayan amigándose desde un principio con la sintaxis de los template
literals, ya que más adelante estaremos utilizando no solo variables, sino también otro tipo
de datos mas complejos en nuestros strings (Esto no quiere decir que siempre deben usar
comillas invertidas para sus strings, ya que muchas veces no será necesario).

7
Undefined

Es un tipo de dato primitivo que hace referencia a una variable que ha sido declarada
pero no ha sido asignada con un valor. También será el valor por defecto al intentar
acceder a una propiedad que no existe en un objeto (Esto lo veremos más adelante
cuando veamos objetos en profundidad)

Arrays

Es un tipo de dato que refiere a una estructura de datos que se utiliza para almacenar
una colección de elementos en una sola variable. Los arrays son objetos que tienen una
serie de elementos ordenados y pueden contener cualquier tipo de dato, incluyendo otros
arrays.

En JavaScript, los arrays se crean utilizando corchetes "[]" y los elementos se separan por
comas, como podemos ver en el siguiente ejemplo:

Objetos

Los objetos son una colección de propiedades y métodos que representan una entidad
o concepto del mundo real. Los objetos son una de las estructuras de datos más
importantes en JavaScript, y se utilizan para modelar objetos complejos y estructurados.

En JavaScript, los objetos se crean utilizando llaves "{}" y las propiedades se definen en
formato de clave-valor separados por comas, como vemos en el siguiente ejemplo:

8
Null

Es un tipo de dato que representa la ausencia intencional de cualquier valor. En otras

palabras, si una variable se establece en null, significa que no tiene valor ni referencia a
ningún objeto.

A diferencia de "undefined", qué se utiliza para representar la ausencia de un valor o

propiedad indefinida, "null" se utiliza para representar una ausencia intencional y se
asigna explícitamente a una variable, como vemos en el ejemplo:

Symbol

Es un valor primitivo y único que se utiliza como identificador para propiedades de

objetos.
A diferencia de otros tipos de datos como números, cadenas o booleanos, los símbolos no
tienen un valor literal o representación en el código. Cada símbolo se crea con un
identificador único y no se puede replicar, lo que significa que dos símbolos siempre
serán diferentes, incluso si tienen el mismo nombre.

Formas de ingresar valores

En JavaScript, hay varias formas de ingresar valores. Es importante tener en cuenta estas
formas de ingresar valores ya que permiten interactuar con el usuario, recibir y mostrar
información, y pueden ser utilizadas para crear experiencias interactivas y dinámicas en
las aplicaciones web, así como para depurar el código durante el desarrollo de nuestras
apps. A continuación , vamos a ver algunas de estas maneras.

9
Prompt

prompt() es una función incorporada en JavaScript que muestra un cuadro de diálogo

en el navegador que permite al usuario ingresar un valor. La función prompt() acepta
un argumento de cadena de texto opcional que se utiliza para mostrar un mensaje al
usuario, indicando qué tipo de valor se espera que ingrese.

Es importante tener en cuenta que el valor devuelto por la función prompt() siempre es
una cadena de texto (string), incluso si el usuario ingresa un número u otro tipo de
valor. Si se espera un valor numérico u otro tipo de valor, es necesario convertir el valor
devuelto a través de funciones como Number() que convierten un valor a número antes
de realizar operaciones o cálculos con el valor ingresado por el usuario, como hacemos en
el siguiente ejemplo:

El prompt() es una forma útil para interactuar con el usuario y permitir que ingrese
información en una aplicación web, aunque también puede ser utilizado para crear
experiencias interactivas y dinámicas. Sin embargo, es importante tener en cuenta que el
uso excesivo de cuadros de diálogo puede ser molesto para el usuario y reducir la
experiencia del usuario en general.

La consola en los navegadores

En JavaScript, la consola es una herramienta que proporciona el navegador web para la

depuración y el monitoreo del código JavaScript. La consola es una ventana en el
navegador que permite a los desarrolladores visualizar y manipular el código JavaScript
que se está ejecutando en una página web.

La consola es una herramienta valiosa para los desarrolladores, ya que les permite
imprimir información útil en la consola, como mensajes de depuración, errores,
variables y otros datos importantes, lo que puede ayudar a detectar problemas y
depurar el código.

En la consola, también se pueden ejecutar comandos y expresiones de JavaScript, lo

que permite a los desarrolladores probar rápidamente pequeñas secciones de código,
experimentar con diferentes técnicas y evaluar el resultado de diferentes expresiones.

10
Console

El objeto Console es una herramienta integrada en los navegadores web que proporciona
una interfaz para imprimir mensajes de depuración y errores, así como para interactuar
con la consola del navegador.

El objeto Console se utiliza para imprimir información en la consola del navegador y

para interactuar con ella. Los métodos del objeto Console incluyen:

console.log(): muestra mensajes de depuración en la consola.

console.error(): muestra mensajes de error en la consola.

console.warn(): muestra mensajes de advertencia en la consola.

console.table(): muestra una tabla en la consola que representa un conjunto de datos.

Además de los métodos anteriores, el objeto Console también proporciona otros métodos
útiles para interactuar con la consola del navegador, como console.clear() para borrar la
consola y console.time() y console.timeEnd() para medir el tiempo de ejecución de un
bloque de código.

11
Alert

alert() es una función integrada del navegador que muestra un mensaje en una ventana
emergente en la pantalla del usuario. El mensaje puede ser una cadena de texto o una
expresión que se evalúa como una cadena de texto.

La función alert() se utiliza a menudo para proporcionar información importante al

usuario, como mensajes de error, confirmaciones, advertencias y otros tipos de
información. La ventana emergente de alert() es muy simple y solo contiene un botón
"Aceptar", que cierra la ventana y permite al usuario continuar con la interacción en la
página web.

———————————————————————————————————————————

Nucba tip: Sigan investigando sobre los temas aquí expuestos. Practiquen, apoyense en
la documentación oficial y sobre todo mantengan la constancia y la curiosidad a
medida que vayan aprendiendo cosas nuevas.

#HappyCoding 🚀

12