JavaScript Fundamentals

JavaScript brings interactivity to web pages. You’ll learn the core language concepts, modern ES6 features, array methods, and basic DOM manipulation.

Variables, Functions, Loops, Arrays, and Objects

JavaScript is a versatile, dynamically typed language used in both browsers and servers. Start by understanding how to declare variables, create functions, use loops, and work with arrays and objects.

js
// Variables
let name = "
";
const age = 21;
var city = "Bangalore";


// Functions
function greet(user) {
  return `Hello, ${user}!`;
}
console.log(greet(name));


// Loops
for (let i = 0; i < 3; i++) {
  console.log("Count:", i);
}


// Arrays & Objects
const fruits = ["apple", "banana", "mango"];
const user = { name: "Sumit", course: "MERN" };
console.log(fruits[1], user.name);
ES6 Features

ES6 introduced modern features like arrow functions, destructuring, template literals, default parameters, and spread/rest operators. These make code cleaner and more expressive.

js
// Arrow functions
const add = (a, b) => a + b;


// Template literals
const user = "Abhiram";
console.log(`Welcome, ${user}!`);


// Destructuring
const person = { name: "Sumit", age: 22 };
const { name, age } = person;
console.log(name, age);


// Spread operator
const nums = [1, 2, 3];
const moreNums = [...nums, 4, 5];
console.log(moreNums);
Array Methods (map, filter, reduce)

Array methods like map(), filter(), and reduce()let you process data efficiently using a functional style.

js
const numbers = [1, 2, 3, 4, 5];


// map()
const doubled = numbers.map(num => num * 2);
console.log("Doubled:", doubled);


// filter()
const evens = numbers.filter(num => num % 2 === 0);
console.log("Even numbers:", evens);


// reduce()
const sum = numbers.reduce((acc, cur) => acc + cur, 0);
console.log("Sum:", sum);
DOM Basics & Events

The DOM (Document Object Model) represents the page structure. JavaScript can change elements, listen to user actions, and dynamically update content.

DOM Manipulation Example