Sololearn: Javascript Functions

Publicado a 14/02/2019, 09:48 por Luis Pitta -org-   [ atualizado a 19/02/2019, 05:26 ]

JavaScript Functions



A JavaScript function is a block of code designed to perform a particular task.
The main advantages of using functions:
Code reuse: Define the code once, and use it many times.
Use the same code many times with different arguments, to produce different results.
A JavaScript function is executed when "something" invokes, or calls, it.



What is a function?

A certain block of code that can be reused over and over again
Profession
Arithmetical term


Defining a Function



To define a JavaScript function, use the function keyword, followed by a name, followed by a set of parentheses ().

The code to be executed by the function is placed inside curly brackets {}.
function name() {.
//code to be executed.
}

Function names can contain letters, digits, underscores, and dollar signs (same rules as variables).


Add the corresponding keyword and symbols to create a function named "test".

 
 
 test() 
 
 

   /* some code */
 
 


Calling a Function



To execute the function, you need to call it.
To call a function, start with the name of the function, then follow it with the arguments in parentheses.
Example:
function myFunction() {
alert("Calling a Function!");
}

myFunction();
//Alerts "Calling a Function!"
Try It Yourself

Always remember to end the statement with a semicolon after calling the function.


Fill in the blanks to define and call the "hello" function.

 
 
 hello() {
   alert("Hi there");
}
 
 
();


Calling Functions



Once the function is defined, JavaScript allows you to call it as many times as you want to.
function myFunction() {
alert("Alert box!");
}

myFunction();
//"Alert box!"

// some other code

myFunction();
//"Alert box!"
Try It Yourself

You can also call a function using this syntax: myFunction.call(). The difference is that when calling in this way, you're passing the 'this' keyword to a function. You'll learn about it later.


Function Parameters



Functions can take parameters
Function parameters are the names listed in the function's definition.

Syntax:
functionName(param1, param2, param3) {
// some code
}

As with variables, parameters should be given names, which are separated by commaswithin the parentheses.

Using Parameters



After defining the parameters, you can use them inside the function.
function sayHello(name) {
alert("Hi, " + name);
}

sayHello("David");
//Alerts "Hi, David"
Try It Yourself

This function takes in one parameter, which is called name. When calling the function, provide the parameter's value (argument) inside the parentheses. 
Function arguments are the real values passed to (and received by) the function.

When and how is the parameter used?

By placing the value before the function call
By placing the value before the function name
By calling the function and placing the value in the parentheses


Function Parameters



You can define a single function, and pass different parameter values (arguments) to it.
function sayHello(name) {
alert("Hi, " + name);
}
sayHello("David");
sayHello("Sarah");
sayHello("John");
Try It Yourself

This will execute the function's code each time for the provided argument.


Drag and drop from the options below to declare a function and call it, by passing "Test" as the argument:

 myAlert(txt) {
   alert("Hello " + txt);
}
;
Test
 
myAlert
 
()
 
("Test")
 
var
 
function


Multiple Parameters



You can define multiple parameters for a function by comma-separating them.
function myFunc(x, y) {
// some code
}

The example above defines the function myFunc to take two parameters.