freeCodeCamp JavaScript Algorithms and Data Structures Flashcards

24 sample cards from the JavaScript Algorithms and Data Structures deck

Sampled from the end of the deck, so these are different cards from the ones shown on the syllabus page.

1. What does the spread operator (...) do with arrays and objects?

   It expands an iterable or object's own enumerable properties in place: [...arr1, ...arr2] concatenates/copies arrays, {...obj, x: 1} makes a shallow copy with overrides, and fn(...args) spreads an array into individual arguments. Copies are shallow — nested objects are still shared references.

2. How do you check whether a property exists on an object in JavaScript (three ways)?

   1) 'key' in obj — true for own and inherited properties. 2) obj.hasOwnProperty('key') (or Object.hasOwn(obj, 'key')) — own properties only. 3) obj.key !== undefined — simplest but fails if the property's value is literally undefined.

3. What are the average time complexities of lookup by key in an object/Map versus searching for a value in an array?

   Object or Map lookup by key is $O(1)$ on average (hash-based). Searching an unsorted array for a value (indexOf, includes, find) is $O(n)$ linear scan. This is why lookup tables (objects/Maps/Sets) are used to optimize repeated membership checks.

4. When should you use a Map or Set instead of a plain object or array?

   Map: when keys can be any type (not just strings/symbols), insertion order matters, or you need size directly. Set: to store unique values with $O(1)$ average add/has/delete — e.g., dedupe an array via [...new Set(arr)]. Plain objects suit simple string-keyed records; arrays suit ordered lists.

5. What is a constructor function in JavaScript, and what does the new operator do?

   A constructor is a regular function (conventionally capitalized, e.g., function Dog(name) { this.name = name; }) meant to be called with new. new: (1) creates an empty object, (2) sets its prototype to Constructor.prototype, (3) runs the constructor with this bound to the new object, (4) returns the object (unless the constructor explicitly returns another object).

6. What is the prototype chain and how does property lookup use it?

   Every object has an internal link to a prototype object. When a property is accessed and not found on the object itself, JavaScript searches its prototype, then the prototype's prototype, and so on until found or the chain ends at null. This is how inheritance and shared methods work.

7. Why are methods usually defined on Constructor.prototype instead of inside the constructor body?

   A method assigned inside the constructor (this.bark = function(){}) is duplicated on every instance, wasting memory. Defining it once on Constructor.prototype means all instances share a single function via the prototype chain.

8. In an ES6 class, what are the roles of the constructor method and the super keyword?

   constructor is the special method run when the class is instantiated with new; it initializes instance properties. In a subclass (class B extends A), super(args) calls the parent constructor and must run before using this; super.method() invokes a parent method.

9. What are getters and setters in a JavaScript class?

   Accessor properties defined with get and set keywords. A getter runs when the property is read (const t = obj.temp) and a setter when it is assigned (obj.temp = 30), letting you compute values, validate input, or expose private fields while using plain property syntax.

10. What is the difference between static members and instance members in a JavaScript class?

    Instance members (methods/fields) live on each object or its prototype and are accessed via the instance. static members belong to the class itself and are called on the class, e.g., Math-style utilities: ClassName.helper(). Static methods cannot access instance data through this.

11. What are the four rules that determine the value of this in a regular function?

    1) new binding: this is the newly created object. 2) Explicit binding: call/apply/bind set this to the given object. 3) Implicit binding: called as obj.method(), this is obj. 4) Default: standalone call — this is the global object (or undefined in strict mode). Precedence is in that order; arrow functions ignore all four and use lexical this.

12. What is the difference between call, apply, and bind?

    All three set a function's this explicitly. fn.call(thisArg, a, b) invokes immediately with arguments listed individually. fn.apply(thisArg, [a, b]) invokes immediately with arguments as an array. fn.bind(thisArg, a) does not invoke; it returns a new function with this (and optionally leading arguments) permanently fixed.

13. Why does a callback like setTimeout(obj.method, 1000) lose its this, and how do you fix it?

    Passing obj.method detaches the function from obj, so when the timer calls it, this falls back to the global object/undefined. Fixes: setTimeout(obj.method.bind(obj), 1000) or wrap it: setTimeout(() => obj.method(), 1000).

14. What two conditions make a function "pure"?

    1) Deterministic: it always returns the same output for the same inputs. 2) No side effects: it does not mutate external state, its arguments, or perform I/O. Pure functions are easier to test, memoize, and reason about.

15. What is immutability in functional JavaScript, and how do you update an array or object without mutating it?

    Immutability means never changing existing data; instead you create modified copies. Arrays: use map/filter/slice/concat or spread ([...arr, item]) instead of push/splice. Objects: {...obj, key: newValue} instead of assignment. Object.freeze(obj) makes an object's own properties shallowly read-only.

16. Why is Array.prototype.sort a problem for immutability, and what are the fixes?

    sort mutates (reorders) the original array in place. Fixes: sort a copy — [...arr].sort(compareFn) or arr.slice().sort(compareFn) — or use the non-mutating ES2023 method arr.toSorted(compareFn).

17. What is a higher-order function? Give two examples built into JavaScript.

    A function that takes one or more functions as arguments and/or returns a function. Built-in examples: Array.prototype.map and Array.prototype.filter (take callbacks); Function.prototype.bind (returns a new function). User-defined examples include debounce and memoize.

18. What is a callback function?

    A function passed as an argument to another function, to be invoked by that function at the appropriate time — e.g., the comparator in arr.sort((a, b) => a - b), event handlers, or the callback in setTimeout. Callbacks are the foundation of higher-order functions and async patterns.

19. What is currying? Show the curried form of add(a, b, c).

    Currying transforms a function of multiple arguments into a chain of functions each taking one argument: const add = a => b => c => a + b + c; called as add(1)(2)(3) → 6. It enables partial application, e.g., const add5 = add(5).

20. What is function composition, and how do compose and pipe differ?

    Composition combines functions so the output of one feeds the next: $(f \circ g)(x) = f(g(x))$. compose applies right-to-left: compose(f, g)(x) = f(g(x)); pipe applies left-to-right: pipe(f, g)(x) = g(f(x)). Implementation: const pipe = (...fns) => x => fns.reduce((v, fn) => fn(v), x).

21. What is Big O notation, and what do $O(1)$, $O(\log n)$, $O(n)$, $O(n \log n)$, and $O(n^{2})$ describe? Rank them from fastest to slowest growth.

    Big O describes an algorithm's worst-case growth rate as input size $n$ grows, ignoring constants and lower-order terms. Fastest to slowest: $O(1)$ constant (array index/hash lookup) $<$ $O(\log n)$ logarithmic (binary search) $<$ $O(n)$ linear (single scan) $<$ $O(n \log n)$ (efficient sorts) $<$ $O(n^{2})$ quadratic (nested loops, bubble sort).

22. Describe the divide-and-conquer strategy and the recursion base case. What happens without a base case?

    Divide and conquer splits a problem into smaller subproblems, solves them (often recursively), and combines the results — e.g., merge sort, binary search. Every recursive function needs a base case, a condition that returns without recursing (e.g., factorial: if (n <= 1) return 1). Without one, recursion never terminates and throws a stack overflow (RangeError: Maximum call stack size exceeded).

23. How does binary search work, what does it require, and what is its time complexity?

    It requires a sorted array. Repeatedly compare the target to the middle element $m = \left\lfloor \frac{low + high}{2} \right\rfloor$: if equal, done; if the target is smaller, search the left half; if larger, the right half — halving the search space each step. Time complexity is $O(\log n)$, versus $O(n)$ for linear search on unsorted data.

24. Compare bubble sort, merge sort, and quicksort by time complexity and stability.

    Bubble sort: repeatedly swaps adjacent out-of-order pairs; $O(n^{2})$ average and worst, stable, simple but slow. Merge sort: divide and conquer with merging; $O(n \log n)$ in all cases, stable, but needs $O(n)$ extra space. Quicksort: partition around a pivot; $O(n \log n)$ average but $O(n^{2})$ worst case (bad pivots), in-place and typically fastest in practice, not stable.

What this deck covers

JavaScript Algorithms and Data Structures flashcards FAQ