logo

TechCodeview

Funkcje strzałkowe w JavaScript

Co to jest funkcja strzałki?

Funkcja strzałki {()=>} to zwięzły sposób pisania funkcji JavaScript w krótszy sposób. Funkcje strzałek zostały wprowadzone w wersji ES6. Sprawiają, że nasz kod jest bardziej uporządkowany i czytelny.

Funkcje strzałek są funkcjami anonimowymi, czyli funkcjami, które nie mają nazwy, ale często są przypisane do dowolnej zmiennej. Nazywa się je również Funkcje lambdy .



Składnia: 

const gfg = () =>{ console.log( 'Witam, maniaku!' ); }>

Poniższe przykłady pokazują działanie funkcji Arrow w JavaScript.

Funkcja strzałki bez parametrów

JavaScript 
const gfg = () =>{ console.log( 'Witam z GeekforGeeks!' ); } gfg();>
Wyjście 
Hi from GeekforGeeks!>

Funkcja strzałki z parametrami

JavaScript 
const gfg = ( x, y, z ) =>{konsola.log(x + y + z) } gfg( 10, 20, 30 );>
Wyjście 
60>

Funkcja strzałki z parametrami domyślnymi

JavaScript 
const gfg = ( x, y, z = 30 ) =>{ konsola.log( x + ' ' + y + ' ' + z); } gfg( 10, 20 );>
Wyjście 
10 20 30>

Funkcje strzałkowe mogą być asynchroniczne, poprzedzając wyrażenie słowem kluczowym async.

async param =>wyrażenie async (param1, param2, ...paramN) => {instrukcje }>

Zalety funkcji strzałkowych

  • Funkcje strzałkowe zmniejszają rozmiar kodu.
  • Instrukcja return i nawiasy funkcyjne są opcjonalne w przypadku funkcji jednowierszowych.
  • Zwiększa czytelność kodu.
  • Funkcje strzałkowe zapewniają leksykalne to powiązanie. Oznacza to, że dziedziczą wartość this z otaczającego zakresu. Ta funkcja może być korzystna w przypadku detektorów zdarzeń lub funkcji wywołania zwrotnego, gdzie wartość tej funkcji może być niepewna.

Ograniczenia funkcji strzałkowych

  • Funkcje strzałkowe nie mają właściwości prototype.
  • Funkcje strzałkowe nie mogą być używane ze słowem kluczowym new.
  • Funkcje strzałkowe nie mogą być używane jako konstruktory.
  • Funkcje te są anonimowe i trudno jest debugować kod.
  • Funkcji strzałkowych nie można używać jako funkcji generujących, które używają słowa kluczowego Yield do zwracania wielu wartości w czasie.

Obsługiwane przeglądarki

  • Chrome 45 i nowsze
  • Edge 12 i nowsze
  • Firefox 22 i nowsze wersje
  • Opera 32 i nowsze
  • Safari 10 i nowsze