Understanding JavaScript Functions — A Simple Walkthrough

Hello, I'm Maneshwar. I'm building git-lrc, an AI code reviewer that runs on every commit. It is free, unlimited, and source-available on Github. Star Us to help devs discover the project. Do give it a try and share your feedback for improving the product.

I'm working on FreeDevTools online currently building one place for all dev tools, cheat codes, and TLDRs — a free, open-source hub where developers can quickly find and use tools without any hassle of searching all over the internet.

The project is open-source here: FreeDevTools.
Do support me by giving the repo a ⭐ on GitHub — it really helps!

JavaScript is a versatile and widely-used programming language, powering everything from simple websites to complex web applications.

Functions in JavaScript are at the heart of its logic and structure.

In this blog, we’ll explore various aspects of functions in JavaScript, ranging from simple declarations to advanced topics like recursion and closures.

Basic Function Declaration

A function in JavaScript is a reusable block of code that performs a specific task. Here's a basic example of a function that multiplies two numbers:

function multiply(a, b) {
  b = typeof b !== "undefined" ? b : 1;
  return a * b;
}

console.log(multiply(5)); // Output: 5

Explanation

• The function multiply takes two parameters a and b.
• If b is not provided, it defaults to 1.
• The result is the product of a and b.

This is a common way to handle default parameters before ES6.

Arrow Functions

Arrow functions introduced in ES6 provide a shorter syntax for defining functions.

Example:

const sayHello = () => {
    console.log(`Hello from Arrow Function!`);
};

sayHello(); // Output: Hello from Arrow Function!

Why Use Arrow Functions?

• Less boilerplate code.
• No binding of this, which makes them ideal for callbacks.

Immediately-Invoked Function Expressions (IIFE)

An IIFE is a function that executes immediately after it is defined.

Example:

(async () => {
    const x = 1;
    const y = 9;
    console.log(`Hello, The Answer is ${x + y}`);
})();

Why Use IIFE?

• Creates a private scope.
• Avoids polluting the global namespace.
• Useful for asynchronous tasks.

Arguments Object

Inside every non-arrow function, JavaScript provides an arguments object that contains all the arguments passed to the function.

Example:

function greet() {
    console.log(arguments[0], arguments[1]);
}

greet('Hello', 'World'); // Output: Hello World

Note

• It's array-like but not an actual array.
• In modern code, use rest parameters instead: function greet(...args) {}.

Scope and Function Stack

Scope

Scope defines where a variable or function can be accessed.

Types of Scope:

1. Global scope: Available anywhere in the script.
2. Module scope: Used when working with ES6 modules.
3. Function scope: Defined inside functions.
4. Block scope: Defined inside curly braces {} like loops or conditionals.

Function Stack (Call Stack)

The call stack keeps track of which function is executing and where it’s called from. It helps the JavaScript engine manage nested function calls.

Recursion

Recursion is when a function calls itself to solve smaller instances of the same problem.

Example:

function factorial(n) {
    if (n <= 1) return 1;
    return n * factorial(n - 1);
}

console.log(factorial(5)); // Output: 120

Important Concept

• Always include a base case to prevent infinite recursion.

Lexical Scoping

The lexical environment defines the context in which a function was created. It determines how variables are resolved.

Closures

Closures allow a function to access variables from its enclosing scope, even after that outer function has returned.

Example:

function outer() {
    let counter = 0;
    return function inner() {
        counter++;
        console.log(counter);
    };
}

const increment = outer();
increment(); // Output: 1
increment(); // Output: 2

Why Are Closures Important?

• They help manage state.
• Widely used in event handlers, callbacks, and data privacy patterns.

Built-in Functions

JavaScript offers numerous built-in functions and methods that simplify tasks:

• parseInt(): Converts strings to integers.
• setTimeout(): Delays function execution.
• Math.random(): Generates random numbers.
• Array, String, Date: Include built-in methods like .map(), .filter(), .slice() for data manipulation.

Example:

console.log(Math.random()); // Outputs a random number between 0 and 1

Conclusion

Understanding functions is essential to mastering JavaScript. From basic definitions to advanced concepts like recursion and closures, functions help you write efficient, maintainable, and powerful code.

Learning these topics thoroughly will set you apart as a JavaScript developer and enable you to tackle real-world problems with confidence.

Happy coding!

*AI agents write code fast. They also silently remove logic, change behavior, and introduce bugs -- without telling you. You often find out in production.

git-lrc fixes this. It hooks into git commit and reviews every diff before it lands. 60-second setup. Completely free.*

Any feedback or contributors are welcome! It's online, source-available, and ready for anyone to use.

⭐ Star it on GitHub:

HexmosTech / git-lrc

Free, Unlimited AI Code Reviews That Run on Commit

git-lrc

Free, Unlimited AI Code Reviews That Run on Commit

---

AI agents write code fast. They also silently remove logic, change behavior, and introduce bugs -- without telling you. You often find out in production.

git-lrc fixes this. It hooks into git commit and reviews every diff before it lands. 60-second setup. Completely free.

See It In Action

See git-lrc catch serious security issues such as leaked credentials, expensive cloud operations, and sensitive material in log statements

git-lrc-intro-60s.mp4

Why

• 🤖 AI agents silently break things. Code removed. Logic changed. Edge cases gone. You won't notice until production.
• 🔍 Catch it before it ships. AI-powered inline comments show you exactly what changed and what looks wrong.
• 🔁 Build a habit, ship better code. Regular review → fewer bugs → more robust code → better results in your team.
• 🔗 Why git? Git is universal. Every editor, every IDE, every AI…

View on GitHub