Code Roast

Bad Code. Honest Reviews.

Real code patterns that made me cry. Each one comes with a fix and a roast.

JavaScriptRoast #1

The “Callback Pyramid”

Before (painful)

getUser(id, (user) => {
  getPosts(user.id, (posts) => {
    getComments(posts[0].id, (comments) => {
      render(comments);
    });
  });
});

After (better)

const user = await getUser(id);
const posts = await getPosts(user.id);
const comments = await getComments(posts[0].id);
render(comments);

This is the callback version of Inception — layers within layers. One more level and you would need a whiteboard to debug it. Async/await was invented exactly for this reason.

JavaScriptRoast #2

The “Magic Number Factory”

Before (painful)

if (status === 2) {
  // do something
} else if (status === 5) {
  // do something else
} else if (status === 8) {
  // ...
}

After (better)

const STATUS = { PENDING: 2, SHIPPED: 5, CANCELLED: 8 };

if (status === STATUS.PENDING) { ... }
else if (status === STATUS.SHIPPED) { ... }

Numbers without names are like inside jokes at a party — only you understand them. Six months from now, even you won't know what 8 means. Name your constants like an adult.

JavaScriptRoast #3

The “If-Else Chain of Doom”

Before (painful)

function getRole(role) {
  if (role === "admin") return 1;
  else if (role === "editor") return 2;
  else if (role === "viewer") return 3;
  else if (role === "moderator") return 4;
  else if (role === "guest") return 5;
  else return 0;
}

After (better)

const ROLE_MAP = {
  admin: 1, editor: 2, viewer: 3,
  moderator: 4, guest: 5,
};

const getRole = (role) => ROLE_MAP[role] ?? 0;

This function has more else-ifs than a teenager has excuses. Use an object map. It is faster, cleaner, and does not need 15 lines to say what could be said in 2.

JavaScriptRoast #4

The “console.log Debugging Suite”

Before (painful)

function calculateTotal(items) {
  console.log("items:", items);
  let total = 0;
  for (let i = 0; i < items.length; i++) {
    console.log("item:", items[i]);
    total += items[i].price;
    console.log("running total:", total);
  }
  console.log("final total:", total);
  return total;
}

After (better)

// Use debugger, breakpoints, or a proper logger
function calculateTotal(items) {
  return items.reduce((sum, item) => sum + item.price, 0);
}

Four console.logs for a 10-line function. This is not debugging — this is journaling. Learn breakpoints. Your console will thank you.