En esta publicación revisaremos los siguientes temas:

  1. ¿Qué es JavaScript?
  2. Variables y Tipos de Datos
  3. Mutación de Variables y Coerción de Tipos
  4. Operadores Básicos
    1. Precedencia de Operadores
  5. Estructuras de Control
    1. Lógica Booleana
    2. Sentencia switch
    3. Valores Falsy y Truthy
  6. Funciones
    1. Instrucciones y Expresiones
  7. Arreglos
  8. Objetos
    1. Métodos de objetos
  9. Bucles
    1. Bucle While
    2. Bucle For
  10. 🪬 Nota Importante: ES5, ES6/ES2015 y ES2016

¿Qué es JavaScript?

JavaScript es un lenguaje de programación de computadoras ligero, multiplataforma y multiparadigma.

  • Ligero significa que es un lenguaje que no utiliza mucha memoria de la computadora y está compuesto por una sintaxis y características sencillas.
  • Multiplataforma significa que puede ser utilizado en múltiples plataformas y sistemas.
  • Multiparadigma significa que es un lenguaje que puede usar progamación basada en objetos y programación funcional.

JavaScript es una de las tres tecnologías fundamentales del desarrollo web (HTML y CSS son las otras 2). Hoy en día, JavaScript puede usarse en diferentes entornos:

  • Del lado del cliente: JavaScript se usaba tradicionalmente solo en el navegador.
  • Del lado del servidor: Gracias a Node.js, podemos usar JavaScript también en el servidor.

JavaScript es lo que ha hecho posible el desarrollo web moderno a través de efectos dinámicos e interactividad. Es importante mencionar que hoy en día existen muchas bibliotecas y frameworks de JavaScript que implementan diferentes arquitecturas y ayudan a los desarrolladores a construir aplicaciones complejas de manera más eficiente y rápida que nunca. Todas estas bibliotecas y frameworks están basados en JavaScript, por lo que, antes de utilizarlos, los desarrolladores deben ser buenos en JavaScript y entenderlo bien.

Una biblioteca es simplemente un archivo con funciones/métodos u otro código reutilizable que puedes enlazar y usar en tu propio código. Por otro lado un marco de trabajo (framework) es un término amplio. Wikipedia dice que un framework es un entorno de software universal y reutilizable que proporciona funcionalidad particular. Los frameworks de software pueden incluir programas de soporte, compiladores, bibliotecas de código, conjuntos de herramientas e interfaces de programación de aplicaciones (APIs) que reúnen todos los diferentes componentes para permitir el desarrollo de un proyecto o sistema.

JavaScript puede crearse en 2 formas:

  1. Script en línea: Poniendo el código JavaScript dentro de la etiqueta <script>.
  2. Script externo: Escribir el código JavaScript en un archivo externo e importarlo usando el atributo src de la etiqueta <script>.

Variables y Tipos de Datos

Una variable es un contenedor en el que podemos almacenar un valor para usarlo posteriormente. Al guardar un valor en una variable, no es necesario escribirlo cada vez que queramos usarlo.

El tipo de dato de un valor es un atributo que nos dice qué tipo de dato puede contener ese valor. En otras palabras, es una clasificación de datos que le indica al compilador o intérprete cómo el programador pretende usar los datos. En JavaScript tenemos los siguientes tipos de datos primitivos:

  • Number: Números de punto flotante, para decimales y enteros.
  • String: Secuencia de caracteres, usada para texto.
  • Boolean: Un tipo de dato lógico que solo puede ser true (verdadero) o false (falso).
  • Undefined: Tipo de dato de una variable que aún no tiene valor.
  • Null: También significa no existente.

JavaScript tiene una característica llamada tipado dinámico. Esto significa que el programador no tiene que definir manualmente el tipo de dato de la variable. JavaScript determina el tipo de dato por sí mismo, lo que significa que incluso podemos cambiar el tipo de una variable más adelante en nuestro código. Esto puede ser muy útil, pero también puede ser la fuente de errores difíciles de encontrar. Existe una envoltura para evitar el tipado dinámico en JavaScript llamada TypeScript.

Mutación de Variables y Coerción de Tipos

La coerción de tipos es una característica de JavaScript relacionada con el tipado dinámico. Básicamente significa que, cuando tienes diferentes tipos de datos y los mezclas, JavaScript intenta automáticamente averiguar qué variable debe convertir y luego las convierte todas al mismo tipo. Veamos algunos ejemplos:

    var name = 'Edward';
    var age = 20;
    
    console.log(nombre + edad); //-> 'Edward20' (Aplica coerción de tipos sobre la edad, convirtiéndola en una cadena de texto)
    console.log(edad + edad); //-> 40

La mutación de variables es, como su nombre indica, cambiar el valor de una variable. Consideremos el siguiente ejemplo como una continuación del código anterior:

    age = 'twenty;
    console.log(age); //-> 'Twenty'

En este código, cambias el valor de la variable edad de 20 a “veinte”. Observa que no usaste la palabra clave var porque solo se usa para declarar variables la primera vez. Es importante saber que el compilador de JavaScript lee nuestro código en una secuencia de instrucciones de arriba hacia abajo.

Operadores Básicos

Los operadores son construcciones que se comportan generalmente como funciones, pero que difieren sintáctica o semánticamente de las funciones usuales. Los tipos más comunes de operadores simples son:

  • Operadores aritméticos.
  • Operadores de comparación.
  • Operadores de asignación.
  • Operadores lógicos.

Un aspecto esencial de los operadores es el orden en el que el lenguaje de programación ejecuta estas operaciones. En JavaScript, existen precedencias de operadores para definir cuáles se ejecutan primero y cuáles se completan después. Las matemáticas establecen la precedencia, pero JavaScript cuenta con varios operadores, y toda la precedencia de ellos se define en una tabla de referencia. Con este contexto, podemos identificar los valores de la siguiente operación:

    var randomOperationsValue = 3 + 5 * 5 - 2;
    console.log(randomOperationsValue); //-> 26

Precedencia de Operadores

Como mencioné antes, la precedencia de operadores define qué operador se ejecuta primero. Para ilustrar el concepto, analicemos el siguiente código donde, dado un birthYear (año de nacimiento), determinaremos si una persona es mayor de edad.

    var no = 2018;
    var birthYearEdward = 1991;
    var fullAge = 18;
    
    var isFullAge = now - birthYearEdward >= fullAge; //-> True

Nuestra atención está en la última línea de código. Allí estamos usando tres operadores: >=, - y =. Para validar la precedencia de cada operador, podemos consultar la Tabla de Precedencia de Operadores de JavaScript. En esa tabla, tenemos:

PrecedenciaTipo de operadorAsociatividadOperadores individuales
3Asignaciónderecha a izquierda...=...
11Mayor o igual que (>=)izquierda a derecha...>=...
13Resta (-)izquierda a derecha...-...

Entonces, ¿cómo sabe JavaScript cuál operador ejecutar primero? Imagina que primero se ejecuta birthYearEdward >= fullAge. Esto devolvería un valor true o false. Luego now - true, pero esto no tendría sentido y, por supuesto, no sería lo que queremos.

En cambio, queremos que primero se ejecute now - birthYearEdward, y luego comparar esa edad con el valor de fullAge. Esta es la ejecución que sigue JavaScript porque, como puedes ver, el operador - tiene una mayor precedencia que el operador >=. Finalmente, se ejecuta el = porque este operador tiene una precedencia más baja que los demás.

Veamos un ejemplo de asignación múltiple para comprender qué significa la columna de asociatividad de la tabla:

    // Multiple Assignment
    var x, y
    
    x = y = (3 + 5) * 4 - 6 // 26
    
    // More operators
    x *= 2 // 54
    x += 10 // 64
    x++ // 65
    x-- // 64

En la tabla de precedencia podemos observar lo siguiente:

PrecedenciaTipo de operadorAsociatividadOperadores individuales
13Sumaizquierda a derecha+
14Multiplicaciónizquierda a derecha*
20Agrupamienton/a( ... )

Entonces, ¿cómo ejecutará JavaScript x = y = (3 + 5) * 4 - 6? Primero, comenzará con (3 + 5) porque el operador de agrupamiento ( ... ) tiene la mayor precedencia. Luego obtenemos 8. Segundo, JavaScript ejecutará 8 * 4, porque el operador * tiene mayor precedencia que - . Luego obtenemos 32. Tercero, ejecutará 32 - 6 para obtener 26.

Estructuras de Control

JavaScript, como la mayoría de los lenguajes de programación, tiene un par de estructuras de control.

Estructuras de Control: Las estructuras de control permiten ejecutar solo ciertas partes de nuestro código –las sentencias if/else – o ejecutar algunas partes múltiples veces –los bucles–.

Las sentencias if/else nos permiten tomar decisiones con nuestro código dependiendo de una condición. Para evitar malentendidos en JavaScript al momento de definir una condición, debes comprender la diferencia entre los operadores == y ===. La principal diferencia es que == permite la coerción de tipos y === no. Es una buena práctica usar === para tener control sobre la coerción de tipos en JavaScript.

Lógica Booleana

La lógica booleana es una rama de la informática que se encarga de los valores verdaderos y falsos. Para lograr esto, debes usar varios operadores lógicos (AND &&, OR || y NOT !). Aprender esto te ayudará a dominar las sentencias if/else en los lenguajes de programación. A continuación, puedes ver las respectivas tablas de verdad de los operadores lógicos AND y OR. Las tablas de verdad nos permiten ver el resultado de los operadores al momento de evaluar las variables.

ANDTrueFalse
TrueTrueFalse
FalseFalseFalse

AND && => Verdadero si todos son verdaderos.

ORTrueFalse
TrueTrueTrue
FalseTrueFalse

OR || => Verdadero si uno es verdadero. NOT ! => Invierte el valor verdadero/falso.

De acuerdo con la siguiente explicación, tenemos los siguientes ejemplos:

    var age = 16;
    
    age >= 20;      //-> Falso
    age < 30;       //-> Verdadero
    !(age < 30)     //-> Falso
    
    age >= 20 && age < 30; //-> Falso
    age >= 20 || age < 30; //-> Verdadero

Sentencia switch

La sentencia switch es otra forma de tomar decisiones en JavaScript. Es adecuada cuando tienes muchos casos diferentes para una variable, evitando el abuso de las sentencias if/else if/else. A continuación, un ejemplo de una sentencia switch:

    var job = 'teacher';
    
    switch:
        case 'teacher':
            console.log('Hohenheim teaches kids.');
            break;
        case 'driver':
            console.log('Hohenheim drives a car in Amestris.');
            break;
        case 'cop':
            console.log('Hohenheim fights crime.');
            break;
        default:
            console.log('Hohenheim does something else.');
            break;

JavaScript ahora revisará cada uno de estos casos uno por uno y decidirá cuál es el correcto. La palabra clave break es necesaria en caso de que JavaScript decida que este es el caso correcto, entonces después de esto, necesita salir de la sentencia switch sin revisar los otros casos diferentes.

Valores Falsy y Truthy

En JavaScript, un valor Falsy es un valor que se considera false cuando se evalúa en una condición if/else. Estos valores son: undefined, null, 0, '' (cadena vacía) y NaN. Para ilustrar este concepto, revisemos el siguiente ejemplo:

    var height;
    
    if (height) {
        console.log('Variable is defined')
    } else {
        console.log('Variable has NOT been defined') // Printed value
    }

En el código anterior, declaramos la variable height pero nunca la definimos. Entonces, cuando JavaScript evalúa el valor en la sentencia if/else, obtenemos undefined y lo convierte en falso. Es por eso que los llamamos Falsy, porque no son exactamente falsos, pero resultarán ser falsos cuando se evalúen en una condición if/else.

Además, tenemos valores Truthy, que son aquellos que se consideran verdaderos cuando se evalúan en una condición if/else. Básicamente, son todos los valores que no son Falsy. Para ilustrarlo, arreglemos el último ejemplo:

    var height = 20;
    
    if (height) {
        console.log('Variable is defined') // Printed value
    } else {
        console.log('Variable has NOT been defined')
    }

Aquí, height está definida y luego se evalúa como verdadero en la sentencia if/else.

Funciones

Imagina que tienes un fragmento de código que deseas ejecutar muchas veces. Además, quieres usarlo una y otra vez en tu código. En lugar de escribirlo repetidamente, puedes poner este fragmento de código dentro de una función.

Las funciones son contenedores que almacenan un par de líneas de código. En estos contenedores, puedes pasar argumentos, ya que la función puede recibir información desde fuera y, finalmente, la función puede devolver un resultado. Puedes pensar en las funciones como una máquina que recibe algunos insumos, hace algo con ellos y genera un resultado. Las funciones son una herramienta vital para combatir el principio de programación DRY (Don’t Repeat Yourself o “No te repitas”). Para evitar la repetición de código, solemos usar funciones. En el siguiente ejemplo usamos funciones para calcular la edad y el tiempo de jubilación:

    function calculateAge(yearOfBirth) {
        var age = 2018 - yearOfBirth;
    
        return age;
    }
    
    var ageEdward = calculateAge(2000); //-> 18
    var ageAlphonse = calculateAge(2002); //->16
    var ageHohenheim = calculateAge(1900); //-> 118
    
    
    function yearsUntilRetirement(name, year) {
        var age = calculateAge(year),
            retirement = 65 - age;
        if(retirement > 0) {
            console.log(name + ' retires in ' + retirement + ' years');
        } else {
            console.log(name + ' is already retired');
        }
    }
    
    yearsUntilRetirement('Edward', 2000); //-> 'Edward retires in 47 years'
    yearsUntilRetirement('Alphonse', 2002); //-> 'Alphonse retires in 49 years'
    yearsUntilRetirement('Hohenheim', 1900); //-> 'Hohenheim is already retired'

Instrucciones y Expresiones

Antes de continuar, es una buena idea entender que en JavaScript las funciones pueden ser definidas en términos de expresiones o instrucciones. La diferencia entre una instrucción y una expresión es que una expresión produce un valor, un resultado inmediato, mientras que una instrucción simplemente realiza una acción. A continuación, puedes ver ejemplos de cada una:

    // Expressions
    var x = 3;
    3 + 2
    
    // Statements
    if (x === 5) {
        //Do something ...
    }

En JavaScript puedes identificar si una función es una expresón o una instrucción de acuerdo a la sintáxis usada:

    function fnStatement() {
        // code
    }
    
    var fnExpression = function() {
        // code
    }

Arreglos

En las notas anteriores, dentro de los ejemplos, utilizamos diferentes variables para diferentes personas. Estas variables podrían agruparse en una sola variable. JavaScript tiene diferentes formas de agrupar datos y una de ellas son los arreglos. El siguiente código muestra un arreglo de nombres y un arreglo de años:

    var names = ['Edward', 'Alphonse', 'Hohenheim'];
    var years = new Array(2000, 2002, 1900);
    
    console.log(names) //-> ['Edward', 'Alphonse', 'Hohenheim']
    console.log(names[1]) //-> Alphonse

Como puedes ver, existen dos formas de definir un arreglo. La más comúnmente utilizada es la primera. Un arreglo puede contener tantos tipos de datos diferentes como queramos. Para acceder a un elemento de un arreglo, debes usar el índice. En JavaScript, los arreglos son indexados desde cero, por lo que el primer elemento del arreglo tiene el índice 0. Además, JavaScript ofrece un conjunto de funciones para agregar/eliminar elementos en un arreglo, cambiando el arreglo original:

  • .push(elemento): Agrega un elemento en la última posición del arreglo.
  • .unshift(elemento): Agrega un elemento en la primera posición del arreglo.
  • .pop(): Elimina un elemento en la última posición del arreglo.
  • .shift(): Elimina un elemento en la primera posición del arreglo.
  • .indexOf(elemento): Devuelve el índice del elemento pasado como parámetro.

Objetos

Los objetos son probablemente el tema más importante en JavaScript. Al igual que los arreglos, los objetos nos permiten almacenar varias variables en una sola variable. Una diferencia entre los objetos y los arreglos es la forma de acceder a los elementos. En un arreglo, utilizas un número de orden y en un objeto, utilizas un nombre específico —una clave—. En los objetos, tienes pares clave/valor, lo que significa que cada valor tiene una clave. Usas objetos para agrupar diferentes variables que no tienen un orden particular. En el siguiente ejemplo, utilizaremos un objeto para definir los datos asociados a una persona:

    var edward = {
        name: 'Edward',
        lastName: 'Elric',
        yearOfBirth: 2000,
        job: 'Alchemist',
        isMarried: true
    };
    
    
    console.log(edward) //-> Prints the edward object
    console.log(edward.job) //-> 'Alchemist'. To access the edward object you can use the dot notation
    console.log(edward['yearOfBirth']) //-> 2000. To access the edward object you can also use the brackets notation
    
    var alphonse =  new Object();
    
    alphonse.name = 'Alphonse';
    alphonse.lastName = 'Elric';
    alphonse.yearOfBirth = 2002;
    alphonse.job = 'Alchemist';
    alphonse.isMarried = false;

Como puedes ver, existen dos maneras de definir un objeto. La más comúnmente utilizada es la primera. Además, tenemos dos formas de acceder a las propiedades de un objeto: la notación de punto y la notación de corchetes. La mutación de objetos se realiza a través del acceso a las propiedades, de manera similar a la mutación de arreglos.

¿Cuál es la diferencia entre una Clase y un Objeto?

Un Objeto es una colección de datos relacionados. Un objeto puede tener propiedades (variables que pertenecen al objeto) y métodos (funciones que pertenecen al objeto). Podemos acceder a ellos utilizando notación de punto o notación de corchetes. Una Clase funciona como un constructor de funciones y además puedes definir métodos dentro de una clase, los cuales serán heredados por las instancias de esta clase.

Métodos de objetos

Los métodos de objetos son una característica específica de los objetos en JavaScript. Como puedes ver, un objeto puede contener diferentes tipos de datos, como un entero, una cadena, un booleano e inclusive un arreglo. Pero eso no es todo lo que un objeto puede contener; los objetos también pueden tener otros objetos o funciones. A continuación, puedes ver un ejemplo de código de un objeto que contiene un array y una expresión de función:

    var edward = {
        name: 'Edward',
        lastName: 'Elric',
        yearOfBirth: 2000,
        job: 'Alchemist',
        isMarried: true
        family: ['Trisha', 'Hohenheim', 'Alphonse'],
        calculateAge: function(yearOfBirth) {
            return 2018 - yearOfBirth;
        }
    };
    
    console.log(edward); //-> Prints the edward object
    console.log(edward.family); //-> ['Trisha', 'Hohenheim', 'Alphonse']
    console.log(edward.family[2]); //-> 'Alphonse'
    console.log(edward.calculateAge(2000)); //-> 18

La clave calculateAge dentro del objeto edward es solo una variable, y luego se le asigna una función. Para acceder a la función calculateAge, puedes usar la notación de punto. Por lo tanto, los objetos pueden contener funciones, y estas funciones se llaman métodos. Con este contexto, puedes decir que las funciones push(element) y pop() son métodos del objeto Array. Ahora, puedes mejorar la expresión de la función calculateAge() porque podrías usar la propiedad yearOfBirth dentro del objeto edward para calcular la edad. Para lograr esto, podemos usar la palabra clave this:

    var edward = {
        name: 'Edward',
        lastName: 'Elric',
        yearOfBirth: 2000,
        job: 'Alchemist',
        isMarried: true
        family: ['Trisha', 'Hohenheim', 'Alphonse'],
        calculateAge: function() {
            this.age = 2018 - this.yearOfBirth;
        }
    };
    edward.calculateAge();
    console.log(edward); //-> Prints the edward object with the age property

El this en este ejemplo se referirá al objeto edward. Entonces, edward es el objeto que tiene el método calculateAge() y la propiedad yearOfBirth, y la palabra clave this puede recuperar estos valores directamente de su propio objeto. Por otro lado, puedes almacenar automáticamente el resultado de calculateAge() dentro del objeto edward. La propiedad this.age nos permite lograr eso. En el método calculateAge(), estás creando una nueva propiedad, calculando la edad y asignando la edad calculada a esta propiedad. La ventaja de esta estructura y del uso de this es la flexibilidad, porque si creas otro objeto con un yearOfBirth diferente, la edad se calculará con este valor, excluyendo el contexto del objeto edward.

El this en este ejemplo se referirá al objeto edward. Entonces, edward es el objeto que tiene el método calculateAge() y la propiedad yearOfBirth, y la palabra clave this puede recuperar estos valores directamente de su propio objeto. Por otro lado, puedes almacenar automáticamente el resultado de calculateAge() dentro del objeto edward. La propiedad this.age nos permite lograr eso. En el método calculateAge(), estás creando una nueva propiedad, calculando la edad y asignando la edad calculada a esta propiedad. La ventaja de esta estructura y del uso de this es la flexibilidad, porque si creas otro objeto con un yearOfBirth diferente, la edad se calculará con este valor, excluyendo el contexto del objeto edward.

El this en este ejemplo se referirá al objeto edward. Entonces, edward es el objeto que tiene el método calculateAge() y la propiedad yearOfBirth, y la palabra clave this puede recuperar estos valores directamente de su propio objeto. Por otro lado, puedes almacenar automáticamente el resultado de calculateAge() dentro del objeto edward. La propiedad this.age nos permite lograr eso. En el método calculateAge(), estás creando una nueva propiedad, calculando la edad y asignando la edad calculada a esta propiedad. La ventaja de esta estructura y del uso de this es la flexibilidad, porque si creas otro objeto con un yearOfBirth diferente, la edad se calculará con este valor, excluyendo el contexto del objeto edward.

Bucles

Los bucles son otra familia de estructuras de control en JavaScript. Los bucles son un aspecto muy importante de cualquier lenguaje de programación, ya que ayudan al programador a manejar tareas repetitivas. En lugar de escribir diez líneas de código para ejecutar la misma tarea, solo tienes que seguir la estructura del bucle para lograr el mismo resultado con pocas líneas de código. La estructura de un bucle se compone de: un contador, una condición y una acción para actualizar el contador. JavaScript tiene dos tipos populares de bucles: while y for.

Bucle While

A continuación, se muestra la estructura de un bucle while para una tarea que imprime los números del 0 al 9:

    var i = 0; // El contador
    
    while (i < 10) { // La condición
        console.log(i);
        i++; // Acción para actualizar el contador
    }

Bucle For

A continuación, se muestra la estructura de un bucle for para lograr la misma tarea:

    for (var i = 0; i < 10; i++) { // Todos los elementos de un bucle están en esta línea
        console.log(i);
    }

Los bucles son una buena estructura de control para interactuar con arreglos:

    names = ['Edward', 'Alphonse', 'Trisha', 'Hohenheim'];
    
    for (var i = 0; i < names.length; i++) { // .length es un método del objeto arreglo que devuelve la longitud del arreglo
        console.log(names[i]);
    }
    
    // Para recorrer el arreglo desde el último hasta el primer elemento
    for (var i = names.length - 1; i >= 0; i--) {
        console.log(names[i]);
    }

Además, el bucle for tiene mecanismos para romper o continuar el flujo del bucle bajo una condición. El siguiente ejemplo imprime los números del 1 al 5, excepto el 3:

    for (var i = 0; i < 5; i++) {
        console.log(i);
    
        if (i === 3)
            break;
    }
    
    for (var i = 0; i < 5; i++) {
        if (i === 3)
            continue;
    
        console.log(i);
    }

🪬 Nota Importante: ES5, ES6/ES2015 y ES2016

Es importante hablar sobre la versión de JavaScript porque cada desarrollador moderno debería saber cuál es el contexto en la comunidad de JavaScript y cómo el lenguaje de programación se está adaptando a los cambios en varios temas hoy en día. La siguiente lista es una historia muy corta de JavaScript:

  • 1996: Cambio de LiveScript a JavaScript para atraer a los desarrolladores de Java —una acción de marketing—. Sin embargo, Java no tiene casi nada que ver con Java.
  • 1997: ECMAScript 1 se convirtió en la primera versión del estándar del lenguaje JavaScript. Esto significa que ECMA Script es el estándar del lenguaje y JavaScript es el lenguaje en práctica. ECMA es una organización internacional.
  • 2009: ECMAScript 5 (ES5) fue lanzado con muchas características nuevas. Sin embargo, tomó muchos años para que los navegadores implementaran todos estos cambios, y hasta hace pocos años los desarrolladores pudieron usar ES5 sin restricciones.
  • 2015: ECMAScript 2015 (ES2015) fue lanzado como la actualización más grande de la historia con muchas nuevas características. Estas actualizaciones de versión son un gran asunto para JavaScript y toda la comunidad. Se escuchará que esta versión también se llama ES6, pero es mejor usar ES2015 porque la organización ECMA lanzará cada año nuevas versiones con algunas actualizaciones menores.

Entonces, ¿cómo está JavaScript hoy y qué versión deberíamos usar?

  • ES5 es completamente compatible con todos los navegadores modernos y está listo para usar desde 2016.
  • ES2015 tiene solo soporte parcial en navegadores modernos, sin soporte en navegadores antiguos. Por lo tanto, no se recomienda usarlo en producción.
  • ES2016 tiene casi ningún soporte en navegadores modernos, por lo que, por esta razón, no se recomienda usarlo en producción. Sin embargo, la magnitud de esta versión es poco importante porque solo agrega una o dos pequeñas características al lenguaje.

En conclusión, se recomienda usar ES5. Además, es importante aprender a codificar en ES5 y entenderlo porque casi todos los tutoriales y códigos que encuentres en la web hoy en día aún están en ES5, y es más fácil aprender ES5 y luego actualizarse a ES2015.