Introducción a la Programación para Principiantes – Conceptos Básicos y Fundamentos

Esta guía ofrece una introducción a la programación desde cero, pensada para quienes dan sus primeros pasos en el mundo del desarrollo de software. A lo largo de las siguientes secciones, abordaremos los conceptos básicos de la programación —desde qué es un programa y un algoritmo, hasta variables, estructuras de control, funciones, arrays y objetos— con ejemplos prácticos en JavaScript.

1. Conceptos básicos de programación

Lo primero que voy a explicar en estas secciones sobre programación base es qué es un programa. Puedes ver un programa como si fuera una receta de cocina para preparar, por ejemplo, una torta: va desde sus ingredientes, pasando por el proceso de crear la mezcla, hasta cocinarla. En un programa informático tenemos los mismos elementos.

Un programa permite:

Entrada de datos: Recoge datos de entrada para su procesamiento. Por ejemplo, a través del teclado o el ratón.
Procesamiento: El programa utiliza la información de entrada para realizar las operaciones que se le han programado.
Salida: El programa devuelve el resultado obtenido tras el procesamiento de los datos.

En nuestro caso específico de desarrollo web, podríamos ilustrarlo con los siguientes ejemplos:

(Entrada de datos) Nuestro usuario ingresa mediante el navegador web a una URL determinada.
(Procesamiento) El programa procesa la fuente de entrada —en este caso, la URL— para saber exactamente qué quiere ver nuestro usuario.
(Salida) El programa devuelve una página que está asociada a la ruta solicitada.

Otro ejemplo sería si tenemos un formulario:

(Entrada de datos) Nuestro usuario ingresa los datos en el formulario.
(Procesamiento) El programa procesa la URL para saber qué petición está enviando nuestro usuario y, mediante la ruta, determina a qué función debe llamar. Es decir, el formulario se encuentra asociado a una función que describe los pasos o procesos necesarios para trabajar con los datos recibidos; por ejemplo:
1. Crear o actualizar algún recurso, como una publicación.
2. Filtrar un listado, y un largo etcétera.
(Salida) Finalmente, el programa devuelve la información solicitada mediante el navegador.

Un ejemplo práctico de una función que recibe una petición de nuestro usuario mediante un formulario sería como lo siguiente:

@invoiceProductBp.route('/enlace')
def procesar_form():
     form = InvoiceForm()
     form.validate_on_submit()
     if form.errors:
        return render_template('errores.html')
     post = Post()
     post.title = request.form['title']
     post.description = request.form['description']
     db.save(post)
     return render_template('exito.html')

Desglose del código anterior

En este fragmento vemos el proceso de cómo podemos recibir una petición que envía nuestro usuario desde el navegador. En los ejemplos anteriores, esta sería la función que se encarga de procesar dicha petición. El flujo va desde obtener una referencia al formulario que envió el usuario, pasando por verificar si los datos son válidos, hasta mostrar una página de errores en caso de que existan. En ese caso, la página de errores sería la salida del programa; el resto corresponde al nivel de procesamiento.

Luego, si no existen errores, el proceso continúa: simplemente creamos una entidad —que puede ser cualquier cosa: un contacto, un producto o, en este caso, un post— que guardamos en base de datos. Finalmente, como salida devolvemos un documento HTML al usuario.

En definitiva, ¿qué es un programa?

Un programa es un conjunto de instrucciones de código, escritas en algún lenguaje de programación, que realiza una tarea en particular. En esencia, es la materialización de un algoritmo en un lenguaje que la computadora puede interpretar y ejecutar.

Generalmente, los programas suelen contar con una interfaz gráfica o UI (por sus siglas en inglés, User Interface), donde el usuario puede interactuar con el programa. Sin embargo, también existen programas basados en líneas de comando (también conocidos como CLI, Command Line Interface).

Los programas hoy en día no solo funcionan en un ordenador con Windows, macOS o Linux; tenemos un amplio abanico de dispositivos tecnológicos capaces de ejecutar programas: teléfonos inteligentes con Android o iOS, tablets, relojes inteligentes, televisores, consolas de videojuegos... En general, todo aparato tecnológico que permita al usuario interactuar de manera digital cuenta con un programa o un conjunto de programas para tal fin.

Una característica común de los programas es que, para poder ejecutarse, deben estar "cargados en memoria". Este término hace referencia al hecho de que el programa debe residir en la memoria RAM —la memoria volátil de nuestro equipo—. Todo programa que se esté ejecutando en el sistema operativo (SO) se encuentra "en memoria" RAM; cuando apagas el equipo, esos datos se pierden, a diferencia del almacenamiento permanente del disco duro o SSD.

¿Qué es un algoritmo en informática?

Un algoritmo en informática es una secuencia de operaciones definidas para resolver un problema, que luego llevamos a un programa como la función que te mostraba anteriormente. Es importante destacar que estas operaciones se ejecutan de manera secuencial, es decir, una después de la otra, siguiendo un orden lógico.

Pasos o partes de un algoritmo

Como mencionamos anteriormente, los algoritmos, al igual que los programas, constan de tres pasos fundamentales:

Entrada: Para ingresar los datos con los cuales vamos a trabajar.

Proceso: Donde se realizan las operaciones lógicas para resolver la tarea, tomando como insumo los datos recibidos en el paso anterior.

Salida: Finalmente, el objetivo de todo algoritmo es resolver un problema y mostrar el resultado. Esta fase presenta la respuesta una vez terminada la ejecución del algoritmo.

Con los algoritmos, nosotros tenemos los pasos a seguir para solventar un problema; y por supuesto, los mismos tienen un inicio y un fin.

Ejemplo detallado de un algoritmo

Por ejemplo, para hacer una torta tenemos los mismos tres pasos: entrada de datos, procesamiento y salida:

Inicio (elementos de entrada: ingredientes y pasos a seguir)
Añadir leche en una cacerola
Añadir sal
Añadir harina
Mezclar
Servir
Hornear
Salida/Fin (Presentar la torta)

En el ejemplo de código que vimos anteriormente, como entrada de datos tendríamos la ruta o URL que empleó nuestro usuario para llegar al formulario y los datos que colocó en el mismo.

Como procesamiento tenemos la referencia al formulario, las validaciones de los datos, y la creación y registro de los datos en una estructura —que en este caso sería un post o entrada de un blog—.

Y como salida finalmente tenemos la respuesta: una página HTML que puede ser la de errores (si tenemos problemas con los datos suministrados) o la de éxito.

2. ¿Qué es un lenguaje de programación y cuáles tipos existen?

Para hacer un programa como el mostrado en la sección anterior, necesitamos lenguajes de programación. Hoy en día existen múltiples lenguajes de programación; prácticamente salen nuevos a diario y tenemos de todo según lo que queramos desarrollar.

¿Qué es un lenguaje de programación?

Puede resultar un poco difícil definir de golpe qué es un lenguaje de programación, porque puede tomar muchas definiciones distintas y todas son ciertas. Así que te ofrezco varios conceptos clave para que entiendas qué es y algunas de sus características:

Un lenguaje de programación es un conjunto de símbolos (sintaxis) y un orden en particular para orientar la programación.
Un lenguaje de programación es un conjunto de instrucciones (símbolos y sintaxis) que permite a una persona o programador escribir órdenes para que la computadora las "entienda" y ejecute; entiéndase, un programa.
Un lenguaje de programación es un programa que permite construir otros programas de manera escrita, mediante instrucciones.

Todo aparato o dispositivo tecnológico de cómputo requiere de un lenguaje de programación para poder cumplir con los procesos o tareas que tiene programados.

Tipos de lenguajes de programación

Hoy en día existen múltiples tipos de lenguajes de programación según el propósito y nivel de abstracción. Veamos algunos ejemplos por área de aplicación:

Si quieres desarrollar aplicaciones de escritorio, tenemos C#, Python e incluso JavaScript, por mencionar algunos.
Si queremos desarrollar páginas web (es decir, contenido estático) o derivados, tenemos JavaScript, HTML y CSS como pilares fundamentales.
Si queremos desarrollar aplicaciones web —que puedes ver como una página web pero con contenido dinámico, es decir, que va cambiando y podemos gestionar de alguna forma—, para ello tenemos PHP, Python e incluso JavaScript, entre otros.

Realmente esta no es la clasificación formal sobre los tipos de lenguajes, ya que los tipos van un poco más allá de simplemente cambiar de un lenguaje a otro. A continuación, veamos la clasificación por nivel de abstracción:

Lenguaje de máquina

Este es el lenguaje de más bajo nivel, y es el que entiende directamente la máquina. Está compuesto de puros ceros y unos, es decir, código binario. Por lo tanto, no es un lenguaje que una persona pueda programar de forma práctica, ya que resulta extremadamente complejo y propenso a errores.

Lenguaje ensamblador

Este es un lenguaje intermedio entre el lenguaje de máquina y los lenguajes de alto nivel. Aquí disponemos de instrucciones mnemotécnicas (como MOV, ADD, JMP) que representan bloques de comandos para realizar diversas operaciones a nivel de hardware. Aunque más legible que el binario, sigue siendo muy cercano al funcionamiento interno del procesador.

Lenguaje de alto nivel

Aquí se encuentran los lenguajes de programación más empleados en la actualidad, como JavaScript, Python, PHP, Java, Kotlin, Dart, entre otros. Son los lenguajes que nos permiten comunicarnos con la máquina de forma más natural, por lo tanto, son los que generalmente empleamos al momento de crear nuestros programas.

Son lenguajes que disponen de un conjunto de instrucciones y una lógica más fácil de entender, porque su sintaxis está más cerca del lenguaje humano.
Todos estos lenguajes necesitan de un intérprete o un compilador para traducir el código a lenguaje de máquina, que es lo único que nuestra computadora puede entender y ejecutar.

3. Elementos principales de un lenguaje de programación

Ya sabemos qué es un programa y su relación con los algoritmos en informática como secuencia de pasos para resolver un problema. También vimos los lenguajes de programación. Ahora vamos a ver cuáles son los principales elementos que tenemos que tener en cuenta al momento de programar.

Lo primero es la sintaxis: la forma en la cual podemos escribir código en un lenguaje de programación. La sintaxis define los elementos de dicho lenguaje y cómo se combinan para formar un programa. Los elementos típicos de cualquier lenguaje son los siguientes:

Tipos de datos
Variables
Operadores
Estructuras de control
Comentarios
Bloques de código (funciones, clases, etc.)

Todos estos elementos los iremos abordando poco a poco a lo largo de esta guía.

4. ¿Qué es JavaScript? Razones para dar los primeros pasos en la programación

JavaScript nos permite agregar interactividad a nuestras páginas web y, en pocas palabras, convertir un sitio estático en algo dinámico; por ejemplo, agregando conexiones con otras aplicaciones que realicemos en PHP, Python u otros servicios.
JavaScript es el lenguaje de programación seleccionado para iniciar y dar los primeros pasos en la programación y conocer los fundamentos que aplican a cualquier lenguaje de programación; de esto nos ocupamos en las siguientes secciones.

Razones para dar los primeros pasos con JavaScript

Muchos recomiendan empezar a programar con JavaScript porque es bastante flexible en sintaxis, puedes ver inmediatamente los resultados de lo que has hecho y no necesitas instalar herramientas adicionales: basta con tener un navegador web para dar los primeros pasos. Vamos a emplear JavaScript para enseñar lo más básico, como las variables o las funciones, ya que en todos mis cursos JavaScript es, de una manera u otra, un elemento central e imprescindible para cualquier desarrollo web.

JavaScript cuenta con las siguientes ventajas:

Es un lenguaje muy sencillo y flexible.
Es rápido y estable.
Es soportado en cualquier navegador web moderno, por lo tanto podemos empezar a programar desde ya sin necesitar nada más.
Es multiplataforma al extremo: lo puedes ejecutar sin importar si estás en Windows, macOS, Linux, un iPhone, iPad, Android y un largo etcétera.
Permite trabajar en lo que se conoce como Full Stack, es decir, tanto en el frontend (lado del cliente) como en el backend (lado del servidor); más adelante veremos qué significa esto en detalle.
Te dejo un enlace de referencia para que conozcas a fondo para qué sirve JavaScript.

Si quieres programar elementos interactivos para una página web, JavaScript es un imprescindible.

5. ¿Qué es una variable en programación?

Las variables son una de las características fundamentales de los lenguajes de programación. Permiten acceder a la memoria para almacenar y recuperar datos (es decir, podemos leer o guardar información) con los que nuestros programas van a trabajar. Piensa en una variable como una caja con una etiqueta: la etiqueta es el nombre de la variable, y dentro de la caja guardas un valor.

edad = 5;
nombre = "andres"

Las variables deben seguir un esquema específico para su declaración, y esto puede variar dependiendo del lenguaje de programación. Además, el valor de una variable puede cambiar durante la ejecución del programa:

edad = edad + 1

En resumen, una variable es un componente de software que podemos emplear para almacenar y leer datos que pueden ser de varios tipos, como los que veremos más adelante.

Operadores aritméticos

En JavaScript, al igual que en la mayoría de los lenguajes de programación, contamos con operadores aritméticos para realizar operaciones matemáticas como sumar, restar, multiplicar y dividir, y también para realizar comparaciones. Los principales son:

+ Suma: Los operandos pueden ser enteros o reales.
- Resta: Los operandos pueden ser enteros o reales.
* Multiplicación: Los operandos pueden ser enteros o reales.
/ División: Los operandos pueden ser enteros o reales.
% Módulo: Devuelve el resto de la división entre dos operandos.

Operadores de comparación en programación

Los operadores de comparación son otro elemento fundamental en cualquier lenguaje de programación. Nos permiten comparar variables y expresiones para obtener un valor de true (verdadero) o false (falso), es decir, un booleano:

<    Menor que
>    Mayor que
<=   Menor o igual
>=   Mayor o igual
!=   Distinto
==   Igual

Tal como viste en el ejemplo anterior donde sumamos una unidad a la variable edad, lo mismo aplica para el resto de los operadores matemáticos.

6. Tipos de datos en programación

Los tipos de datos son un mecanismo con el cual podemos representar y guardar distintos valores mediante las variables. Cada tipo de dato define qué clase de información puede almacenar una variable y qué operaciones podemos realizar con ella.

En la mayoría de los lenguajes de programación contamos con los siguientes tipos de datos (pueden existir algunos más o menos según el lenguaje de tu preferencia):

Tipos de datos o primitivas

Números
Tipos enteros: byte, short, int, long.
Tipos reales: float y double.
Booleanos: Solo pueden tener dos valores: true o false.
String: Cadenas de texto, como "Hola mundo".

Cada tipo primitivo tiene un rango diferente de valores positivos y negativos, excepto el boolean, que solo admite dos valores: true y false.

Ahora bien, ¿cuál seleccionar? El tipo de dato que elijas para un determinado programa dependerá del rango y tipo de valores que vayan a almacenarse y de si estos son enteros, reales, cadenas de texto, etc.

En la siguiente tabla puedes ver una representación del tamaño de las primitivas anteriores. Por ejemplo, para un int podemos representar valores en un rango que va desde -2,147,483,648 hasta 2,147,483,647.

Por otra parte, para los short solamente podemos representar hasta 32,767 en su parte positiva (o -32,768 en la negativa). Por lo tanto, si quieres representar un número de cédula en un país donde habitan millones de personas, tendrías que emplear un int en vez de un short. Pero si quieres representar la cantidad de tomates que tiene una persona en su nevera, muy probablemente te alcance con un short.

7. Estructuras de control en programación

Las estructuras de control son el mecanismo que tenemos en los lenguajes de programación para romper el flujo secuencial de las instrucciones que definamos en nuestro programa. Podemos emplear condiciones como "Si esto se cumple, entonces haz esto" o "Si esto no se cumple, haz esto otro", o incluso crear condiciones más complejas. Para evaluar estas condiciones nos apoyamos en los operadores que vimos anteriormente, ya que básicamente lo que evaluamos son estados de true (verdadero) o false (falso).

También existen estructuras de control en las cuales podemos establecer reglas como "Repite esto mientras se cumpla una condición". Esa condición es simplemente un estado que puede ser verdadero o falso; en otras palabras, un booleano.

Estructura de control: `if` para realizar condicionales

El if es la estructura de control por excelencia. Nos permite tomar decisiones según una condición a evaluar. Su definición luce así:

if(condicion) {
  ...
}

Si la condición se cumple —es decir, su valor es true—, entonces se ejecutará todo lo que coloquemos entre las llaves {}. Puede ser cualquier instrucción, incluso otra condición anidada. Veamos un ejemplo:

var bool = true;
n = 0;
if(bool) {
  n = n + 5;
}
n // Resultado: 5

Pero, ¿qué pasa si bool no es verdadero?

var bool = false;
n = 0;
if(bool) {
  n = n + 5;
}
n // Resultado: 0

Estructura de control: `if-else`

Ahora bien, ¿qué pasa si queremos definir un flujo tanto si la condición es correcta como si no lo es? Es decir: "Si esto se cumple, haz esto; si no se cumple, haz esto otro". Para eso empleamos la estructura if-else:

n = 0;
if(bool) {
  n = n + 5;
} else {
  n = 2;
}
n

edad = 21;
mayorEdad = false;
if(edad >= 18) {
  mayorEdad = true;
} else {
  mayorEdad = false;
}
mayorEdad // Resultado: true

Estructura de control: `if` anidados (`else if`)

Nosotros podemos encadenar la estructura del condicional para preguntar por varias condiciones. Podemos crear tantos anidamientos como necesitemos. Para crear un condicional anidado, empleamos la estructura else if:

estado = "";
edad = 12;
if(edad < 12) {
  estado = "Eres un niño";
} else if(edad < 18) {
  estado = "Eres un adolescente";
} else {
  estado = "Eres adulto";
}

También podemos encadenar múltiples else if para cubrir más casos:

estado = "";
edad = 65;
if(edad < 12) {
  estado = "Eres un niño";
} else if(edad < 18) {
  estado = "Eres un adolescente";
} else if(edad < 60) {
  estado = "Eres adulto";
} else {
  estado = "Tercera edad";
}

Operadores lógicos y las condiciones en programación

Ahora bien, ¿qué pasa si quieres evaluar más de una condición de verdadero o falso en un condicional? Por ejemplo, suponte que quieres preguntar si una persona es mayor de edad y es hombre:

edad = 21;
mujer = false;
hombreAdulto = false;

// De momento tenemos lo siguiente:
if(edad >= 18) {
  hombreAdulto = true;
} else {
  hombreAdulto = false;
}

Pero, ¿cómo añadimos la condición de que también sea hombre? Para eso empleamos el operador lógico AND. En JavaScript se representa con && (dos veces el símbolo ampersand):

if(edad >= 18 && mujer == false) {
  hombreAdulto = true;
} else {
  hombreAdulto = false;
}
hombreAdulto // Resultado: true

Aquí estamos preguntando que la edad sea mayor o igual a 18 y que la persona sea hombre. Con el operador &&, basta con que una de las condiciones sea falsa para que todo el bloque if no se ejecute.

Por otra parte, si queremos una estructura más flexible donde baste con que se cumpla una u otra condición, usamos el operador lógico OR, representado por || (doble barra vertical):

if(edad >= 18 || mujer == false) {
  hombreOAdulto = true;
} else {
  hombreOAdulto = false;
}
hombreOAdulto

Condiciones complejas

Perfectamente puedes combinar tantos operadores lógicos como necesites para construir condiciones más complejas:

edad = 21;
mujer = false;
hombreOAdulto = false;
terceraEdad = false;

if(edad >= 18 || mujer == false && terceraEdad) {
  hombreOAdulto = true;
} else {
  hombreOAdulto = false;
}
hombreOAdulto

Nota: Cuando combinas && y ||, ten en cuenta que && tiene mayor precedencia que ||. Usa paréntesis () para agrupar las condiciones y evitar ambigüedades: if((edad >= 18 || mujer == false) && terceraEdad).

Estructura de control: `switch`

Sin lugar a dudas, el if es la estructura de control más empleada. Sin embargo, cuando cuentas con múltiples condiciones sobre un mismo valor, un condicional anidado se hace poco práctico por la mala legibilidad del código. Para estos casos existe la estructura switch, que permite agrupar un conjunto de expresiones de manera más simplificada:

switch(dia) {
  case 1: diaSemana = "lunes"; break;
  case 2: diaSemana = "martes"; break;
  case 3: diaSemana = "miércoles"; break;
  case 4: diaSemana = "jueves"; break;
  case 5: diaSemana = "viernes"; break;
  case 6: diaSemana = "sábado"; break;
  case 7: diaSemana = "domingo"; break;
}

En vez de estar evaluando condiciones repetidas para un mismo valor, simplemente colocamos cada case con el valor que queremos comparar. En este ejemplo evaluamos qué día es a partir de una representación numérica, pero también podrías evaluar textos, booleanos o condiciones más complejas.

El uso del break es clave: como su nombre indica, es una palabra reservada que empleamos para detener la ejecución del resto del bloque switch una vez que se encuentra coincidencia. Si omites el break, la ejecución "caerá" (fall-through) al siguiente case, lo cual puede provocar resultados inesperados.

8. Estructuras de control: `for` para realizar ciclos o bucles

Aquí dejamos los bloques condicionales y entramos en otro universo: los bucles. Un bucle es una estructura de control que nos permite repetir una misma instrucción o conjunto de instrucciones un número determinado de veces. La estructura del for es la siguiente:

for(inicialización; condición; actualización) {
  instrucción 1
  instrucción 2
  ...
  instrucción N
}

Fase de inicialización: Definimos el valor inicial de una variable (comúnmente llamada i) que lleva el registro de la iteración actual.
Condición: Especifica la condición de parada. Cuando esta devuelve false, el bucle se detiene.
Fase de actualización: Es la actualización del valor de la variable contadora en cada iteración (por ejemplo, i++).

Ejemplo de `for`

El ejemplo tradicional de un for luce así:

n = 0;
for(var i = 0; i < 5; i++) {
  n = n + 1;
}
n // Resultado: 5

También podemos usar la forma acortada ++ para sumar una unidad:

n = 0;
for(var i = 0; i < 5; i++) {
  n++;
}
n // Resultado: 5

Los ciclos for son bastante útiles cuando tenemos colecciones que iterar —más adelante veremos qué son estas colecciones—. Abstráete un poco y suponte que tienes un conjunto de elementos (posts, productos, etc.) que quieres desplegar de alguna manera. En el desarrollo web, podrías construir un listado como el siguiente:

Con los for puedes repetir las instrucciones que construyen cada una de esas "cajas" para cada elemento del conjunto.

Veamos otro ejemplo; ¿qué pasa si sumamos el valor de i?

n = 0;
for(var i = 0; i < 5; i++) {
  n = n + i;
}
n // Resultado: 10 (0+1+2+3+4)

Ahora hagamos otro ejemplo empleando console.log. En este punto no hemos visto qué es una función, pero puedes verlo como un bloque con instrucciones que realiza alguna operación en particular. console.log se encarga de mostrar un mensaje por la consola del navegador:

for(var i = 0; i < 5; i++) {
   console.log(i);
}
// Salida: 0, 1, 2, 3, 4

Estructura de control: ciclo o bucle `while`

La estructura while es similar a la de for, pero más flexible. Simplemente definimos la condición que indica hasta cuándo se va a ejecutar el bucle. Si en el for teníamos tres fases (inicialización, condición y actualización), en el while solo definimos la condición; el resto de las fases las manejamos manualmente. El while nos ofrece una estructura más flexible, aunque en el desarrollo web —donde generalmente trabajamos con un conjunto finito de elementos— el for suele ser más práctico:

var n = 0;

while(n < 10) {
  console.log(n);
  n++;
}

// También podemos incrementar de 2 en 2:
var n = 0;

while(n < 10) {
  console.log(n);
  n = n + 2;
}

// Si n comienza en 10, el while no se ejecuta:
var n = 10;

while(n < 10) {
  console.log(n);
  n = n + 2;
}
// No imprime nada

Estructura de control: ciclo o bucle `do while`

El do while es básicamente el mismo while, pero con la condición evaluada al final. Con esto garantizamos que las instrucciones se ejecuten al menos una vez, independientemente de si la condición es verdadera o falsa desde el inicio. Partiendo del ejercicio anterior:

var n = 10;
while(n < 10) {
  console.log(n);
  n = n + 2;
}
// No imprime nada porque n ya es 10

Si lo convertimos a un do while:

var n = 10;
do {
  console.log(n);
  n = n + 2;
} while(n < 10);
// Imprime 10 (se ejecuta al menos una vez)

Como puedes ver, la instrucción se ejecuta al menos una vez. Si necesitas este comportamiento en tu programa, el do while es tu elección.

9. Uso de las funciones en la programación

Las funciones son uno de los pilares fundamentales en cualquier lenguaje de programación, y en JavaScript no son la excepción. Permiten ejecutar un conjunto de instrucciones para realizar una tarea o calcular un valor, y en pocas palabras, nos permiten reutilizar fácilmente un bloque de código.

Para crear una función tenemos que emplear la palabra reservada function, seguida del nombre de la función. Para nombrarla, debes tomar en consideración las mismas reglas que aplican al nombrar variables: no comenzar con números, no emplear caracteres especiales ni espacios, etc.:

function multiplica() {
  console.log(5 * 2);
}

Aquí simplemente creamos una función llamada multiplica que se encarga de multiplicar dos valores. Si por alguna razón necesitamos ejecutar esa multiplicación en varias partes de nuestro programa, basta con invocar la función. Pero fíjate que solamente la hemos declarado; de momento no se ha ejecutado. Para ejecutarla, simplemente colocamos el nombre de la función seguido de los paréntesis:

multiplica() // Imprime: 10

10. Comentarios en lenguajes de programación y HTML

Los comentarios son el mecanismo que tenemos para dejar anotaciones en nuestro programa. El carácter o conjunto de caracteres que empleamos varía según el lenguaje de programación. Su objetivo principal es permitirnos dejar notas o explicaciones para otros programadores (o para nosotros mismos) sobre cuál es el propósito de lo que estamos haciendo.

Los comentarios son simplemente una o múltiples líneas de texto que, al compilar o interpretar el código, el compilador o intérprete ignora. No forman parte del ejecutable final ni afectan el funcionamiento del programa.

Cuando el compilador encuentra estos comentarios (como //), simplemente no los toma en cuenta: no formarán parte del código binario generado.

Ejemplos de comentarios

Comentarios en múltiples líneas

En la mayoría de los lenguajes de programación, podemos definir comentarios en múltiples líneas empleando /* */. En JavaScript, Kotlin, Java, entre otros, funciona así:

/*
Esto es un comentario
En varias líneas
*/

En Python podemos emplear el siguiente esquema con triple comilla:

"""
Esto es un comentario
En varias líneas
"""

Comentarios en una sola línea

Los más sencillos se crean colocando dos barras diagonales (//) antes del texto:

// Comentario en una sola línea, lo empleamos en JavaScript, C, Java...

Y en Python se emplea el símbolo numeral # en su lugar:

# comentario en Python

Comentarios en HTML

En HTML, al ser un lenguaje de marcado (y no un lenguaje de programación), la sintaxis cambia un poco. Podemos crear comentarios de la siguiente manera:

<!-- 
Comentario HTML 
Podemos colocar tanto contenido como queramos
-->

11. Los arrays en programación

Los arrays (también conocidos como arreglos o vectores) son una estructura de datos fundamental en cualquier lenguaje de programación. Un array nos permite almacenar múltiples valores en una sola variable, organizados de forma secuencial. Son especialmente útiles cuando necesitamos trabajar con colecciones de datos: listas de productos, nombres de usuarios, puntuaciones, etc.

Para crear un array en JavaScript lo hacemos así:

var carros = ["Carro Corona", "Carro Fier", "Carro Safari", "Carro"];

Índices de los arrays

Para acceder a un elemento en particular dentro del array, utilizamos su índice, que es un valor numérico. Los índices en JavaScript (y en la mayoría de los lenguajes) comienzan en cero. Por ejemplo:

carros[0] // "Carro Corona"

Con el índice podemos acceder a todos los elementos del array. Para acceder al primero, empleamos el índice 0; al segundo, el 1:

var carros = ["Carro Corona", "Carro Fier", "Carro Safari", "Carro"]; 
carros[1] // "Carro Fier"

Y así para el resto de los elementos.

Extra: Array bidimensional (matrices)

Existen múltiples tipos de arrays. Aunque las matrices no son un esquema que vayas a emplear con frecuencia en la mayoría de tus proyectos web, veamos brevemente cómo funcionan.

Si un array es simplemente una lista de elementos que va en un solo sentido, un array bidimensional viene siendo un array de arrays: un array con dos dimensiones, similar a una hoja de cálculo. Además, podemos definir múltiples dimensiones, aunque en el desarrollo web rara vez necesitamos más de dos.

Tamaño de los arrays

Al igual que con los arrays de una sola dimensión, podemos definir el tamaño que queramos. Por ejemplo, un array bidimensional de 5×5:

matriz = [5][5]
* * * * *
* * * * *
* * * * *
* * * * *
* * * * *

Y un array de una dimensión de tamaño 5:

matriz = [5]
* * * * *

Arrays de dos dimensiones en JavaScript – Matrices

En JavaScript, podemos crear arrays de dos dimensiones de la siguiente manera:

var matriz = [1, 1, 2, 3, 5, [1, 2, 3]];

En este caso, estamos creando un array donde uno de sus elementos es otro array. Para acceder al primer elemento:

matriz[0] // 1

Para acceder al array anidado:

matriz[5] // [1, 2, 3]

Y para acceder a un elemento específico dentro del array anidado, especificamos el segundo índice:

matriz[5][2] // 3

12. Objetos en los lenguajes de programación

En el mundo real, un carro es un objeto, una mesa es un objeto; y en JavaScript tenemos maneras de representar este tipo de estructuras. Los objetos en JavaScript son un acercamiento simplificado a las clases soportadas por otros lenguajes de programación como PHP o Python.

Si analizamos un objeto del mundo real —como un carro—, veremos que tiene características (o propiedades) que nos permiten describirlo y diferenciarlo de otros: marca, modelo, peso, color, etc. En JavaScript podemos simular este comportamiento mediante los objetos.

Para crear un objeto en JavaScript lo hacemos de la siguiente manera:

var carro = {marca: "Fiat", modelo: 5000, color: "Blanco"};

Como puedes ver, es una estructura sencilla: pareciera que tenemos una variable que contiene sub-variables. Sin embargo, fíjate que la asignación interna cambia: ya no empleamos el signo =, sino los dos puntos :, porque ahora estamos trabajando con propiedades (también llamadas atributos) de un objeto.

Para acceder, por ejemplo, a la marca del carro:

carro.marca // "Fiat"

Simplemente accedemos al objeto llamado carro seguido de un punto y el nombre del atributo. Según el tipo de dato de estos atributos, podemos realizar las mismas operaciones que con las variables: sumar, restar, concatenar, etc.

También podemos acceder a cada uno de sus atributos para actualizar un valor:

carro.marca = "Toyota";