JavaScript Complete Notes (Scratch to Mastery)
Module 1: Introduction to JavaScript
- JavaScript is a scripting language used to create and control dynamic website content.
- It runs in the browser and on the server (Node.js).
- Can be included using <script> tags in HTML.
- Common uses: form validation, interactivity, animations, API calls.
Module 2: Variables & Data Types
- `var`, `let`, and `const` are used to declare variables.
- Data Types: string, number, boolean, null, undefined, symbol, bigint.
- Example: let name = "John"; const age = 30;
Module 3: Operators & Expressions
- Arithmetic: +, -, *, /, %
- Comparison: ==, ===, !=, !==, >, <, >=, <=
- Logical: &&, ||, !
- Ternary: condition ? expr1 : expr2
Module 4: Control Flow
- if, else if, else for decision making.
- switch for multiple conditions.
- Loops: for, while, do...while
- break and continue to control loop execution.
Module 5: Functions
- Declared using function keyword or arrow syntax.
- Example: function greet() { return "Hi"; }
- Arrow: const greet = () => "Hi";
- Supports parameters, return values, scope.
Module 6: Arrays & Objects
- Arrays: const fruits = ['apple', 'banana'];
- Common methods: push, pop, shift, unshift, map, filter, reduce.
- Objects: const person = { name: "John", age: 30 };
- Access: obj.key or obj["key"]
Module 7: DOM Manipulation
- document.getElementById, querySelector for selecting elements.
- .innerText, .innerHTML, .style to modify.
- addEventListener to handle events like click, change.
Module 8: Advanced Functions
- Closures: functions with preserved data from outer scope.
- IIFE: (function(){})()
- this: context of function
- call, apply, bind to control 'this'
Module 9: ES6+ Features
- let & const, arrow functions, template literals.
- Destructuring, spread/rest.
- Modules: export/import
- Promises, async/await for async code.
Module 10: OOP in JavaScript
- Prototypes allow inheritance.
- Constructor function: function Car() {}
- Class syntax: class Car {}
- Object creation: new Car()
Module 11: Asynchronous JavaScript
- setTimeout, setInterval
- Callbacks and callback hell
- Promises: new Promise(...)
- async/await syntax
Module 12: Web APIs & Storage
- Web APIs: fetch, DOM API
- localStorage.setItem, getItem
- sessionStorage for session-based data
- Form handling with JS
Module 13: Debugging & Tools
- Use console.log, console.error
- Chrome DevTools for inspection
- ESLint for linting
- Version control with Git
Module 14: Projects
- To-do app with localStorage
- Calculator with DOM manipulation
- Weather app using fetch
- Quiz app with event handling
Module 15: Interview Questions
- Difference between let, var, const?
- Explain closures.
- Event loop and call stack.
- Debounce vs throttle functions.