JavaScript Exercises and Examples

These JavaScript exercises help you practice everything from this tutorial. Try each task yourself first, then open the solution in the editor, run it and experiment with changes.

Exercise 1: FizzBuzz

Print numbers 1 to 15. For multiples of 3 print Fizz, for multiples of 5 print Buzz, for both print FizzBuzz.

const out = [];
for (let i = 1; i <= 15; i++) {
  out.push(i % 15 === 0 ? "FizzBuzz" : i % 3 === 0 ? "Fizz" : i % 5 === 0 ? "Buzz" : i);
}
console.log(out.join(" "));
1 2 Fizz 4 Buzz Fizz 7 8 Fizz Buzz 11 Fizz 13 14 FizzBuzz

Exercise 2: Word Frequency

Count how many times each word appears in a sentence, ignoring case and punctuation, and print the top three.

const text = "The cat and the dog. The dog barked, and the cat ran!";
const words = text.toLowerCase().match(/[a-z]+/g);
const counts = {};
for (const w of words) counts[w] = (counts[w] ?? 0) + 1;

Object.entries(counts)
  .toSorted((a, b) => b[1] - a[1])
  .slice(0, 3)
  .forEach(([w, n]) => console.log(w, n));
the 4
cat 2
and 2

Exercise 3: Order Summary

Given a list of orders, compute total revenue, the best-selling product and the average order value.

const orders = [
  { product: "Rice", qty: 10, price: 12.5 },
  { product: "Tea", qty: 25, price: 6 },
  { product: "Rice", qty: 5, price: 12.5 },
  { product: "Coffee", qty: 4, price: 22 },
];
const revenue = orders.reduce((t, o) => t + o.qty * o.price, 0);
const byProduct = {};
for (const o of orders) byProduct[o.product] = (byProduct[o.product] ?? 0) + o.qty;
const best = Object.entries(byProduct).toSorted((a, b) => b[1] - a[1])[0];

console.log("Revenue:", revenue);
console.log("Best seller:", best[0], "(" + best[1] + " units)");
console.log("Average order:", (revenue / orders.length).toFixed(2));
Revenue: 425.5
Best seller: Tea (25 units)
Average order: 106.38

Exercise 4: Mini To-Do List

Build a to-do list with an input, an Add button and items you can click to mark as done. It combines DOM creation, events and event delegation.

const input = document.createElement("input");
input.placeholder = "New task";
const add = document.createElement("button");
add.textContent = "Add";
const list = document.createElement("ul");
document.body.append(input, add, list);

add.addEventListener("click", () => {
  const task = input.value.trim();
  if (!task) return;
  const li = document.createElement("li");
  li.textContent = task;
  list.append(li);
  input.value = "";
  input.focus();
});

list.addEventListener("click", (e) => {
  if (e.target.tagName === "LI") {
    e.target.style.textDecoration =
      e.target.style.textDecoration ? "" : "line-through";
  }
});
(An input and Add button; tasks appear in a list and toggle strike-through when clicked)

More Ideas to Practice

  • Reverse a string and check if it is a palindrome
  • Build a countdown timer with setInterval
  • Fetch users from an API and render them as cards
  • Save the to-do list to localStorage so it survives a reload
  • Write a class for a shopping cart with add, remove and total methods

Frequently asked questions

What are good JavaScript projects for beginners?

A to-do list, calculator, quiz app, weather app using a public API and a simple game like tic-tac-toe all practice core skills.

How can I practice JavaScript every day?

Solve one small exercise daily, rebuild small features you see on websites, and read other people's code on GitHub.

What should I learn after JavaScript?

Common next steps are TypeScript for safer code, a framework like React, and Node.js for back-end development.