Stop 03 · HTML, CSS & JavaScript EssentialsTopics · 6/11

JavaScript Fundamentals

Part of the Full Stack Developer Roadmap

In short

JavaScript is the one language that runs in the browser and, with Node.js, on the server too. Learn variables, functions, arrays and loops properly once, and you'll use them on both sides daily.

Variables, functions, objects, arrays and control flow — the core language you'll write on both sides of a full-stack app, since Node.js runs the same JavaScript your browser does.

The mascot follows a doodled recipe card and counts a stack of rotis in a kitchen.

Think of it like this

Dadi's handwritten recipe card

A recipe has ingredients in jars (variables), steps you repeat (functions), choices like 'no tomatoes? use curd' (if/else) and 'make ten rotis' (loops). JavaScript is the same kind of card, and the browser or Node is the cook.

Watch it happen

A loop adding up a cart

360

899

150

1/5Three line totals sit in an array. A variable called total starts at 0.

The big ideas

What you need to know

const by default

Use const for values you won't reassign and let for ones you will. Skip var, its scoping rules cause surprises.

Functions are reusable steps

Wrap logic like 'calculate cart total' in a function. The same function can run in React and in your Express route.

Arrays and objects hold data

Arrays are ordered lists, objects are labelled fields. Almost every API response is a mix of both.

=== not ==

=== compares value and type. == quietly converts types, so "0" == 0 is true, which hides bugs.

See it in code

Walk through the code

1const cart = [2  { name: "Notebook", price: 120, qty: 3 },3  { name: "Earphones", price: 899, qty: 1 },4  { name: "Pen set", price: 50, qty: 3 },5];6 7function cartTotal(items, couponPercent = 0) {8  let total = 0;9  for (const item of items) {10    total += item.price * item.qty;11  }12  if (total > 1000) total -= (total * couponPercent) / 100;13  return Math.round(total);14}15 16console.log(cartTotal(cart, 10)); // 1268

1/4An array of objects, the exact shape you'd get from a /api/cart response.

Run this in the browser console or with node file.js. Same language, same answer.

Save yourself the pain

Common mistakes

Oops

Doing money maths with decimals like 0.1 + 0.2 and trusting the result.

Do this instead

Store money as whole paise or rupees (integers) and only format it for display.

Oops

Copying code into both the React app and the server, then fixing a bug in only one.

Do this instead

Put shared logic like price rules in one module and import it on both sides.

Your mission

Write a cart calculator

~25 min

Quick check

What does this log? const a = [1, 2]; const b = a; b.push(3); console.log(a.length);

Go deeper

1Practice array methods (`map`, `filter`, `reduce`) until they're second nature.
2Write functions using both function declarations and arrow function syntax.
3Focus on destructuring and spread/rest — they show up constantly in both React and Node code.