Javascript ES6

JavaScript ES6 (también conocido como ECMAScript 2015 o ECMAScript 6) es la versión más nueva de JavaScript que se introdujo en 2015.

ECMAScript es el estándar que utiliza el lenguaje de programación JavaScript. ECMAScript proporciona la especificación sobre cómo debería funcionar el lenguaje de programación JavaScript.

Este tutorial proporciona un breve resumen de las funciones más utilizadas de ES6 para que pueda comenzar rápidamente en ES6.

JavaScript permite

JavaScript let se utiliza para declarar variables. Anteriormente, las variables se declaraban utilizando el var palabra clave.

Para aprender más sobre la diferencia entre let y varvisite JavaScript let vs var.

Las variables declaradas usando let son alcance de bloque. Esto significa que solo son accesibles dentro de un bloque en particular. Por ejemplo,

// variable declared using let
let name="Sara";
{
    // can be accessed only inside
    let name="Peter";

    console.log(name); // Peter
}
console.log(name); // Sara 

constante de JavaScript

los const La declaración se utiliza para declarar constantes en JavaScript. Por ejemplo,

// name declared with const cannot be changed
const name="Sara";

Una vez declarado, no puede cambiar el valor de un const variable.

Función de flecha de JavaScript

En el ES6 versión, puede utilizar funciones de flecha para crear expresiones de función. Por ejemplo,

Esta función

// function expression
let x = function(x, y) {
   return x * y;
}

Se puede escribir como

// function expression using arrow function
let x = (x, y) => x * y;

Para obtener más información sobre las funciones de flecha, visite Función de flecha de JavaScript.

Clases de JavaScript

La clase de JavaScript se utiliza para crear un objeto. La clase es similar a una función constructora. Por ejemplo,

class Person {
  constructor(name) {
    this.name = name;
  }
}

Palabra clave class se utiliza para crear una clase. Las propiedades se asignan en una función constructora.

Ahora puedes crear un objeto. Por ejemplo,

class Person {
  constructor(name) {
    this.name = name;
  }
}

const person1 = new Person('John');

console.log(person1.name); // John

Para obtener más información sobre las clases, visite Clases de JavaScript.

Valores de parámetros predeterminados

En la versión ES6, puede pasar valores predeterminados en los parámetros de la función. Por ejemplo,

function sum(x, y = 5) {

    // take sum
    // the value of y is 5 if not passed
    console.log(x + y);
}

sum(5); // 10
sum(5, 15); // 20

En el ejemplo anterior, si no pasa el parámetro para ytomará 5 por defecto.

Para obtener más información sobre los parámetros predeterminados, visite Parámetros predeterminados de funciones de JavaScript.

Literales de plantilla de JavaScript

El literal de la plantilla ha facilitado la inclusión de variables dentro de una cadena. Por ejemplo, antes tenías que hacer:

const first_name = "Jack";
const last_name = "Sparrow";

console.log('Hello ' + first_name + ' ' + last_name);

Esto se puede lograr usando una plantilla literal de la siguiente manera:

const first_name = "Jack";
const last_name = "Sparrow";

console.log(`Hello ${first_name} ${last_name}`);

Para obtener más información sobre los literales de plantilla, visite Literal de plantilla de JavaScript.

Destrucción de JavaScript

La sintaxis de desestructuración facilita la asignación de valores a una nueva variable. Por ejemplo,

// before you would do something like this
const person = {
    name: 'Sara',
    age: 25,
    gender: 'female'    
}

let name = person.name;
let age = person.age;
let gender = person.gender;

console.log(name); // Sara
console.log(age); // 25
console.log(gender); // female

Usando ES6 Al desestructurar la sintaxis, el código anterior se puede escribir como:

const person = {
    name: 'Sara',
    age: 25,
    gender: 'female'    
}

let { name, age, gender } = person;

console.log(name); // Sara
console.log(age); // 25
console.log(gender); // female

Para obtener más información sobre la desestructuración, visite Destrucción de JavaScript.

Importación y exportación de JavaScript

Puede exportar una función o un programa y usarlo en otro programa importándolo. Esto ayuda a hacer componentes reutilizables. Por ejemplo, si tiene dos archivos JavaScript llamados contact.js y home.js.

En el archivo contact.js, puede exportar la contact() función:

// export
export default function contact(name, age) {
    console.log(`The name is ${name}. And age is ${age}.`);
}

Luego, cuando desee utilizar el contact() función en otro archivo, simplemente puede importar la función. Por ejemplo, en el archivo home.js:

import contact from './contact.js';

contact('Sara', 25);
// The name is Sara. And age is 25

Promesas de JavaScript

Las promesas se utilizan para manejar tareas asincrónicas. Por ejemplo,

// returns a promise
let countValue = new Promise(function (resolve, reject) {
   reject('Promise rejected'); 
});

// executes when promise is resolved successfully
countValue.then(
    function successValue(result) {
        console.log(result); // Promise resolved
    },
 )

Para obtener más información sobre las promesas, visite Promesas de JavaScript.

Parámetro de descanso de JavaScript y operador de extensión

Puedes usar el descansar parámetro para representar un número indefinido de argumentos como una matriz. Por ejemplo,

function show(a, b, ...args) {
  console.log(a); // one
  console.log(b); // two
  console.log(args); // ["three", "four", "five", "six"]
}

show('one', 'two', 'three', 'four', 'five', 'six')

Pasas los argumentos restantes usando ... sintaxis. De ahí el nombre parámetro de descanso.

usas el sintaxis extendida ... para copiar los elementos en una sola matriz. Por ejemplo,

let arr1 = ['one', 'two'];
let arr2 = [...arr1, 'three', 'four', 'five'];
console.log(arr2); // ["one", "two", "three", "four", "five"]

Tanto el parámetro resto como el operador de propagación usan la misma sintaxis. Sin embargo, el operador de propagación se usa con matrices (valores iterables).

Para obtener más información sobre el operador de distribución, visite Operador de distribución de JavaScript.