Преговор: Функции

Това е преговор на наученото в урока за функции.

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

За да създадем функция, трябва първо да я декларираме по същия начин, както декларираме променливи, а след това да ѝ дадем дефиниция:

var sayHello = function() {
};

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

var sayHello = function() {
text("Здравеееей!", random(200), random(200));
};

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

sayHello();

След това можем да я извикаме, където искаме, и колкото пъти искаме!

sayHello();
sayHello();
sayHello();

Често ни се налага да променяме функциите според необходимостите си, да кажем на програмата "виж сега, изпълни този код, но промени някои неща в него". Така можем да преизползваме кода си много пъти и едновременно с това кодът е гъвкав – получаваме най-доброто от двата свята. Можем да постигнем това, като подадем "аргументи" на функцията. С тези аргументи променяме начина, по който функцията работи, и ѝ ги подаваме при извикването на функцията.

Например, какво правим, ако искаме да укажем къде точно да се появи дадено изображение, точно както казваме къде да се рисуват правоъгълници с rect() или елипси с ellipse()? Можем да пробваме да извикаме функцията по този начин, като поставим съобщението на двойка конкретни координати:

sayHello(50, 100);
sayHello(150, 200);

За да накараме това да работи, трябва да променим дефиницията на функцията sayHello, така че да знае, че ще получи два аргумента, които след това да използва:

var sayHello = function(xPos, yPos) {
text("Здравеееей!", xPos, yPos);
};

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

var sayHello = function(x, y) {
text("Здравеееей!", x, y);
};

Функциите могат да приемат произволен брой аргументи – нула, един, два или повече. Можем да решим функцията ни да приема име, което да поздравява:

var sayHello = function(name) {
text("Здравеееей!, " + name, random(200), random(200));
};

И тогава бихме я извикали по този начин:

sayHello("Уинстън");
sayHello("Памела");

Можем да комбинираме тези идеи и да подаваме на функцията три аргумента – за името и позицията:

var sayHello = function(name, x, y) {
text("Здравеееей! " + name, x, y);
};

И след това я викаме така:

sayHello("Уинстън", 10, 100);

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

През цялото време досега ти всъщност извикваше функции – така създаваше рисунки и анимации – като rect, ellipse, triangle и т.н. Всички тези функции идват от библиотеката ProcessingJS, а ние ги зареждаме във всяка програма, която пишеш тук, за да можеш да ги използваш по всяко време. Дефинирали сме функциите вместо теб, защото смятаме, че ще са ти полезни, а от теб зависи да решиш какви свои функции искаш да използваш в програмите си. Например предлагаме ти функцията ellipse, но не и функцията cat– ако програмата ти включва много различни котки на различни позиции, може би трябва да си създадеш собствена функция за котка!

Още едно мощно нещо, което можеш да правиш с една функция е, че можеш да я използваш, за да приемеш стойност, да я изчислиш и да върнеш нова стойност. Помисли за всички неща, които можеш да направиш с калкулатор – да събираш стойности, да изчисляваш квадратен корен, да умножаваш и какво ли още не. Всичко това става с помощта на функции, които приемат вход и връщат резултат. Функциите могат да приемат вход като аргументи и да изведат резултат като използват инструкция return. Ето една функция, която събира две числа и връща резултата:

var addNumbers = function(num1, num2) {
  var result = num1 + num2;
  return result;
};

var sum = addNumbers(5, 2);
text(sum, 200, 200); // Показва "7"

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

var addNumbers = function(num1, num2) {
var result = num1 + num2;
return result;
result = result * 2; // глупаво!
};

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

var biggerSum = addNumbers(2, 5) + addNumbers(3, 2);

Можеш дори да извикаш функция в друга функция, макар че това понякога прави кода трудно четим:

var hugeSum = addNumbers(addNumbers(5, 2), addNumbers(3, 7));

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

Когато декларираме нова променлива вътре във функция, казваме, че променливата е локална за тази функция. Това е така, защото само тази функция може да види променливата – останалата част от програмата извън функцията не я вижда. След като излезем от функцията, тази променлива вече не съществува. В следната функция localResult е локална променлива:

var addNumbers = function(num1, num2) {
  var localResult = num1 + num2;
  println("Локалният резултат е: " + localResult);
  return localResult;
};
addNumbers(5, 7);
println(localResult); // О, не!

Когато изпълним този код, ще получим грешка на последния ред: "localResult is not defined." Променливата е дефинирана само във функцията, защото там сме я декларирали с реда var localResult =, и не сме я декларирали извън нея.

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

var globalResult;

var addNumbers = function(num1, num2) {
  globalResult = num1 + num2;
  println("Глобалният резултат е: " + globalResult);
};
addNumbers(5, 7);
println(globalResult);

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

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

Всеки език за програмиране е различен, но в JavaScript е важно да знаеш, че променливите имат "функционален обхват" – една функция може да вижда локалните променливи, които са декларирани в нея, и глобалните променливи, които са декларирани извън нея, но не може да види локалните променливи в други функции.

Искаш ли да се присъединиш към разговора?

Вписване в профила

Сортирай по:

Все още няма публикации.

Разбираш ли английски? Натисни тук, за да видиш още дискусии в английския сайт на Кан Академия.