JavaScript ES6 funkcijas: labās daļas

ES6 piedāvā dažas atdzist jaunas funkcionālās funkcijas, kas padara JavaScript programmēšanu daudz elastīgāku. Parunāsim par dažiem no tiem - īpaši par noklusējuma parametriem, atpūtas parametriem un bultiņu funkcijām.

Jautrs padoms : jūs varat kopēt un ielīmēt jebkuru no šiem piemēriem / kodiem Babel REPLun jūs varat redzēt, kā ES6 kods tiek pārnests uz ES5.

Noklusējuma parametru vērtības

JavaScript funkcijām ir unikāla funkcija, kas ļauj izsaukt jebkuru parametru skaitu funkciju izsaukuma laikā (faktiskie parametri) neatkarīgi no parametru skaita, kas atrodas funkciju definīcijā (formālie parametri). Tāpēc jums jāiekļauj noklusējuma parametri tikai gadījumā, ja kāds aizmirst nodot kādu no parametriem.

Kā noklusējuma parametri tiktu ieviesti ES5

Iepriekš minētais šķiet labi, kad mēs to izpildām. number2netika nodots, un mēs to pārbaudījām, izmantojot ||operatoru ' ', lai atgrieztu otro operandu, ja pirmais ir kļūdains. Tādējādi "10" tika piešķirts kā noklusējuma vērtība, jo tas number2nav definēts.

Tomēr ir tikai viena problēma. Ko darīt, ja kāds nodod “0” kā otro argumentu? ⚠

Iepriekš minētā pieeja neizdosies, jo mūsu noklusējuma vērtība “10” tiktu piešķirta nodotās vērtības vietā, piemēram, “0”. Kāpēc? Jo '0' tiek vērtēts kā nepatiess!

Uzlabosim iepriekš minēto kodu, vai ne?

Agh! Tas ir par daudz koda. Vispār nav forši. Apskatīsim, kā to dara ES6.

Noklusējuma parametri ES6

function counts(number1 = 5, number2 = 10) { // do anything here}

number1un tām number2ir piešķirtas noklusējuma vērtības attiecīgi “5” un “10”.

Nu jā, tas ir diezgan daudz. Īsi un mīļi. Nav papildu koda, lai pārbaudītu, vai trūkst parametra. Tas padara funkcijas ķermeni jauku un īsu. ?

PIEZĪME. Kad undefinedparametra vērtība ar noklusējuma argumentu tiek nodota, kā paredzēts, nodotā ​​vērtība nav derīga un tiek piešķirta noklusējuma parametra vērtība . Bet, ja tas nulltiek nodots, tas tiek uzskatīts par derīgu un noklusējuma parametrs netiek izmantots, un šim parametram tiek piešķirts null.

Jauka noklusējuma parametru iezīme ir tāda, ka noklusējuma parametram nav obligāti jābūt primitīvai vērtībai, un mēs varam arī izpildīt funkciju, lai izgūtu noklusējuma parametra vērtību. Lūk, piemērs:

Iepriekšējie parametri var būt arī noklusējuma parametri tiem parametriem, kas nāk pēc tiem:

function multiply(first, second = first) { // do something here}

Bet apgrieztais metīs kļūdu. Tas ir, ja otrais parametrs tiek piešķirts kā noklusējuma vērtība pirmajam parametram, tas rada kļūdu, jo otrais parametrs vēl nav definēts, kamēr tas tiek piešķirts pirmajam parametram.

function add(first = second, second) { return first + second;}console.log(add(undefined, 1)); //throws an error

Atpūtas parametri

Pārējais parametrs ir vienkārši nosaukts parametrs, kas pirms trīs punkti (...). Šis nosauktais parametrs kļūst par masīvu, kas satur pārējos parametrus (ti, izņemot nosauktos parametrus), kas nodoti funkciju izsaukuma laikā.

Vienkārši paturiet prātā, ka atpūtas parametrs var būt tikai viens , un tam jābūt pēdējam parametram. Mums nevar būt nosaukts parametrs pēc atpūtas parametra.

Lūk, piemērs:

Kā redzat, mēs izmantojām pārējo parametru, lai iegūtu visas atslēgas / īpašības, kas jāizvelk no nodotā ​​objekta, kas ir pirmais parametrs.

Atšķirība starp atpūtas parametru un “argumentu objektu” ir tā, ka tajā ir visi faktiskie parametri, kas nodoti funkcijas izsaukuma laikā, savukārt “atpūtas parametrs” satur tikai tos parametrus, kas nav nosaukti parametri un tiek nodoti funkcijas izsaukuma laikā.

Bultu funkcijas ➡

Bultu funkcijas jeb “tauku bultiņu funkcijas” ievieš jaunu ļoti kodolīgu funkciju sintakses sintaksi. Mēs varam izvairīties no rakstīšanas atslēgvārdus, piemēram function, returnun pat figūriekavās { }un iekavas ().

Sintakse

Sintaksei ir dažādas garšas, atkarībā no mūsu lietošanas veida. Visi varianti ir viena lieta, kas kopīgs , proti, viņi sāk ar argumentiem , kam seko ar bultiņu ( =>), kam seko t viņš darbotos b ODY.

Argumenti un pamatteksts var būt dažādi. Šeit ir visvienkāršākais piemērs:

let mirror = value => value;
// equivalent to:
let mirror = function(value) { return value;};

Iepriekš minētajā piemērā ņemts viens arguments “vērtība” (pirms bultiņas), un tas vienkārši atgriež šo argumentu ( => value;). Kā redzat , tur ir tikai atgriešanās vērtība, tāpēc nav nepieciešams atdošanas atslēgvārds vai cirtaini krūšturi, lai aptvertu funkcijas ķermeni.

Tā kā ir tikai viens arguments , nav nepieciešams arī iekavas “()”.

Lūk, piemērs ar vairākiem argumentiem, kas jums palīdzēs to saprast:

let add = (no1, no2) => no1 + no2;
// equivalent to:
let add = function(no1, no2) { return no1 + no2;};

Ja vispār nav argumentu, jums jāiekļauj tukšas iekavas, kā norādīts zemāk:

let getMessage = () => 'Hello World';
// equivalent to:
let getMessage = function() { return 'Hello World';}

Funkcijas ķermenim ar tikai atgriešanās paziņojumu cirtaini stiprinājumi nav obligāti .

Funkcijas ķermenim, kam ir ne tikai atgriešanās paziņojums, tāpat kā tradicionālajām funkcijām, ķermenis jāiesaiņo cirtainās lencēs.

Šeit ir vienkārša aprēķina funkcija ar divām operācijām - saskaitīt un atņemt. Tās ķermenim jābūt ietītam cirtainās lencēs:

let calculate = (no1, no2, operation) => { let result; switch (operation) { case 'add': result = no1 + no2; break; case 'subtract': result = no1 - no2; break; } return result;};

Ko darīt, ja mēs vēlamies funkciju, kas vienkārši atgriež objektu? Sastādītājs neizpratnē, vai cirtainās lencītes ir objekta ( er}) vai cirtainās lencītes.()=>{id: numb

Risinājums ir objekta ietīšana iekavās. Lūk, kā:

let getTempItem = number => ({ id: number});
// effectively equivalent to:
let getTempItem = function(number) { return { id: number };};

Let’s have a look at the final example. In this we’ll use filter function on a sample array of numbers to return all numbers greater than 5,000:

// with arrow functionlet result = sampleArray.filter(element => element > 5000);
// without arrow functionlet result = sampleArray.filter(function(element) { return element > 5000;});

We can see how much less code is necessary compared to the traditional functions.

A few things about arrow functions to keep in mind though:

  • They can’t be called with new, can’t be used as constructors (and therefore lack prototype as well)
  • Arrow functions have their own scope, but there’s no ‘this’ of their own.
  • No arguments object is available. You can use rest parameters however.

Since JavaScript treats functions as first-class, arrow functions make writing functional code like lambda expressions and currying much easier.

"Bultas funkcijas bija kā raķešu degviela JavaScript funkcionālās programmēšanas eksplozijai." - Ēriks Eljots

Nu, tur jums iet! Varbūt ir pienācis laiks sākt lietot šīs funkcijas.

Šādas ES6 funkcijas ir svaiga gaisa elpa, un izstrādātājiem vienkārši patīk tās izmantot.

Šeit ir saite uz manu iepriekšējo ziņojumu par mainīgajām deklarācijām un pacelšanu!

Es ceru, ka tas jūs motivēs uzņemties ES6, ja vēl neesat to izdarījis!

Miers ✌️️