Frontend Web Development JavaScript Programming Syllabus

JavaScript Programming syllabus — full chapter and topic list

Expand any chapter to see its topics and sub-topics. This is the whole examinable outline for JavaScript Programming in Frontend Web Development, not a summary of it.

1. 1

   JavaScript Basics

   5 topics

   • Variables, let, const & Scope
   • Data Types & Type Coercion
   • Operators & Expressions
   • Conditionals & Loops
   • Functions & Arrow Functions
2. 2

   Data Structures

   4 topics

   • Arrays & Array Methods
   • Objects & Property Access
   • Destructuring & Spread/Rest
   • Maps, Sets & JSON
3. 3

   Functions & Scope in Depth

   4 topics

   • Closures & Lexical Scope
   • The this Keyword & Binding
   • Higher-Order Functions & Callbacks
   • Hoisting & Execution Context
4. 4

   Objects, Prototypes & Classes

   4 topics

   • Prototypal Inheritance
   • ES6 Classes & Inheritance
   • Getters, Setters & Static Members
   • Modules (import / export)
5. 5

   DOM Manipulation

   4 topics

   • Selecting & Traversing Elements
   • Creating & Modifying Nodes
   • Event Handling & Delegation
   • Forms & Browser Events
6. 6

   Asynchronous JavaScript

   5 topics

   • Callbacks & the Event Loop
   • Promises & Chaining
   • async / await
   • Fetch API & HTTP Requests
   • Error Handling (try/catch)
7. 7

   Browser APIs & Storage

   4 topics

   • Local Storage & Session Storage
   • Cookies & IndexedDB
   • Geolocation, History & URL APIs
   • Web Workers & Timers

JavaScript Programming flashcards for Frontend Web Development

20 of 51 cards from the JavaScript Programming deck — real questions with worked answers.

1. What is the key difference between `var`, `let`, and `const` regarding scope?

   `var` is function-scoped (or global), while `let` and `const` are block-scoped (limited to the nearest `{ }`). `const` also prevents reassignment of the binding.

2. Does `const` make an object immutable?

   No. `const` only prevents reassignment of the variable binding. The object's properties can still be mutated (e.g., `obj.x = 1` works, but `obj = {}` throws).

3. What is the Temporal Dead Zone (TDZ)?

   The period between entering a block scope and the actual declaration of a `let`/`const` variable. Accessing the variable in the TDZ throws a `ReferenceError`, even though it is hoisted.

4. List the seven primitive data types in JavaScript.

   `string`, `number`, `bigint`, `boolean`, `undefined`, `symbol`, and `null`. Everything else is an `object`.

5. What does `typeof null` return, and why is it notable?

   It returns `"object"`. This is a long-standing bug in JavaScript kept for backward compatibility; `null` is actually a primitive.

6. What is the difference between `==` and `===`?

   `==` (loose equality) performs type coercion before comparing, while `===` (strict equality) compares both value and type with no coercion. Prefer `===` to avoid surprises.

7. What do the following coerce to as booleans (falsy values)?

   The eight falsy values are: `false`, `0`, `-0`, `0n`, `""` (empty string), `null`, `undefined`, and `NaN`. Everything else is truthy.

8. What is the result of `"5" + 3` versus `"5" - 3` in JavaScript?

   `"5" + 3` yields `"53"` (string concatenation, because `+` favors strings), while `"5" - 3` yields `2` (the `-` operator coerces the string to a number).

9. What is the difference between `null` and `undefined`?

   `undefined` means a variable has been declared but not assigned a value; `null` is an explicit assignment representing 'no value'. `null == undefined` is `true`, but `null === undefined` is `false`.

10. What does the nullish coalescing operator `??` do, and how does it differ from `||`?

    `a ?? b` returns `b` only when `a` is `null` or `undefined`. `a || b` returns `b` for any falsy `a` (including `0` and `""`), making `??` safer for defaults.

11. What is the difference between the equality operators used and the ternary operator's syntax?

    The ternary (conditional) operator has the form $condition\ ?\ exprIfTrue\ :\ exprIfFalse$. It is the only JavaScript operator taking three operands.

12. How does short-circuit evaluation work with `&&` and `||`?

    `&&` returns the first falsy operand (or the last if all truthy); `||` returns the first truthy operand (or the last if all falsy). Evaluation stops as soon as the result is determined.

13. What is the difference between a `for...of` loop and a `for...in` loop?

    `for...of` iterates over the values of an iterable (arrays, strings, Maps, Sets). `for...in` iterates over the enumerable property keys (names) of an object, including inherited ones.

14. What does the `break` statement do versus `continue` in a loop?

    `break` immediately terminates the entire loop; `continue` skips the rest of the current iteration and proceeds to the next one.

15. What is the difference between a function declaration and a function expression regarding hoisting?

    Function declarations are fully hoisted, so they can be called before they appear in code. Function expressions (assigned to a variable) are not; only the variable is hoisted.

16. How do arrow functions differ from regular functions in handling `this`?

    Arrow functions do not have their own `this`; they lexically inherit `this` from the enclosing scope. Regular functions bind `this` based on how they are called.

17. Do arrow functions have their own `arguments` object?

    No. Arrow functions lack their own `arguments` object; referencing `arguments` inside one refers to the enclosing function's `arguments` (or throws if none). Use rest parameters `(...args)` instead.

18. What is a default parameter, and when is its value applied?

    A default parameter provides a fallback value used only when the argument is `undefined` (or omitted). Example: `function f(x = 10) {}` gives `x` the value `10` when called as `f()` or `f(undefined)`.

19. Which array methods mutate the original array versus return a new one?

    Mutating: `push`, `pop`, `shift`, `unshift`, `splice`, `sort`, `reverse`. Non-mutating (return new/copy): `map`, `filter`, `slice`, `concat`, `reduce`.

20. What does `Array.prototype.map()` do?

    It creates a new array of the same length by applying a callback to each element and collecting the returned values. It does not mutate the original array.

See more JavaScript Programming flashcards →

Planning JavaScript Programming for Frontend Web Development

JavaScript Programming (Frontend Web Development) FAQ