Javascript Programming Syllabus

What is the difference between a while loop and a do...while loop?

A `while` loop checks its condition before each iteration, so the body may run zero times. A `do...while` loop checks the condition after the body, guaranteeing the body executes at least once.

What do the break and continue statements do inside loops?

`break` immediately terminates the entire loop (or switch). `continue` skips the rest of the current iteration and proceeds to the next iteration of the loop.

What is the difference between a function declaration and a function expression?

A function declaration (`function foo(){}`) is fully hoisted and can be called before its definition. A function expression (`const foo = function(){}`) is only available after the assignment line executes because only the variable is hoisted.

How do arrow functions differ from regular functions regarding `this`?

Arrow functions do not have their own `this`; they lexically inherit `this` from the enclosing scope. They also lack their own `arguments` object and cannot be used as constructors (no `new`).

What are default parameters and rest parameters in JavaScript functions?

Default parameters provide a fallback value when an argument is omitted or undefined, e.g. `function f(a = 10){}`. Rest parameters (`...args`) collect all remaining arguments into a single array.

What is a closure in JavaScript?

A closure is a function that retains access to variables from its lexical (enclosing) scope even after that outer function has finished executing. Closures are the basis for data privacy and stateful functions in JavaScript.

What is a callback function?

A callback is a function passed as an argument to another function, to be invoked later—either synchronously (e.g. `Array.map`) or asynchronously (e.g. after an I/O event completes).

What is variable and function hoisting?

Hoisting is JavaScript's behavior of moving declarations to the top of their scope during compilation. Function declarations and `var` variables are hoisted (var initialized to `undefined`), while `let`/`const` are hoisted but remain uninitialized in the temporal dead zone.

What is the Temporal Dead Zone (TDZ)?

The TDZ is the period between entering a scope and the actual declaration of a `let` or `const` variable. Accessing the variable during this window throws a ReferenceError, even though the variable is technically hoisted.

What is the difference between lexical (static) scope and dynamic scope, and which does JavaScript use?

Lexical scope determines variable access based on where functions are physically written in the source code. Dynamic scope would resolve based on the call stack at runtime. JavaScript uses lexical scope.

What are the different ways `this` is bound in JavaScript?

`this` depends on call site: in a method call it is the owning object; in a plain function call it is the global object (or undefined in strict mode); with `new` it is the new instance; with `call`/`apply`/`bind` it is explicitly set; in arrow functions it is lexically inherited.

What is the difference between accessing object properties with dot notation versus bracket notation?

Dot notation (`obj.key`) requires a valid, static identifier name. Bracket notation (`obj['key']`) accepts any string or computed expression, allowing dynamic keys, keys with special characters, or variables holding the key name.

How do you clone/copy an object shallowly in modern JavaScript?

Use the spread operator `{...obj}` or `Object.assign({}, obj)`. Both create a shallow copy, meaning nested objects are still shared by reference. For a deep copy use `structuredClone(obj)`.

What is the difference between Object.freeze() and Object.seal()?

`Object.freeze()` makes an object fully immutable—no adding, deleting, or modifying properties. `Object.seal()` prevents adding or deleting properties but still allows modifying existing property values.

Name four commonly used array mutator methods and four non-mutating methods.

Mutators (change the original): `push`, `pop`, `shift`, `unshift`, `splice`, `sort`, `reverse`. Non-mutating (return new): `map`, `filter`, `slice`, `concat`, `reduce`.

What does Array.prototype.reduce() do?

`reduce` iterates over an array, accumulating a single result value. It takes a reducer callback `(accumulator, current) => ...` and an optional initial value, e.g. summing: `arr.reduce((a, c) => a + c, 0)`.

What is the difference between synchronous and asynchronous code?

Synchronous code executes line-by-line, blocking further execution until each operation finishes. Asynchronous code allows long-running operations (I/O, timers, network) to proceed in the background, with results handled later via callbacks, promises, or async/await.

What is a Promise and what are its three states?

A Promise is an object representing the eventual completion or failure of an asynchronous operation. Its three states are: pending (initial), fulfilled (resolved with a value), and rejected (failed with a reason). State transitions are one-way and final.

How do async/await keywords work?

`async` marks a function that always returns a promise. `await` pauses execution inside an async function until a promise settles, returning its resolved value (or throwing on rejection), letting asynchronous code read like synchronous code.

What is the difference between Promise.all() and Promise.race()?

`Promise.all()` waits for all promises to fulfill and returns an array of results, rejecting immediately if any one rejects. `Promise.race()` settles as soon as the first promise settles (fulfills or rejects), returning that single result.

How do you catch errors when using async/await?

Wrap the awaited call in a `try...catch` block: the `catch` clause handles any rejected promise. Alternatively, chain `.catch()` on the returned promise of the async function.

What is the difference between throw and a try...catch...finally block?

`throw` raises an exception, unwinding the stack until caught. `try` contains code that may throw, `catch` handles the thrown error, and `finally` runs regardless of whether an error occurred—useful for cleanup.

Name three built-in JavaScript error types.

Common built-in errors include `TypeError` (wrong type/operation), `ReferenceError` (accessing an undeclared variable), `SyntaxError` (invalid code), `RangeError` (value out of range), and `URIError`. All inherit from `Error`.

What is the JavaScript event loop, and what are the call stack, task queue, and microtask queue?

The event loop continuously moves queued callbacks onto the empty call stack. The call stack tracks running functions; the macrotask queue holds callbacks like `setTimeout`; the microtask queue holds promise callbacks. Microtasks are drained completely before the next macrotask.

Why does a Promise .then() callback run before a setTimeout(fn, 0) callback scheduled earlier?

Promise callbacks are microtasks, while `setTimeout` callbacks are macrotasks. After each macrotask, the event loop empties the entire microtask queue before picking up the next macrotask, so microtasks always have priority.

What is the difference between CommonJS and ES Modules (ESM)?

CommonJS (Node.js) uses `require()` and `module.exports`, loads synchronously, and is dynamic. ES Modules use `import`/`export`, are statically analyzable, support asynchronous loading and tree-shaking, and are the standard for browsers and modern Node.

What is the difference between a named export and a default export in ES Modules?

A module can have many named exports, imported by their exact names in braces: `import { a, b } from './m'`. It can have only one default export, imported with any chosen name without braces: `import anything from './m'`.

What is prototypal inheritance in JavaScript?

Objects inherit properties and methods from other objects via an internal prototype link (`[[Prototype]]`, accessed by `__proto__` or `Object.getPrototypeOf`). Property lookups traverse this prototype chain until found or reaching `null`.

What does the `new` keyword do when creating an object from a constructor function or class?

`new` (1) creates a fresh empty object, (2) links its prototype to the constructor's `.prototype`, (3) binds `this` to the new object and runs the constructor, and (4) returns the object automatically unless the constructor returns another object.

What is the DOM (Document Object Model)?

The DOM is a tree-structured, in-memory, language-neutral representation of an HTML/XML document. Each node is an object that scripts can access and manipulate to change document structure, content, and styling dynamically.

What is the difference between event capturing, targeting, and bubbling in DOM event propagation, and what does event delegation exploit?

An event travels down from the root to the target (capturing phase), reaches the target, then travels back up (bubbling phase). Event delegation exploits bubbling by attaching one listener to a common ancestor to handle events from many child elements. `stopPropagation()` halts this flow.