Introducing Function in JavaScript Programming Language
Function is one of the key and widely used concepts in JavaScript programming language. Functions allow you to modularly define a piece of code that is to be repeated multiple times in the program and call it repeatedly. This makes coding neater, more readable, and more maintainable. It goes without saying that in the article “JavaScript Training Part Three” we very briefly mentioned this key concept, so we suggest you review the previous articles first.
Function definition
To define a function in JavaScript, we use the “function” keyword. The general structure of a function is as follows:
function functionName(parameters) {
// کدهای اجرایی
}
It is chosen to be concise and conceptual because if someone wants to analyze the code, the way you name it will be very effective.
parameters: The parameters that the function accepts (if any).
Inside { }, the codes to be executed are written
function greet() {
console.log("Hello, World!");
}
In the example above, a function named greet is defined that displays a message on the console.
Function Call
A function in JavaScript is a block of code that is defined to perform a specific task. A JavaScript function is only executed when it is called at some point in the program. After defining a function, to execute it, we need to call it
greet(); // نتیجه: Hello, World!
Functions with Parameters
Functions can have inputs (parameters) so that they can produce different outputs based on those inputs. You can also set a default value for the parameters of a function so that if no value is provided, the default value will be used. For example, consider the following code.
function greet(name) {
console.log("Hello, " + name + "!");
}
greet("Ali"); // نتیجه: Hello, Ali!
In this example, the greet function takes a parameter named name and then displays a customized welcome message on the console.
Functions with a return value (Return Value)
Functions can return values as output. For this, the return keyword is used.
function add(a, b) {
return a + b;
}
let sum = add(5, 10);
console.log(sum); // نتیجه: 15
In this example, the greet function takes a parameter named name and then displays a customized welcome message on the console.
Local Variable in JavaScript Function
In JavaScript, a local variable is a variable that is defined inside a function and can only be accessed in the same function. These variables cannot be accessed outside the function or in other parts of the program. This feature makes local variables safe in their own scope and does not interfere with other variables outside that scope.
Local Variable Definition
To define a local variable, it is enough to define the variable inside a function using the keywords var, let, or const. These variables are only available during function execution.
function myFunction() {
let localVar = "I am a local variable";
console.log(localVar);
}
myFunction(); // خروجی: I am a local variable
console.log(localVar); // خطا: localVar تعریف نشده است
In this example, the localVar variable is a local variable that is defined inside the myFunction function and is accessible only inside this function. If we try to access this variable outside the access function, we will encounter an error because localVar does not exist outside the scope of its definition.
The Difference Between Local and Global Variables
Local variable: Available only within the scope of the function in which it is defined.
Global Variable: It is available anywhere in the program code and outside the functions.
Variables that are defined outside of any function are known as global variables.
let globalVar = "I am a global variable";
function myFunction() {
let localVar = "I am a local variable";
console.log(localVar); // خروجی: I am a local variable
console.log(globalVar); // خروجی: I am a global variable
}
myFunction();
console.log(globalVar); // خروجی: I am a global variable
console.log(localVar); // خطا: localVar تعریف نشده است
In this example, globalVar is a global variable and is accessible in all parts of the code, while localVar is a local variable and can only be used inside the myFunction function.
Anonymous Functions
Sometimes we don’t need to give names to functions. In these cases, we can use anonymous functions. These functions are usually passed as arguments to other functions or assigned to a variable.
let multiply = function(a, b) {
return a * b;
};
console.log(multiply(3, 4)); // نتیجه: 12
Functions as Arguments
Functions in JavaScript can be passed as input to other functions, which are called callback functions. This feature makes JavaScript a powerful language for asynchronous programming.
function processUserInput(callback) {
let name = prompt("Enter your name:");
callback(name);
}
processUserInput(function(name) {
console.log("Hello, " + name + "!");
});
In this example, the processUserInput function takes a function as an argument and then calls it.
Arrow Functions
In ES6 (ECMAScript 2015), a new type of function called arrow functions was introduced, which has a more concise syntax.
const subtract = (a, b) => a - b;
console.log(subtract(10, 4)); // نتیجه: 6
In this example, the subtract arrow function is defined using abbreviated syntax.
For more exercises, you can refer to W3schools online programming reference.
Youtube Video
Functions in JavaScript play a very important role in improving code structure and efficiency. Using functions helps you to write your code more modular, readable, and efficiently. By mastering various function concepts such as parameters, return values, and different types of functions (anonymous and arrow), you can take advantage of all the capabilities of JavaScript.
