Ready to learn the backbone of reusable code? Let's talk about Functions! 🛠️
Functions are blocks of code designed to perform a particular task. They allow you to:
* Avoid repetition (The DRY principle: Don't Repeat Yourself).
* Organize your code into logical, manageable chunks.
* Encapsulate logic that can be reused throughout your program.
⚙️ Function Definition and Calling
There are two primary ways to define a function in modern JavaScript:
1. Function Declarations (Traditional)
This is the standard way to define a function.
// DEFINE the function (it doesn't run yet)
function greetUser(name) { // 'name' is a parameter
console.log("Hello, " + name + "!");
}
// CALL the function (this runs the code block)
greetUser("Charlie"); // Output: Hello, Charlie!
greetUser("Dana"); // Output: Hello, Dana!
2. Arrow Functions (Modern ES6+)
This is the newer, more concise way to write functions, often preferred in modern JS. You store the function in a const variable.
// Arrow Function definition
const calculateArea = (width, height) => {
return width * height;
};
// Calling the function
const area = calculateArea(5, 10); // The result of the function is stored in 'area'
console.log("The area is: " + area); // Output: The area is: 50
➡️ Parameters and return
Parameters (Inputs)
Parameters are variables listed in the function definition (like name, width, and height above). They act as placeholders for the values you pass into the function when you call it, which are called arguments.
The return Keyword (Output)
The return keyword is used to send a value back out of the function so you can use it elsewhere in your code.
* Once return is executed, the function stops immediately.
* If a function doesn't explicitly use return, it implicitly returns undefined.
<!-- end list -->
function add(num1, num2) {
const sum = num1 + num2;
return sum; // Returns the calculated sum
// Any code below return is ignored
}
const result = add(7, 3); // result is now 10
console.log(result); // Output: 10
🌳 Scope: Where Variables Live
Scope determines where variables are accessible. Functions create their own local scope:
* Global Scope: Variables declared outside any function (or block) are accessible anywhere.
* Local/Function Scope: Variables declared inside a function are only accessible within that function.
<!-- end list -->
const globalVar = "I am global."; // Global variable
function testScope() {
const localVar = "I am local."; // Local variable
console.log(globalVar); // Accessible
}
testScope();
// console.log(localVar); // ❌ This would cause an error!
Functions are essential for writing larger, maintainable programs. Now that you know the structure of code (variables, operators, flow control, and functions), we can move on to managing complex data with Arrays and Objects!
Would you like to learn about Arrays next?
0 Comments