Функции на JavaScript

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

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

Функционални изрази

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

Поставете тази декларация в JavaScript израз (като в присвояване или аритметичен израз), тя се превръща в a функция изразяване.

// Функция за деклариране на функция function_name () ; // Изразът на функцията var function_name = function () ;

Всички декларации на JavaScript са издигнати (преместени в обхвата) по време на оценката. Следователно писането на повикване за функция преди декларацията на функцията да е наред (тъй като декларацията ще се премести все пак).

function_name (); // функция call [WORKS] функция function_name () ;

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

function_name (); // извикване на функция [WON'T WORK] var function_name = function () ;

Незабавно извикано функционално изражение (IIFE)

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

По-долу са описани двата най-често срещани синтаксиса за създаване на IIFE:

(функция optional_function_name () // body ());

(функция optional_function_name () // body) ();

Кръгли скоби около декларацията на функцията го преобразуват в израз и след това се добавят () след като извика функцията. Можете да използвате други начини за създаване на IIFE толкова дълго, колкото добавяте () след функционална експресия (като по-долу), но предпочитаните методи са горните две.

// Някои от начините за създаване на функцията IIFEs! () / *… * / (); + функция () / *… * / (); нова функция () / *… * /;

IIFE е идеален за писане на код, който трябва да се изпълнява само веднъж, пространства за имена, създаване на затваряния, създаване на частни променливи и др. По-долу е даден пример за използване на IIFE.

var page_language = (function () var lang; // Код за получаване на езика на страницата за връщане lang;) ();

Кодът за получаване на езика на страницата се изпълнява само веднъж (за предпочитане след зареждането на страницата). Резултатът се съхранява в page_language за по-късна употреба.

методи

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

var calc = add: функция (a, b) return a + b, sub: функция (a, b) return a-b console.log (calc.add (1,2)); // 3 console.log (calc.sub (80,2)); // 78

Най- добави и подводница функции са методи на изчислено обект.

Сега за функция в примера на функция:

функция add (a) функция на връщане (b) return a + b; console.log (add (1) (2)); // Изходът е 3

Връщаната анонимна функция е метод на функция добави.

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

конструкторите

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

функция Fruit () var име, семейство; // Научно име & семейство this.getName = function () return name;; this.setName = функция (стойност) name = value; this.getFamily = function () return family;; this.setFamily = функция (стойност) семейство = стойност;  var apple = new Fruit (); apple.setName ("Malus domestica"); apple.setFamily ( "Rosaceae"); var orange = нов плод (); orange.setName ("Цитрус"¢А ?? а ?? orange.setFamily ("Rutaceae"); console.log (orange.getName ());¢А ?? а ?? // "Malus domestica" console.log (orange.getFamily ()); // "Rutaceae";

Функции със стрелки (стандарт ES6) [Само в Firefox]

Нова дефиниция на функция от ES6 Standard осигурява по-кратък синтаксис за изразяване на функция. Синтаксисът е

() => / * тяло * /

Тази пробна функция:

var sing = function () console.log ('пеене ...');

е същото като:

var sing = () => console.log ('пеене ...');

Функциите стрелка са анонимни и нямат свои собствени това стойност, това вътре ще бъде същото като това в придружаващия код. Също така, не можете да го промените с конструктор нов ключова дума.

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

setInterval (функция () console.log ('съобщение'), 1000);

setInterval (() => console.log ('съобщение'), 1000);

Функции на генератора (стандарт ES6) [Само в Firefox]

Друга нова дефиниция на функцията от стандарт ES6 е функцията на генератора. Функциите на генератора са в състояние да спрат и продължат да изпълняват. Синтаксисът му е:

функция * име_на функция ()

или

функция * име_на функция ()

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

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

По-долу е прост пример:

функция * generator_func (брой) за (var i = 0; i Ето още един пример:
 функция * randomIncrement (i) добив i + 3; добив i + 5; добив i + 10; добив i + 6;  var itr = randomIncrement (4); console.log (. itr.next () стойност); // 7 console.log (itr.next (). Value); // 9 console.log (itr.next (). Value); // 14 
 Има и a доходност * израз, който предава стойността на друга функция на генератора
 функция * плодове (плодове) добив * зеленчуци (плодове); добив "Грозде";  функция * зеленчуци (плодове) добив плод + "и спанак"; дава плод + "и броколи"; дава плод + "и краставица";  var itr = плодове ("Apple"); console.log (. itr.next () стойност); // "Apple and Spinach" console.log (itr.next (). Value); // "Apple и броколи" console.log (itr.next (). Value); // "Apple и краставица" console.log (itr.next (). Value); // "Грозде" console.log (itr.next (). Value); // неопределен 
 Функциите на генератора са полезни, ако искате да преминете през стойности един по един в предпочитаната от вас точка в кода, като я поставите на пауза, вместо да го направите наведнъж като в цикъл през масив.
 заключение
 По-долу съм включил списък с референции, където ще намерите линкове към препратки и статии, които ще бъдат задълбочени по различни теми отделно. И двете стандартни функции на ES6 ще работят само във Firefox в момента.
 Препратки
 Език ECMAScript: Функции и класове
 Незабавно извикано функционално изражение (IIFE)
 Основите на ES6 генераторите
 Функции със стрелки
 функция - Мрежа на разработчиците на Mozilla