🧠 JavaScript Functions & Scope

🛠️ Functions in JavaScript — The Real MVP

A function is like your favorite shortcut: build it once, and reuse it anytime you want. Instead of copy-pasting the same code everywhere (ugh, no thanks), you just call the function and boom — it handles the rest.

📦 1. Function Declaration — The OG

This is the classic way of writing a function:

function greet(name) {
  console.log("Hello, " + name + "!");
}

greet("Alice");

🌀 Fun fact: You can actually call this function before it’s even written in your code. Why? Because it gets hoisted to the top behind the scenes. Kinda magic.

🧾 2. Function Expression — The Chill Alternative

Here, you treat the function like a regular value and store it in a variable:

const greet = function(name) {
  console.log("Hi, " + name + "!");
};

greet("Bob");

⚡ 3. Arrow Function — Clean, Modern, and Snappy

For those who love clean code and minimal vibes:

const greet = (name) => {
  console.log("Hey, " + name + "!");
};

greet("Charlie");

🚨 Heads-up: Arrow functions are slick, but they don’t have their own this. So if you’re working inside objects or classes, make sure that’s what you actually want.

🌍 Scope in JavaScript — Who Sees What?

Scope is all about visibility — which parts of your code can see or use a variable. It depends on where you declare it.

🌐 Global Scope — The Open World

Declare a variable outside any function, and it’s accessible from pretty much anywhere:

let color = "blue";

function showColor() {
  console.log(color); // Totally works
}

🔒 Local Scope — The Private Zone

Put a variable inside a function, and it stays in its own little world:

function greet() {
  let message = "Hello!";
  console.log(message); // Works just fine
}

console.log(message); // ❌ Nope, doesn't exist out here

🧼 Pro Tip: Stick with local variables when you can — it keeps things clean and avoids surprise bugs.

✅ TL;DR — Just the Gist

• Function Declaration — The OG style. Hoisted.
• Function Expression — Stored in a variable. Not hoisted.
• Arrow Function — Short and sweet. No this binding.
• Global Scope — Visible everywhere.
• Local Scope — Only visible where it’s defined.