MATERIA:

Programación Web

CARRERA:

Ingeniería en Software y Minería de Datos

SEMESTRE: 4°

ACTIVIDAD:

Conceptos Básicos de JavaScript

DOCENTE:

Manuel Balderas Victoria

ALUMNO:
Jaime Jairo Flores Martínez

FECHA:

28/02/2024

1
 INDICE
INTRODUCCIÓN ............................................................................................................ 4
CONCEPTOS BÁSICOS DE JAVASCRIPT .................................................................... 5
VARIABLES ................................................................................................................ 5
• Var .................................................................................................................. 5
• Let ................................................................................................................... 7
• Const .............................................................................................................. 8
• Diferencias ................................................................................................... 10
• Buenas prácticas de nombrado de variables .............................................. 10
• Números ....................................................................................................... 11
• Operadores Aritméticos ............................................................................... 11
• Strings .......................................................................................................... 13
• Booleans ...................................................................................................... 13
• Null y undefined ........................................................................................... 15
• Arrays ........................................................................................................... 17
• Objetos (Objects) ......................................................................................... 18
OPERADORES ......................................................................................................... 18
• Operadores aritméticos ............................................................................... 18
• Operadores de asignación ........................................................................... 19
• Operadores de comparación ....................................................................... 19
• Operador de concatenación......................................................................... 20
• Operadores lógicos ...................................................................................... 20
ESTRUCTURAS DE CONTROL ................................................................................ 21
• Condicional If ............................................................................................... 21
• Condicional If / else ...................................................................................... 21
• Condicional Switch ...................................................................................... 22
• Bucle while ................................................................................................... 23

2
 • Bucle do ... while .......................................................................................... 23
FUNCIONES ............................................................................................................. 24
• Tipos de funciones ....................................................................................... 24
• Funciones por declaración .......................................................................... 24
• Funciones por expresión ............................................................................. 25
• Funciones como objetos ............................................................................. 26
• Funciones anónimas .................................................................................... 26
• Callbacks ...................................................................................................... 26
• Funciones autoejecutables .......................................................................... 27
• Arrow functions............................................................................................ 28
CONCLUSION .............................................................................................................. 30
BIBLIOGRAFIA ............................................................................................................ 31

3
 INTRODUCCIÓN
JavaScript, como lenguaje esencial en el desarrollo web, abre las puertas a la creación de
páginas interactivas y dinámicas. Antes de adentrarse en proyectos más ambiciosos, es
imprescindible comprender los fundamentos de este lenguaje.

En primer lugar, las variables actúan como contenedores para almacenar datos y valores
en el código. Pueden ser declaradas con var, let o const, cada una con su propio alcance y
reglas de reasignación. Una correcta práctica de nombrado y la comprensión del ámbito
son cruciales para mantener un código claro y organizado.

Los tipos de datos en JavaScript son diversos, abarcando números, cadenas de texto,
booleanos, arrays, objetos, y valores especiales como null y undefined. Entender estos tipos
es fundamental para manipular datos de manera efectiva en el desarrollo de aplicaciones
web.

Los operadores son herramientas clave para realizar diversas operaciones, desde cálculos
aritméticos hasta comparaciones, operaciones lógicas y concatenación de cadenas.
Dominar estos operadores permite realizar manipulaciones de datos precisas y eficientes
en el código.

Las estructuras de control, como if, else, switch, for, while y do-while, son esenciales para
controlar el flujo de ejecución del programa. Estas estructuras permiten tomar decisiones
condicionales, iterar sobre datos y ejecutar bloques de código repetidamente según sea
necesario.

Por último, las funciones en JavaScript son bloques de código reutilizable que realizan una
tarea específica. Pueden aceptar parámetros y devolver valores, lo que permite modularizar
el código y promover su reutilización. Comprender cómo definir, llamar y utilizar funciones
es esencial para escribir un código limpio y estructurado.

4
 CONCEPTOS BÁSICOS DE JAVASCRIPT

VARIABLES
• Var

Antes de la llegada de ES6, las declaraciones var eran las que mandaban. Sin embargo,
hay problemas asociados a las variables declaradas con var. Por eso fue necesario que
surgieran nuevas formas de declarar variables. En primer lugar, vamos a entender más
sobre var antes de discutir esos problemas.

Ámbito de var

El ámbito, significa esencialmente dónde están disponibles estas variables para su uso. Las
declaraciones var tienen un ámbito global o un ámbito de función/local.

El ámbito es global cuando una variable var se declara fuera de una función. Esto significa
que cualquier variable que se declare con var fuera de una función está disponible para su
uso en toda la pantalla.

var tiene un ámbito local cuando se declara dentro de una función. Esto significa que está
disponible y solo se puede acceder a ella dentro de esa función. Para entenderlo mejor,
miremos el siguiente ejemplo.

Aquí, saludar tiene un ámbito global porque existe fuera de la función mientras que hola
tiene un ámbito local. Así que no podemos acceder a la variable hola fuera de la función.
Así que si realizamos esto:

Obtendremos un error que se debe a que hola no está disponible fuera de la función.

5
 Las variables con var se pueden volver a declarar y modificar. Esto significa que podemos
hacer esto dentro del mismo ámbito y no obtendremos un error.

Hoisting de var

Hoisting es un mecanismo de JavaScript en el que las variables y declaraciones de

funciones se mueven a la parte superior de su ámbito antes de la ejecución del código. Esto
significa que si hacemos esto:

se interpreta así:

Entonces las variables con var se elevan a la parte superior de su ámbito y se inicializan
con un valor de undefined.

Problema con var

Hay una debilidad que viene con var. Usaremos el ejemplo de abajo para explicarlo:

6
 Por lo tanto, como tiempos > 3 devuelve true, saludar se redefine para "dice Hola también".
Aunque esto no es un problema si quieres redefinir saludar a conciencia, se convierte en
un problema cuando no te das cuenta de que la variable saludar ha sido definida antes.

Si has utilizado saludar en otras partes de tu código, puede que te sorprenda la salida que
puedes obtener. Esto probablemente causará muchos errores en tu código. Por eso son
necesarios let y const.

• Let

let es ahora preferible para la declaración de variables. No es una sorpresa, ya que es una
mejora de las declaraciones con var. También resuelve el problema con var que acabamos
de cubrir. Consideremos por qué esto es así.

Let tiene un ámbito de bloque

Un bloque es un trozo de código delimitado por {}. Un bloque vive entre llaves. Todo lo que
está dentro de llaves es un bloque.

Así que una variable declarada en un bloque con let solo está disponible para su uso dentro
de ese bloque. Se puede explicar con un ejemplo:

Vemos que el uso de hola fuera de su bloque (las llaves donde se definió) devuelve un error.
Esto se debe a que las variables let tienen un alcance de bloque.

Let puede modificarse, pero no volver a declararse.

Al igual que var, una variable declarada con let puede ser actualizada dentro de su ámbito.
A diferencia de var, una variable let no puede ser re-declarada dentro de su ámbito. Así que
mientras esto funciona:

7
 esto devolverá un error:

Sin embargo, si la misma variable se define en diferentes ámbitos, no habrá ningún error:

¿Por qué no hay ningún error? Esto se debe a que ambas instancias son tratadas como
variables diferentes, ya que tienen ámbitos diferentes. Este hecho hace que let sea una
mejor opción que var. Cuando se utiliza let, no hay que preocuparse de sí se ha utilizado
un nombre para una variable antes, puesto que una variable solo existe dentro de su ámbito.

Además, como una variable no puede ser declarada más de una vez dentro de un ámbito,
entonces el problema discutido anteriormente que ocurre con var no sucede.

Hoisting de let

Al igual que var, las declaraciones let se elevan a la parte superior. A diferencia de var que
se inicializa como undefined, la palabra clave let no se inicializa. Sí que, si intentas usar
una variable let antes de declararla, obtendrás un Reference Error.

• Const

Las variables declaradas con const mantienen valores constantes. Las declaraciones const
similitudes con las declaraciones let.

Las declaraciones const tienen un ámbito de bloque

Al igual que las declaraciones let, solamente se puede acceder a las declaraciones const
dentro del bloque en el que fueron declaradas.

8
 Const no puede modificarse ni volver a declararse

Esto significa que el valor de una variable declarada con const s el mismo dentro de su
ámbito. No se puede actualizar ni volver a declarar. Así que, si declaramos una variable con
const, no podemos hacer esto:

ni esto:

Por lo tanto, toda declaración const, debe ser inicializada en el momento de la declaración.

Este comportamiento es algo diferente cuando se trata de objetos declarados con const.
Mientras que un objeto const no se puede actualizar, las propiedades de este objeto sí se
pueden actualizar. Como resultado, si declaramos un objeto const como este:

mientras que no podemos hacer esto:

podemos hacer esto:

Esto actualizará el valor de saludar.mensaje sin devolver errores.

9
 Hoisting de const

Al igual que let, const las declaraciones const se elevan a la parte superior, pero no se
inicializan.

• Diferencias
o Las declaraciones var tienen un ámbito global o un ámbito función/local, mientras que
let y const tienen un ámbito de bloque.
o Las variables var pueden ser modificadas y re-declaradas dentro de su ámbito; las
variables let pueden ser modificadas, pero no re-declaradas; las variables const no
pueden ser modificadas ni re-declaradas.
o Todas ellas se elevan a la parte superior de su ámbito. Pero mientras que las variables
var se inicializan con undefined, let y const no se inicializan.
o Mientras que var y let pueden ser declaradas sin ser inicializadas, const debe ser
inicializada durante la declaración.

• Buenas prácticas de nombrado de variables

o Utiliza nombres descriptivos que indiquen el propósito de la variable.
o Usa camelCase para nombres de variables compuestas por múltiples palabras.
o Evita nombres genéricos y abreviaturas ambiguas. Es mejor tener nombres más largos
y descriptivos que abreviaturas oscuras.
o Si estás utilizando constantes (declaradas con const), considera nombrarlas con
mayúsculas y guiones bajos para distinguirlas fácilmente de las variables normales.

10
 TIPOS DE DATOS

• Números

Los values de tipo number son, sin sorpresa alguna, valores numéricos. Es decir, pedazos
de data que representan información numérica se representan con el tipo number. Esto
incluye números positivos, negativos, enteros y decimales. Además, el tipo de datos number
tiene tres valores simbólicos: +Infinity, -Infinity y NaN (no-un-número).

Ejemplo:

También se puede hacer uso de la notación científica para números muy grandes o muy
pequeños, añadiendo una "e" de "exponente", seguido por el exponente del número:

• Operadores Aritméticos

Lo principal que se hace con los números es aritmética. Sigamos explorando el

comportamiento del tipo de dato number en tu consola.

Ejemplo:

11
 Los símbolos + y * son llamados operators (operadores). El primero representa la suma y
el segundo la multiplicación. Al poner un operador entre dos valores, se aplicará la
operación a esos valores y producirá un nuevo valor. Como ves, la multiplicación ocurre
primero. Pero como en matemáticas, puedes cambiar esto encerrando en paréntesis la
suma.

Para la resta existe el operador -, y la división se puede hacer con el operador /.

También existe un operador aritmético más, que podrías no reconocer inmediatamente. El

símbolo % es usado para representar la operación residuo. X % Y resulta en el residuo de
dividir X entre Y. Por ejemplo, 314 % 100 produce 14 (porque 100 multiplicado por 3 + 14 =

12
 314), y 144 % 12 da 0 (porque 12 multiplicado por 12 + 0 = 144). Verás a menudo este
operador referido como módulo, aunque técnicamente residuo es más preciso.

• Strings

El siguiente data type básico es el String (cadena en español, ya que hace referencia a
cadena de caracteres). Es el tipo de dato que utilzamos para representar texto. Se declaran
al poner el contenido entre comillas.

Ejemplo:

Tanto las comillas simples como las dobles pueden ser usadas para declarar strings,
siempre y cuando coincidan al principio y al final. Casi cualquier cosa puede colocarse entre
comillas, y JavaScript creará un string value de esa cosa.

• Booleans

A menudo, necesitarás un valor que simplemente distinga entre dos posibilidades, como
"sí" y "no" o "encendido" y "apagado". Para esto, JavaScript tiene un tipo de dato boolean,
que tiene solo dos valores: true (verdadero) y false (falso).

13
 Operadores comparativos

Ejemplo:

Los signos > y < son los símbolos tradicionales para "mayor que" y "menor que",
respectivamente. Estos son operadores binarios (porque operan sobre dos valores).
Aplicarlos resulta en un valor de tipo boolean que indica si son ciertos.

Los strings pueden ser comparados de la misma manera.

La manera en que los strings son ordenadas es más o menos alfabéticamente: las letras
mayúsculas son siempre "menores" que las minúsculas, así que 'Z' < 'a' es true, y los
caracteres no alfabéticos (!, -, y así por el estilo) son también incluidos en el ordenamiento.
La comparación real está basada en el estándar Unicode.

14
 Otros operadores similares son >= (mayor o igual que), <= (menor o igual que), == (igual
que), y != (no es igual que).

Sólo existe un valor en JavaScript que no es igual a sí mismo, y este es NaN, que significa
"no es un número".

• Null y undefined

Existen dos valores especiales, escritos null y undefined, que son usados para denotar la
ausencia de un valor significativo. Son valores en sí mismos, pero no poseen ninguna
información. Muchas operaciones en el lenguaje que no producen un valor con significado
(lo verás después) producen undefined simplemente porque tienen que producir algún valor.

La diferencia en el significado entre undefined y null es un accidente del diseño de

JavaScript, y no importa la mayoría del tiempo.

Entender la diferencia entre undefined y null (sí hay una diferencia semántica) es
importante, y más sencillo de lo que parece. Ambos valores denotan la ausencia de un valor,
pero en un caso podríamos decir que es intencional (null) y en el otro no (undefined).

El valor undefined significa que no se ha asignado un valor, a diferencia de null, que significa
que hemos asignado el valor null. Esto puede ser muy útil para diferenciar estados en
operaciones asíncronas, ... es común que undefined signifique que la operación no ha
completado aún, mientras que null significa que completó, pero retornó un valor nulo.

15
 Conversión automática de tipo

Cuando un operador es aplicado al tipo "incorrecto" de valor, JavaScript convertirá

silenciosamente el valor en el tipo de dato que espera, usando un conjunto de reglas que a
menudo no son lo que tú quieres o esperas. Esto es llamado coerción de tipo.

Ejemplo:

El null en la primera expresión se vuelve 0, y el "5" en la segunda expresión se convierte

en 5 (de string a number). Aun así, en la tercera expresión, + intenta hacer concatenación
de strings antes de una suma numérica, así que el 1 es convertido en "1" (de number a
string). Cuando algo que no se corresponde con un número de manera obvia (como "cinco"
o undefined) es convertido a un número, el valor resultante es NaN. Las siguientes
operaciones aritméticas sobre NaN seguirán produciendo NaN. Por eso, en la cuarta
expresión, "cinco" * 2 retorna NaN.

En el caso de la quinta expresión, cuando comparamos valores que tienen tipos de dato
diferentes, JavaScript usa un complicado y confuso conjunto de reglas para determinar qué
hacer. En la mayoría de los casos, sólo trata de convertir uno de los valores al tipo de dato
del otro valor. Sin embargo, cuando null o undefined están en cualquier lado de la operación,
resulta verdadero sólo en el caso de que los dos lados sean null o undefined.

16
 Siguiendo con la quinta expresión, las reglas para convertir cadenas y números a
Booleanos dicen que 0, NaN y la cadena vacía ("") cuentan como false, mientras que todos
los demás valores cuentan como true. Debido a esto, las siguientes expresiones retornan
true:

Para casos en el que no quieres que ocurra ninguna conversión automática de tipos, existen
dos operadores extra: === y !==. El primera prueba si un valor es precisamente igual a otro,
y el segundo si no es precisamente igual. Por lo tanto, al cambiar de == a === las mismas
expresiones anteriores, tenemos el resutado contrario: false:

• Arrays

Son objetos que pueden almacenar múltiples valores en una sola variable, accesibles
mediante un índice numérico. Los elementos de un array pueden ser de cualquier tipo de
datos, incluyendo otros arrays u objetos.

17
 • Objetos (Objects)

Son colecciones de pares clave-valor. Cada clave es una cadena (o símbolo) que actúa
como un identificador único, y cada valor puede ser de cualquier tipo de datos, incluyendo
otros objetos u arrays.

OPERADORES
• Operadores aritméticos

Son los operadores que utilizamos para realizar operaciones matemáticas básicas. Los más
sencillos son los cuatro primeros, que forman parte de las operaciones matemáticas básicas
habituales:

18
 • Operadores de asignación
Al margen de los anteriores, también tenemos los operadores de asignación. Estos
operadores nos permiten asignar información a diferentes constantes o variables a través
del símbolo =, lo cual es bastante lógico pues así lo hacemos en matemáticas.

No obstante, también existen ciertas contracciones relacionadas con la asignación que nos
permiten realizar operaciones de una forma más compacta. Son las siguientes:

• Operadores de comparación

Los operadores de comparación son aquellos que utilizamos en nuestro código

(generalmente, en el interior de un if, aunque no es el único sitio donde podemos utilizarlos)
para realizar comprobaciones. Estas expresiones de comparación devuelven un booleano
con un valor de true o false.

19
 • Operador de concatenación
Anteriormente se menciónó que el operador + se utiliza para realizar operaciones
sumatorias. Esto es así cuando los dos operandos que utilizamos son números. Pero ¿qué
ocurre si no es así? En el siguiente ejemplo, puedes comprobar que ocurre cuando
utilizamos el operador + y alguno de nuestros operandos no es un:

Hay que analizar que salvo en el primer caso (donde tenemos dos ), el operador + funciona
como un concatenador, es decir, uniendo los dos , y en el caso que uno de ellos no lo sea,
lo convierte.

Esto puede complicarse aún más si vamos usando operandos con diferentes tipos de datos,
pero veremos eso un poco más adelante. Esto ocurre porque Javascript realiza lo que se
llama un proceso de conversión implícita donde traduce los tipos de datos al que considera
más oportuno.

• Operadores lógicos

Los operadores lógicos son muy utilizados en su forma básica, sin embargo, tienen
bastantes particularidades y matices, que intentaré explicar en esta sección. Dentro del
apartado de operadores lógicos tenemos los siguientes:

20
 ESTRUCTURAS DE CONTROL
• Condicional If

Quizás, el más conocido de estos mecanismos de estructura de control es el if (condicional).

Con él podemos indicar en el programa que se tome un camino sólo si se cumple la
condición que establezcamos.

Ejemplo:

En este caso, como el valor de nota es superior o igual a 5, nos aparecerá en la consola el
mensaje «¡Estoy aprobado!». Sin embargo, si modificamos en la primera línea el valor de
nota a un valor inferior a 5, no nos aparecerá ese mensaje.

• Condicional If / else

Se puede dar el caso que queramos establecer una alternativa a una condición. Para eso
utilizamos el if seguido de un else. Con esto podemos establecer una acción A si se cumple
la condición, y una acción B si no se cumple.

En este ejemplo se comprueba que podemos conseguir que se muestre el mensaje Estoy
aprobado o Estoy suspendido dependiendo del valor que tenga la variable nota.

21
 Por último, el console.log del final, muestra el contenido de la variable calificación,
independientemente de que sea el primer caso o el segundo.

• Condicional Switch

La estructura de control switch permite definir casos específicos a realizar cuando la

variable expuesta como condición sea igual a los valores que se especifican a continuación
mediante cada case:

• Hay varias puntualizaciones que aclarar sobre este ejemplo:

• La sentencia switch establece que vamos a realizar múltiples condiciones analizando la
variable nota.
• Cada condición se establece mediante un case, seguido del valor posible de cada caso.
• El switch comienza evaluando el primer case, y continua con el resto, hacia abajo.
• Algunos case tienen un break. Esto hace que deje de evaluar y se salga del switch.
• Los case que no tienen break, no se interrumpen, sino que se salta al siguiente case.
• El caso especial default es como un else. Si no entra en ninguno de los anteriores, entra
en default.

22
 • Bucle while

El bucle while es uno de los bucles más simples que podemos crear. Repasando el siguiente
ejemplo y analizando todas sus partes, para luego analizar lo que ocurre en cada iteración
del bucle. Empecemos por un fragmento sencillo del bucle:

Veamos qué es lo que ocurre a la hora de ejecutar este código:

o Antes de entrar en el bucle while, se inicializa la variable i al valor 0.

o Antes de realizar la primera iteración del bucle, comprobamos la condición.
o Si la condición es verdadera, hacemos las tareas que están indentadas dentro del bucle.
o Mostramos por pantalla el valor de i.
o Luego, incrementamos el valor de i sumándole 1 a lo que ya teníamos en i.
o Terminamos la iteración del bucle, por lo que volvemos al inicio del while a hacer una
nueva iteración.
o Volvemos al punto 2) donde comprobamos de nuevo la condición del bucle.
o Repetimos hasta que la condición sea falsa. Entonces, salimos del bucle y continuamos
el programa.

• Bucle do ... while

Existe una variación del bucle while denominado bucle do while. La diferencia fundamental,
a parte de variar un poco la sintaxis, es que este tipo de bucle siempre se ejecuta una vez,
al contrario que el bucle while que en algún caso podría no ejecutarse nunca. Ejemplo:

23
 Observa, que aun teniendo un bucle, este ejemplo nunca mostrará el texto Hola a todos,
puesto que la condición nunca será verdadera, porque ya ha empezado como falsa (i ya
vale 5 desde el inicio). Por lo tanto, nunca se llega a realizar el interior del bucle.

Con el bucle do while podemos obligar a que siempre se realice el interior del bucle al
menos una vez:

FUNCIONES
• Tipos de funciones

Hay varias formas de crear funciones en Javascript: por declaración (la más usada por
principiantes), por expresión (la más habitual en programadores con experiencia) o
mediante constructor de objeto (no recomendada):

• Funciones por declaración

Probablemente, la forma más popular de estas tres, y a la que estaremos acostumbrados

si venimos de otros lenguajes de programación, es la primera, a la creación de funciones
por declaración. Esta forma permite declarar una función que existirá a lo largo de todo el
código:

24
 De hecho, podríamos ejecutar la función saludar() incluso antes de haberla creado y
funcionaría correctamente, ya que Javascript primero busca las declaraciones de funciones
y luego procesa el resto del código.

• Funciones por expresión

Sin embargo, en Javascript es muy habitual encontrarse códigos donde los programadores
«guardan funciones» dentro de variables, para posteriormente «ejecutar dichas variables».
Se trata de un enfoque diferente, creación de funciones por expresión, que
fundamentalmente, hacen lo mismo con algunas diferencias:

Con este nuevo enfoque, estamos creando una función en el interior de una variable, lo que
nos permitirá posteriormente ejecutar la variable (como si fuera una función). Observa que
el nombre de la función (en este ejemplo: saludar) pasa a ser inútil, ya que si intentamos
ejecutar saludar() nos dirá que no existe y si intentamos ejecutar saludo() funciona
correctamente.

¿Qué ha pasado? Ahora el nombre de la función pasa a ser el nombre de la variable,

mientras que el nombre de la función desaparece y se omite, dando paso a lo que se llaman
las funciones anónimas (o funciones lambda).

25
 • Funciones como objetos
Como curiosidad, debes saber que se pueden declarar funciones como si fueran objetos.
Sin embargo, es un enfoque que no se suele utilizar en producción. Simplemente es
interesante saberlo para darse cuenta de que en Javascript todo pueden ser objetos:

• Funciones anónimas

Las funciones anónimas o funciones lambda son un tipo de funciones que se declaran sin
nombre de función y se alojan en el interior de una variable y haciendo referencia a ella
cada vez que queramos utilizarla:

Observa que, en la última línea del ejemplo anterior, estamos ejecutando la variable, es
decir, ejecutando la función que contiene la variable. Sin embargo, en la línea anterior
hacemos referencia a la variable (sin ejecutarla, no hay paréntesis) y nos devuelve la
función en sí.

La diferencia fundamental entre las funciones por declaración y las funciones por expresión
es que estas últimas sólo están disponibles a partir de la inicialización de la variable. Si
«ejecutamos la variable» antes de declararla, nos dará un error.

• Callbacks
Ahora que conocemos las funciones anónimas, podremos comprender más fácilmente
como utilizar callbacks (también llamadas funciones callback o retrollamadas). A grandes
rasgos, un callback (llamada hacia atrás) es pasar una función B por parámetro a una
función A, de modo que la función A puede ejecutar esa función B de forma genérica desde
su código, y nosotros podemos definirlas desde fuera de dicha función:

26
 Esto nos podría permitir crear varias funciones para utilizar a modo de callback y reutilizarlas
posteriormente con diferentes propósitos.

Viendo este ejemplo, podemos planear ejecutar la función fA() cambiando los callbacks
según nos interese, sin necesidad de crear funciones con el mismo código repetido una y
otra vez.

• Funciones autoejecutables

Pueden existir casos en los que necesites crear una función y ejecutarla sobre la marcha.
En Javascript es muy sencillo crear funciones autoejecutables. Básicamente, sólo tenemos
que envolver entre paréntesis la función anónima en cuestión (no necesitamos que tenga
nombre, puesto que no la vamos a guardar) y luego, ejecutarla:

27
 De hecho, también podemos utilizar parámetros en dichas funciones autoejecutables.
Observa que sólo hay que pasar dichos parámetros al final de la función autoejecutable.

Ten en cuenta, que, si la función autoejecutable devuelve algún valor con return, a diferencia
de las funciones por expresión, en este caso lo que se almacena en la variable es el valor
que devuelve la función autoejecutada:

• Arrow functions

Las Arrow functions, funciones flecha o «fat arrow» son una forma corta de escribir
funciones que aparece en Javascript a partir de ECMAScript 6. Básicamente, se trata de
reemplazar eliminar la palabra function y añadir => antes de abrir las llaves:

28
 Sin embargo, las funciones flechas tienen algunas ventajas a la hora de simplificar códigos
bastante interesantes:

• Si el cuerpo de la función sólo tiene una línea, podemos omitir las llaves ({}).
• Además, en ese caso, automáticamente se hace un return de esa única línea, por lo
que podemos omitir también el return.
• En el caso de que la función no tenga parámetros, se indica como en el ejemplo anterior:
() =>.
• En el caso de que la función tenga un solo parámetro, se puede indicar simplemente el
nombre del mismo: e =>.
• En el caso de que la función tenga 2 ó más parámetros, se indican entre paréntesis: (a,
b) =>.
• Si queremos devolver un objeto, que coincide con la sintaxis de las llaves, se puede
englobar con paréntesis: ({name: 'Manz'}).

Por lo tanto, el ejemplo anterior se puede simplificar aún más:

Las funciones flecha hacen que el código sea mucho más legible y claro de escribir,
mejorando la productividad y la claridad a la hora de escribir código.

29
 CONCLUSION
En conclusión, los conceptos básicos de JavaScript son los pilares fundamentales que
sustentan cualquier proyecto en el desarrollo web. Desde la manipulación de variables y
tipos de datos hasta el uso de operadores, estructuras de control y funciones, estos
conceptos proporcionan la base sobre la cual se construyen aplicaciones dinámicas y
efectivas.

Dominar estos fundamentos no solo es crucial para escribir un código claro, eficiente y
mantenible, sino que también proporciona la confianza y la competencia necesarias para
enfrentar desafíos más complejos en el desarrollo web.

Al comprender y aplicar correctamente estos conceptos básicos, los desarrolladores están

mejor preparados para crear experiencias web interactivas y dinámicas que satisfagan las
necesidades y expectativas de los usuarios modernos. En resumen, una sólida
comprensión de los conceptos básicos de JavaScript es el primer paso hacia el éxito en el
mundo del desarrollo web.

30
 BIBLIOGRAFIA

• Keiler Guardo Herrera. (2022, February 10). var, let y const: ¿Cuál es la

diferencia? FreeCodeCamp.org; freeCodeCamp.org.

https://www.freecodecamp.org/espanol/news/var-let-y-const-cual-es-la-diferencia/
• Laboratoria Curriculum. (2024). Laboratoria.la.

https://curriculum.laboratoria.la/es/topics/javascript/basics/values-variables-and-types

• Operadores avanzados - Javascript en español. (2024). Lenguajejs.com.

https://lenguajejs.com/javascript/introduccion/operadores-avanzados/

• Condicionales If / else - Javascript en español. (2024). Lenguajejs.com.

https://lenguajejs.com/fundamentos/estructuras-de-control/condicionales-if-else/

• Condicionales Switch - Javascript en español. (2024). Lenguajejs.com.

https://lenguajejs.com/fundamentos/estructuras-de-control/condicionales-switch/

• Bucles while - Javascript en español. (2024). Lenguajejs.com.

https://lenguajejs.com/fundamentos/bucles-e-iteraciones/bucles-while/
• Bucles for - Javascript en español. (2024). Lenguajejs.com.

https://lenguajejs.com/fundamentos/bucles-e-iteraciones/bucles-for/

• Funciones - Javascript en español. (2024). Lenguajejs.com.

https://lenguajejs.com/javascript/introduccion/funciones/

31
32