JavaScript ES6

Co to jest ECMAScript 6?

ECMAScript 6 jest również nazywane ES6 i ECMAScript 2015.

Niektórzy nazywają to JavaScript 6.

Rozdział ten przedstawia niektóre nowe funkcje ES6.

  • JavaScript let
  • JavaScript const
  • Potęga (**)
  • Wartości domyślne parametrów
  • Array.find()
  • Array.findIndex()

Wspieranie przeglądarek dla ES6 (ECMAScript 2015)

Safari 10 i Edge 14 były pierwszymi przeglądarkami, które w pełni wspierały ES6:

Chrome 58 Edge 14 Firefox 54 Safari 10 Opera 55
Jan 2017 Aug 2016 Mar 2017 Jul 2016 Aug 2018

JavaScript let

Zwyrobnienie let pozwala na deklarowanie zmiennych w zakresie bloku.

Przykład

var x = 10;
// Tutaj x wynosi 10
{ 
  let x = 2;
  // Tutaj x wynosi 2
}
// Tutaj x wynosi 10

Spróbuj sam

JavaScript const

const zwyrobnienia, które pozwalają na deklarowanie stałych (zmienne JavaScript o stałej wartości).

Stałe są podobne do let Zmienne, których wartość można zmienić.

Przykład

var x = 10;
// Tutaj x wynosi 10
{ 
  const x = 2;
  // Tutaj x wynosi 2
}
// Tutaj x wynosi 10

Spróbuj sam

w naszym JavaScript Let / Const Przeczytaj więcej o let i const zawartości.

Operator wykładniczy

Operator potęgi (**Podnosi pierwszy argument do potęgi drugiego argumentu.

Przykład

var x = 5;
var z = x ** 2;          // Wynik to 25

Spróbuj sam

x ** y wynosi Math.pow(x,y) To samo:

Przykład

var x = 5;
var z = Math.pow(x,2);   // Wynik to 25

Spróbuj sam

Wartości domyślne parametrów

ES6 Dopuszcza się funkcje z parametrami o wartościach domyślnych.

Przykład

function myFunction(x, y = 10) {
  // y wynosi 10, jeśli nie została przekazana lub jest undefined
  return x + y;
}
myFunction(5); // Zwróci 15

Spróbuj sam

Array.find()

find() Metoda zwraca wartość pierwszego elementu tablicy, który przeszedł test funkcji.

W tym przykładzie wyszukuje (zwraca) pierwszy element (wartość) większy niż 18:

Przykład

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

Spróbuj sam

Proszę zauważyć, że ta funkcja przyjmuje 3 parametry：

  • Wartość elementu
  • Indeks elementu
  • Same tablice

Array.findIndex()

findIndex() Metoda zwraca indeks pierwszego elementu tablicy, który przeszedł test funkcji.

Ten przykład określa indeks pierwszego elementu większego niż 18:

Przykład

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

Spróbuj sam

Proszę zauważyć, że ta funkcja przyjmuje 3 parametry：

  • Wartość elementu
  • Indeks elementu
  • Same tablice

Nowe atrybuty liczbowe

ES6 dodał następujące atrybuty do obiektu Number：

  • EPSILON
  • MIN_SAFE_INTEGER
  • MAX_SAFE_INTEGER

Przykład

var x = Number.EPSILON;

Spróbuj sam

Przykład

var x = Number.MIN_SAFE_INTEGER;

Spróbuj sam

Przykład

var x = Number.MAX_SAFE_INTEGER;

Spróbuj sam

Nowe metody liczbowe

ES6 dodał 2 nowe metody do obiektu Number：

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

Metoda Number.isInteger()

Jeśli argument jest liczbą całkowitą, to Number.isInteger() metoda zwraca true.

Przykład

Number.isInteger(10);        // Zwraca prawdę
Number.isInteger(10.5);      // Zwraca fałsz

Spróbuj sam

Metoda Number.isSafeInteger()

Bezpieczne liczby całkowite to liczby całkowite, które można dokładnie wyrazić jako liczby zmiennoprzecinkowe.

Jeśli argument jest bezpieczną liczbą całkowitą, to Number.isSafeInteger() metoda zwraca true.

Przykład

Number.isSafeInteger(10);    // Zwraca prawdę
Number.isSafeInteger(12345678901234567890);  // Zwraca fałsz

Spróbuj sam

Bezpieczne liczby całkowite to wszystkie liczby całkowite z zakresu od -(253 - 1) do +(253 - 1).

To jest bezpieczne: 9007199254740991. To jest niebezpieczne: 9007199254740992.

Nowe globalne metody

ES6 dodał również 2 nowe globalne metody liczbowe：

  • isFinite()
  • isNaN()

Metoda isFinite()

Jeśli argument to Infinity lub NaN, to globalny isFinite() Metoda zwraca fałsz。

W przeciwnym razie zwraca prawdę：

Przykład

isFinite(10/0);       // Zwraca fałsz
isFinite(10/1);       // Zwraca prawdę

Spróbuj sam

Metoda isNaN()

jeśli argument jest NaN, to globalny isNaN() metoda zwraca true. W przeciwnym razie zwraca false:

Przykład

isNaN("Hello");       // zwraca true

Spróbuj sam

funkcje strzałkowe (Arrow Function)

funkcje strzałkowe pozwalają na użycie krótkiego syntaxu do zapisu wyrażeń funkcji.

nie potrzebujesz function słowa kluczowe,return słowa kluczowe orazklamry.

Przykład

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

Spróbuj sam

funkcje strzałkowe nie mają własnego this. Nie są one odpowiednie dometody obiektu.

funkcje strzałkowe nie są uniesione. Muszą być używaneprzeddefinicji.

do const w porównaniu do użycia var bezpieczniej, ponieważ wyrażenia funkcji są zawsze stałymi wartościami.

Jeśli funkcja jest pojedynczym wyrażeniem, to można ją pominąć return Słowa kluczowe i klamry. Dlatego warto je zachować:

Przykład

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

Spróbuj sam