JavaScript: Procedural vs. OOP

✅ Procedural Programming

• Code is organized into functions and procedures.
• Focuses on what to do and the steps to do it.
• Data and behavior are separate.

Example (JavaScript):

let user = { name: "Ana", age: 20 };

function celebrateBirthday(user) {
  user.age += 1;
}

Characteristics:

• Step-by-step instructions.
• Simple and easy for small tasks.
• Can become messy as complexity grows.

---

✅ Object-Oriented Programming (OOP)

• Code is organized around objects and classes.
• Focuses on what things are (objects) and what they do (methods).
• Data and behavior are bundled together.

Example (JavaScript ES6):

class User {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  celebrateBirthday() {
    this.age += 1;
  }
}

Characteristics:

• Promotes encapsulation, abstraction, inheritance, and polymorphism.
• Easier to manage complex applications.
• Encourages code reuse and structure.

---

🔍 Key Differences

Feature	Procedural	OOP
Structure	Functions	Classes/Objects
Focus	Actions	Entities + their behavior
Data Handling	Separate from logic	Bundled inside objects
Code Reuse	Less structured	Inheritance and composition
Best For	Small scripts, step logic	Large apps, UI systems