JavaScript ES6

¿Qué es ECMAScript 6?

ECMAScript 6 también se conoce como ES6 y ECMAScript 2015.

Algunas personas lo llaman JavaScript 6.

Este capítulo introduce algunas nuevas características de ES6.

  • JavaScript let
  • JavaScript const
  • Potencia (**)
  • Valores por defecto de parámetros
  • Array.find()
  • Array.findIndex()

Soporte del navegador para ES6 (ECMAScript 2015)

Safari 10 y Edge 14 son los primeros navegadores que admiten completamente ES6:

Chrome 58 Edge 14 Firefox 54 Safari 10 Opera 55
Ene 2017 Ago 2016 Mar 2017 Jul 2016 Ago 2018

JavaScript let

La declaración let permite que declare variables con ámbito de bloque.

Ejemplo

var x = 10;
// Aquí x es 10
{ 
  let x = 2;
  // Aquí x es 2
}
// Aquí x es 10

Prueba personalmente

JavaScript const

const La declaración permite que declare constantes (variables de JavaScript con valores constantes).

Las constantes son similares a let Las variables, pero no se puede cambiar el valor.

Ejemplo

var x = 10;
// Aquí x es 10
{ 
  const x = 2;
  // Aquí x es 2
}
// Aquí x es 10

Prueba personalmente

En nuestra JavaScript Let / Const Lea más sobre let Y const del contenido.

Operador de exponente

Operador de potencia (**）Eleva al poder al primer operando al poder del segundo operando.

Ejemplo

var x = 5;
var z = x ** 2;          // El resultado es 25

Prueba personalmente

x ** y El resultado es Math.pow(x,y) Igual:

Ejemplo

var x = 5;
var z = Math.pow(x,2);   // El resultado es 25

Prueba personalmente

Valores por defecto de parámetros

ES6 Permite que los parámetros de la función tengan valores por defecto.

Ejemplo

function myFunction(x, y = 10) {
  // y es 10 si no se pasa o es undefined
  return x + y;
}
myFunction(5); // Devolverá 15

Prueba personalmente

Array.find()

find() El método devuelve el valor del primer elemento del array que pasa la función de prueba.

Este ejemplo busca (devuelve) el primer elemento mayor que 18:

Ejemplo

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

Prueba personalmente

Tenga en cuenta que esta función acepta 3 parámetros:

  • Valor del elemento
  • Índice del elemento
  • El propio array

Array.findIndex()

findIndex() El método devuelve la posición del primer elemento del array que pasa la función de prueba.

Este ejemplo determina el índice del primer elemento mayor que 18:}

Ejemplo

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

Prueba personalmente

Tenga en cuenta que esta función acepta 3 parámetros:

  • Valor del elemento
  • Índice del elemento
  • El propio array

Propiedades de número nuevas

ES6 ha añadido las siguientes propiedades al objeto Number:

  • EPSILON
  • MIN_SAFE_INTEGER
  • MAX_SAFE_INTEGER

Ejemplo

var x = Number.EPSILON;

Prueba personalmente

Ejemplo

var x = Number.MIN_SAFE_INTEGER;

Prueba personalmente

Ejemplo

var x = Number.MAX_SAFE_INTEGER;

Prueba personalmente

Métodos de número nuevos

ES6 ha añadido 2 nuevos métodos a Number:

  • Number.isInteger()
  • Number.isSafeInteger()

Método Number.isInteger()

Si el parámetro es un entero, entonces Number.isInteger() El método devuelve verdadero.

Ejemplo

Number.isInteger(10);        // Devuelve true
Number.isInteger(10.5);      // Devuelve false

Prueba personalmente

Método Number.isSafeInteger()

Un entero seguro puede representarse con precisión como un número de coma flotante.

Si el parámetro es un entero seguro, entonces Number.isSafeInteger() El método devuelve verdadero.

Ejemplo

Number.isSafeInteger(10);    // Devuelve true
Number.isSafeInteger(12345678901234567890);  // Devuelve false

Prueba personalmente

Un entero seguro es cualquier entero desde -(253 - 1) hasta +(253 - 1).

Esto es seguro: 9007199254740991. Esto no es seguro: 9007199254740992.

Métodos globales nuevos

ES6 también ha añadido 2 nuevos métodos globales de número:

  • isFinite()
  • isNaN()

Método isFinite()

Si el parámetro es Infinity o NaNentonces el global isFinite() El método devuelve false.

De lo contrario, devuelve true:

Ejemplo

isFinite(10/0);       // Devuelve false
isFinite(10/1);       // Devuelve true

Prueba personalmente

Método isNaN()

si el parámetro es NaNentonces el global isNaN() El método devuelve verdadero. De lo contrario, devuelve falso:

Ejemplo

isNaN("Hello");       // Devuelve true

Prueba personalmente

Función flecha (Arrow Function)

Las funciones flecha permiten usar una sintaxis más breve para escribir expresiones de función.

No necesita function palabras clave,return palabras clave yllaves.

Ejemplo

// ES5
var x = function(x, y) {
   return x * y;
}
// ES6
const x = (x, y) => x * y;

Prueba personalmente

Las funciones flecha no tienen su propia this. No son adecuados para definirmétodos de objeto.

Las funciones flecha no se elevan. Deben estar definidas enanteriorpara definir.

usar const en comparación con var más seguro, ya que las expresiones de función siempre son valores constantes.

Si la función es una única instrucción, solo se puede omitir return Palabras clave y corchetes. Por lo tanto, mantenerlos puede ser una buena costumbre:

Ejemplo

const x = (x, y) => { return x * y };

Prueba personalmente