Development

JavaScript Quiz Preparation: Common Traps and How to Practise

What JavaScript quizzes really test, the type coercion, scope and async traps that catch learners, and a step-by-step way to prepare for tests and interviews.

SmartCampus Buddy TeamSeptember 27, 20269 min read

JavaScript has a reputation for surprising behaviour, and quiz writers know it. Most of the "gotchas" come from a small number of ideas: type coercion, scope and hoisting, this, and asynchronous execution. Learn those and most questions stop being surprising.

What JavaScript quizzes test

  • Type coercion and equality: what == converts and what === does not.
  • Scope and closures: what a function can see, and when.
  • `this` binding: what it refers to inside methods, callbacks and arrow functions.
  • Async order: which line of output appears first when promises and timers are mixed.
  • Array and object methods: which method returns what.

Coercion traps to try yourself

Predict each result, then check.

  1. typeof NaN is "number". NaN is a numeric value meaning "not a valid number".
  2. null == 0 is false, but null >= 0 is true. The relational operators convert null to 0, while == has a special rule for null.
  3. 0 || "default" gives "default", but 0 ?? "default" gives 0. The nullish operator only replaces null and undefined.
  4. [1, 2, 3].includes(NaN) is false, but [NaN].includes(NaN) is true, because includes uses the "same value zero" comparison.
  5. "b" + "a" + +"a" + "a" is "baNaNa". The unary plus turns "a" into NaN, which then becomes the string "NaN".
  6. parseInt("08") is 8, and parseInt("3px") is 3, but Number("3px") is NaN.

Scope, hoisting and closures

  • var is function-scoped and hoisted with the value undefined. let and const are block-scoped and sit in the temporal dead zone until their declaration runs.
  • A function declaration is hoisted with its body, so you can call it before it appears. A function expression assigned to a variable is not.
  • A closure remembers the variables around it, not copies of their values. That is why callbacks created in a loop with var all see the final value.

Practise these in the Functions, Scope & Closures quiz.

How this works, in one paragraph

For a normal function, this depends on how the function is called, not where it is written. obj.method() sets this to obj. Pull the method off and call it alone and you lose that binding. Arrow functions do not have their own this; they use the surrounding one, which makes them handy for callbacks and wrong for object methods that need their own this.

Async order, step by step

When code mixes synchronous statements, promise callbacks and timers, use this order:

  1. All synchronous code runs first, top to bottom.
  2. Then queued promise callbacks (microtasks) run, including code after await.
  3. Then timer callbacks (setTimeout) run, even with a delay of 0.

Write the three queues down as you read a snippet. The Async JavaScript quiz and the JavaScript Debug Lab give you practice on exactly this.

A four-step preparation plan

  1. Work through JavaScript fundamentals until coercion feels predictable.
  2. Do the scope and closures quiz, and re-implement a counter and a debounce function from memory.
  3. Practise async order with small snippets you write yourself.
  4. Take each quiz in exam mode and review every miss.

If you are heading toward front-end work, the next step is React props vs state.

Key takeaways

  • Most JavaScript surprises come from coercion, scope, this and async order.
  • Trace code by writing down values and queues instead of guessing.
  • Use === by default, and know exactly when == converts.
  • Explain each mistake in your own words to make it stick.