Научете колко гъвкави могат да бъдат функциите на JavaScript и как можете да ги използвате, за да създадете гъвкав, многократно използваем код.

JavaScript е мощен език, поддържан от повечето съвременни браузъри, и е чудесен избор за начинаещи.

Точно както много други съвременни езици за програмиране, JavaScript поддържа функции, които ви позволяват да изолирате блок от код и да го използвате повторно някъде другаде. Можете също така да използвате функции за присвояване на променливи и да ги предавате като параметри, като други стойности.

Какво представляват функциите от по-висок ред?

Най-простата дефиниция за функция от по-висок ред е функция, която извършва операции върху други функции, като ги приема като параметри или ги връща. Функциите от по-висок ред се използват широко в функционална програмна парадигма. Ако вие сте просто започвам с JavaScript, функциите от по-висок ред може да са малко трудни за разбиране.

Разгледайте следния пример:

функциятрансформирам(fn) {
позволявам resultArray = [];
instagram viewer

връщанефункция (масив) {
за (позволявам аз = 0; i < array.length; i++) {
resultArray.push (fn (масив[i]))
}

връщане resultArray
}
}

В кодовия блок по-горе, трансформирам е функция от по-висок ред, която приема fn функция като параметър и връща анонимна функция, която приема масив като параметър.

Целта на трансформирам функцията е да модифицира елементите в масива. Първо, кодът дефинира променлива resultArray и го свързва с празен масив.

The трансформирам връща анонимна функция, която преминава през всеки елемент масив, след което предава елемента на fn функция за изчисление и вкарва резултата в resultArray. След завършване на цикъла анонимната функция връща resultArray.

конст функция1 = преобразуване((х) => х * 2)
конзола.log (функция1([ 2, 3, 4, 5, 6 ])) /* [ 4, 6, 8, 10, 12] */

Кодовият блок по-горе присвоява анонимната функция, върната от трансформирам функция към постоянната променлива функция1. fn връща продукта на х който е заместител на масив [i].

Кодът също предава масив като параметър към функция1 и след това записва резултата в конзолата. По-кратък начин за писане на това би бил:

конзола.log (преобразуване((х) => х * 2)([ 2, 3, 4, 5, 6 ]))

JavaScript има вградена функция от по-висок ред, която основно прави същото като трансформирам, което ще разгледаме по-късно.

Надяваме се, че започвате да разбирате как работят функциите от по-висок ред в JavaScript. Разгледайте следната функция и вижте дали можете да познаете какво прави.

функцияfilterAndTransform(fn, arrayToBeFiltered, условие) {
позволявам filteredArray = [];

за (позволявам аз = 0; i < arrayToBeFiltered.length; i++) {
ако (условие (arrayToBeFiltered[i])) {
позволявам y = transform (fn)([ arrayToBeFiltered[i] ])[0]
filteredArray.push (y)
} друго {
filteredArray.push (arrayToBeFiltered[i])
}
}

връщане filteredArray
}

Този кодов блок дефинира функция, която прави това, което може да подозирате - проверява за елементи в масива, които отговарят на определено условие и ги трансформира с трансформиране () функция. За да използвате тази функция, трябва да направите нещо подобно:

filterAndTransform((х) => х * 2, [ 1, 2, 3, 4, 5 ], (x) => x % 20)

За разлика от трансформирам функция, The filterAndTransform функцията приема две функции като параметри: fn и състояние. The състояние функцията проверява дали параметърът е преминал, дали е четно число и връща true. В противен случай връща false.

Ако състояние разрешава на true (условието е изпълнено), само тогава е трансформирам наречена функция. Тази логика може да бъде полезна, ако работите с масив и искате да трансформирате определени елементи. Ако изпълните този код в конзолата на браузъра, трябва да получите следния отговор:

[ 1, 4, 3, 8, 5 ]

Можете да видите, че функцията трансформира само елементите, които отговарят на определено условие, оставяйки елементите, които не отговарят на условието, както са.

Функцията Array.map() от по-висок ред в JavaScript

Методи за масиви като map() са функции от по-висок ред, които улесняват манипулирането на масиви. Ето как работи.

позволявам масив = [ 1, 2, 3, 4, 5 ];
позволявам transformedArray = array.map((х) => х * 2);

Когато влезете transformedArray в конзолата на браузъра, трябва да получите същия резултат, който сте получили с трансформирам функция, спомената по-рано:

[ 2, 4, 6, 8, 10 ]

array.map() приема два параметъра, първият параметър се отнася до самия елемент, докато вторият параметър се отнася до индекса на елемента (позиция в масива). С просто array.map() можете да постигнете същите резултати като filterAndTransform функция. Ето как да го направите:

позволявам масив = [ 1, 2, 3, 4, 5 ];
позволявам transformedArray = array.map((х) => х % 20? х * 2: х);

В кодовия блок по-горе функцията връща произведението на текущия елемент и 2, ако елементът е четен. В противен случай връща елемента недокоснат.

С вградените карта функция, успяхте да елиминирате необходимостта от няколко реда код, като по този начин доведете до много по-чист код и по-малко шансове за възникване на грешки.

Функцията Array.filter() в JavaScript

Когато извикате филтър метод в масив, уверете се, че върнатата стойност на функцията, която подавате в метода, е или истина, или невярно. The филтър метод връща масив, съдържащ елементи, които отговарят на предаденото условие. Ето как да го използвате.

функцияcheckFirstLetter(дума) {
позволявам гласни = "aeiou"

ако (гласни.включва(дума[0].toLowerCase())) {
връщане дума;
} друго {
връщане;
}
}

позволявам думи = [ "Здравейте", "от", "на", "деца", "на", "планета", "Земя" ];
позволявам резултат = words.filter((х) => проверка на първата буква (x))

Кодовият блок по-горе пресича думи масив и филтрира всяка дума, чиято първа буква е гласна. Когато стартирате кода и регистрирате резултат променлива, трябва да получите следните резултати:

[ 'на', "Земя" ];

Функцията Array.reduce() в JavaScript

The намали () функцията от по-висок ред приема два параметъра. Първият параметър е редукционната функция. Тази редукционна функция е отговорна за комбинирането на две стойности и връщането на тази стойност. Вторият параметър не е задължителен.

Той определя началната стойност, която да се предаде на функцията. Ако искате да върнете сума от всички елементи в масив, можете да направите следното:

позволявам а = [ 1, 2, 3, 4, 5];
позволявам сума = 0;

за (позволявам аз = 0; i < a.дължина; i++) {
сума = сума + a[i];
}

конзола.log (сума);

Ако стартирате кода, сума трябва да е 15. Можете също така да предприемете различен подход с намалявам функция.

позволявам а = [ 1, 2, 3, 4, 5 ];
сума = a.reduce((c, n) => c + n);
конзола.log (сума);

Кодовият блок по-горе е много по-чист в сравнение с предишния пример. В този пример функцията за намаляване приема два параметъра: ° С и н. ° С се отнася до текущия елемент, докато н препраща към следващия елемент в масива.

Когато кодът се изпълнява, редукторната функция преминава през масива, като се уверява, че добавя текущата стойност към резултата от предишната стъпка.

Силата на функциите от по-висок ред

Функциите в JavaScript са мощни, но функциите от по-висок ред пренасят нещата на следващото ниво. Те се използват широко във функционалното програмиране, като ви позволяват лесно да филтрирате, намалявате и картографирате масиви.

Функциите от по-висок порядък могат да ви помогнат да пишете по-модулен и повторно използваем код, когато създавате приложения.