1. Reusable parts of Code Doncho Minkov Telerik Software Academy academy.telerik.com Technical Trainer http://minkov.it

2.  Functions Overview  Declaring and Creating Functions  Calling Functions  Functions with Parameters  Examples: Functions With Parameters  Print the Sign of Number  Period Between Months  Printing a Triangle of Numbers 2

3.  Returning Values From Functions  Examples: Returning Values From Functions  Temperature Conversion  Positive Numbers  Data Validation 3

4. What is a function? 4

5.  A function is a kind of building block that solves a small problem  A piece of code that has a name and can be called from the other code  Can take parameters and return a value  Functions allow programmers to construct large programs from simple pieces  Functions are also known as methods, procedures, and subroutines 5

6.  More manageable programming  Split large problems into small pieces  Better organization of the program  Improve code readability  Improve code understandability  Avoiding repeating code  Improve code maintainability  Code reusability  Using existing functions several times 6

7. 7

9.  Functions are first-class objects  They are objects and can be manipulated and passed around like just like any other object  They are actually Function objects.

10.  Each function has a name  It is used to call the Function  Describes its purpose 10 fucntion printLogo(){ console.log("Telerik Corp."); console.log("Telerik Corp."); console.log("www.telerik.com"); console.log("www.telerik.com");} Function name

11. function printLogo(){ console.log("Telerik Corp."); console.log("Telerik Corp."); console.log("www.telerik.com"); console.log("www.telerik.com");} 11  Each function has a body  It contains the programming code  Surrounded by { and } Function body

12. Live Demo 12

13.  Functions can be defined in four ways:  By using the constructor of the Function object  By function declaration  By function expression with anonymous function  By function expression with named function 13 var print = new Function("console.log('Hello')"); Function print() {console.log('Hello')}; var print = function() {console.log('Hello')}; var print = function printFunc() {console.log('Hello')};

15.  To call a function, simply use: 1.The function’s name 2.Parentheses (don’t forget them!) 3.A semicolon ( ; )  This will execute the code in the function’s body and will result in printing the following: 15 printLogo(); Telerik Corp. www.telerik.com

16.  A function can be called from:  Any other Function  Itself (process known as recursion) 16 function print(){ console.log("printed"); console.log("printed");} function anotherPrint(){ print(); print(); anotherPrint(); anotherPrint();} Don't do this at home

17. Live Demo

18. Passing Parameters and Returning Values

19.  To pass information to a function, you can use parameters (also known as arguments)  You can pass zero or several input values  You can pass values of different types  Each parameter has name  Parameters are assigned to particular values when the function is called  Parameters can change the function behavior depending on the passed values 19

20.  Function’s behavior depends on its parameters  Parameters can be of any type  integer, floating-point, string, etc.  Arrays 20 function printSign(number) { if (number > 0) if (number > 0) console.log("Positive"); console.log("Positive"); else if (number < 0) else if (number < 0) console.log("Negative"); console.log("Negative"); else else console.log("Zero"); console.log("Zero");}

21.  Functions can have as many parameters as needed: 21 function printMax(number1, number2){ var max = number1; var max = number1; if (number2 > number1) if (number2 > number1) max = number2; max = number2; console.log("Maximal number: " + max); console.log("Maximal number: " + max);}

22.  To call a function and pass values to its parameters:  Use the function’s name, followed by a list of expressions for each parameter  Examples: 22 printSign(-5);printSign(balance);printSign(2+3); printMax(100, 200); printMax(oldQuantity * 1.5, quantity * 2);

23. Examples

24. 24 function printSign(number){ if (number > 0) if (number > 0) console.log("The number " + number + " is positive."); console.log("The number " + number + " is positive."); else if (number < 0) else if (number < 0) console.log("The number " + number + " is negative."); console.log("The number " + number + " is negative."); else else console.log("The number " + number + " is zero."); console.log("The number " + number + " is zero.");} function printMax(number1, number2){ var max = number1; var max = number1; if (number2 > number1){ if (number2 > number1){ max = number2; max = number2; } console.log("Maximal number: " + max); console.log("Maximal number: " + max);}

25. Live Demo

26.  Display the period between two months in a user-friendly way 26 function sayMonth(month) { var monthNames = [ "January", "February", "March", var monthNames = [ "January", "February", "March", "April", "May", "June", "July", "April", "May", "June", "July", "August", "September", "October", "August", "September", "October", "November", "December"]; "November", "December"]; return monthNames[month-1]; return monthNames[month-1];} (the example continues)

27. 27 function sayPeriod(startMonth, endMonth){ var period = endMonth - startMonth; var period = endMonth - startMonth; if (period < 0){ if (period < 0){ period = period + 12; period = period + 12; // From December to January the // From December to January the // period is 1 month, not -11! // period is 1 month, not -11! } var resultString = "There are "; var resultString = "There are "; resultString += period + " + months from "; resultString += period + " + months from "; resultString += sayMonth(startMonth); resultString += sayMonth(startMonth); resultString += " to "; resultString += " to "; resultString += sayMonth(endMonth); resultString += sayMonth(endMonth); }

28. Live Demo

29.  Creating a program for printing triangles as shown below: 1 11 2 1 21 2 3 1 2 31 2 3 4 1 2 3 41 2 3 4 5 n=5  1 2 3 4 5 n=6  1 2 3 4 5 6 1 2 3 41 2 3 4 5 1 2 31 2 3 4 1 21 2 3 11 2 1 29

30. 30 int n = read("input-tb"); var line; for (line = 1; line <= n; line++) printLine(1, line); printLine(1, line); for (line = n-1; line >= 1; line--) printLine(1, line); printLine(1, line); function printLine(start, end){ var line=""; var line=""; for (var i = start; i <= end; i++){ for (var i = start; i <= end; i++){ line += " " + i; line += " " + i; } console.log(line); console.log(line);}

31. Live Demo

33.  In JavaScript functions can return a value  The returned values can be of any type  Even of type void (no type)  Returned value  Can be assigned to a variable:  Can be used in expressions:  Can be passed to another Function: var head = arr.shift(); var price = getPrice() * quantity * 1.20; var age = parseInt("5");

34.  Functions can return any type of data ( int, string, array, etc.)  The combination of function's name and parameters is called function signature  Use return keyword to return a result 34 function multiply(int firstNum, int secondNum){ return firstNum * secondNum; return firstNum * secondNum;}

35.  The return statement:  Immediately terminates function’s execution  Returns specified expression to the caller  Example:  To terminate void function, use just:  Return can be used several times in a function body  To return a different value in different cases 35 return -1; return;

36. Examples

37.  Convert temperature from Fahrenheit to Celsius: 37 function fahrenheitToCelsius(degrees){ var celsius = (degrees - 32) * 5 / 9; var celsius = (degrees - 32) * 5 / 9; return celsius; return celsius;} var tStr = read("input-tb"); var t = parseInt(tStr); t = fahrenheitToCelsius(t); console.log("Temperature in Celsius: " + t);

38. Live Demo

39.  Check if all numbers in a sequence are positive: 39 function arePositive(sequence){ for (var i in sequence) { for (var i in sequence) { var number = sequence[i]; var number = sequence[i]; if (number <= 0) { if (number <= 0) { return false; return false; } } return true; return true;}

40. Live Demo

41.  Validating input data: 41 function validate(username, password, email) { return validateUsername(username) && return validateUsername(username) && validatePass(password) && validateEmail(email); validatePass(password) && validateEmail(email);} function validateUsername(username) { return username != "" && username.length > 3 && username.length 3 && username.length < 20;} function validatePass(pass) { return pass != "" && pass.length > 6 && pass.length 6 && pass.length < 20;} function validateEmail(email) { var containsAt = email.indexOf("@"); var containsAt = email.indexOf("@"); return containsAt > 3 && email.length - containsAt > 3; return containsAt > 3 && email.length - containsAt > 3;}

42. Live Demo

44.  Variables can be either local or global  Global variables are accessible from any JS code  Locals can be accessed only from their scope  Global variables can be made in two ways:  Defining a common variable outside of function  The variables becomes local to the window  Define a variable inside a function, without var

45. Live Demo

46.  Each function should perform a single, well-defined task  Function’s name should describe that task in a clear and non-ambiguous way  Good examples: calculatePrice, readName  Bad examples: f, g1, Process  In JS functions should start with lower letter  Avoid functions longer than one screen  Split them to several shorter functions 46

47. Questions?Questions? http://academy.telerik.com

48. 1. Write a function that asks the user for his name and prints “Hello, ” (for example, “Hello, Peter!”). Write a script to test this function. 2. Write a function GetMax() with two parameters that returns the bigger of two integers. Write a script that reads 3 integers and prints the biggest of them using the function GetMax(). 3. Write a function that returns the last digit of given integer as an English word. Examples: 512  "two", 1024  "four", 12309  "nine". 48

49. 4. Write a function that counts how many times given number appears in given array. Write a test script to check if the function is working correctly. 5. Write a function that checks if the element at given position in given array of integers is bigger than its two neighbors (when such exist). 6. Write a Function that returns the index of the first element in array that is bigger than its neighbors, or -1, if there’s no such element.  Use the function from the previous exercise. 49

50. 7. Write a function that reverses the digits of given decimal number. Example: 256  652 8. Write a function that adds two positive integer numbers represented as arrays of digits (each array element arr[i] contains a digit; the last digit is kept in arr[0] ). Each of the numbers that will be added could have up to 10 000 digits. 50