DEV Community

Amit Kumar
Amit Kumar

Posted on

React Native Interview Handbook — Part 5 of 10: Senior & System Design

This guide is part of a 719-question React Native interview handbook collected from real interviews across startups, product companies, fintech, e-commerce, and MNCs. Questions range from beginner to senior (5+ years) and cover JavaScript, React Native, New Architecture, performance, security, native modules, iOS, Android, system design, and behavioral interviews.

This article contains 159 questions (global questions 561–719). Answer each question before reading the response, explain assumptions and complexity for coding questions, and adapt behavioral examples to your truthful experience.

Difficulty guide

  • 🟢 Beginner — expected for entry-level and junior React Native roles.
  • 🟡 Intermediate — expected for engineers who can independently ship features.
  • 🔴 Senior — tests architecture, trade-offs, production ownership, and native-platform knowledge.

Topics in this part

  • Coding Problems — questions 48–75
  • Output-Based JavaScript Questions — 111 questions
  • Scenario-Based Questions — 13 questions
  • HR & Behavioral Questions — 7 questions

Complete series

This Dev.to series has five core handbook articles plus five focused practice extras. Open the series page to move through the complete reading order:

  1. Part 1: JavaScript — core handbook, questions 1–120
  2. Part 2: React — core handbook, questions 121–220
  3. Part 3: React Native — core handbook, questions 221–420
  4. Part 4: Performance & Architecture — core handbook, questions 421–560
  5. Part 5: Senior & System Design — core handbook, questions 561–719
  6. Part 6: Output-Based JavaScript Practice — bonus practice article
  7. Part 7: Coding Interview Practice — bonus practice article
  8. Part 8: Code Output Challenges — bonus practice article
  9. Part 9: Current React Native Interview Questions — new high-frequency practice article
  10. Part 10: Project & Production Interviews — senior project ownership and real-production practice

Series navigation

Use the Complete React Native Interview Handbook 2026 series page on Dev.to to open every part in order.

Continuation note

This part continues Coding Problems from Part 4, then completes the handbook with output-based, scenario-based, and behavioral questions.

Question bank

48. How do you run-length compress a string?

Answer
Answer: Scan each run of equal characters, append the character and run length, then continue from the next run.

Code example:

function compress(s) {
  let out = '',
    i = 0;
  while (i < s.length) {
    let j = i;
    while (j < s.length && s[j] === s[i]) j++;
    out += s[i] + (j - i);
    i = j;
  }
  return out;
}
Enter fullscreen mode Exit fullscreen mode

49. Implement debounce (Medium)?

Answer
Answer: Expected result: Only the latest call runs after calls stop for delay milliseconds.
Explanation: I preserve this and arguments, and expose cancel for component cleanup. In React Native search, I keep the debounced function reference stable and cancel it on unmount.

Code example:

function debounce(fn, delay) {
  let timer;
  function debounced(...args) {
    clearTimeout(timer);
    timer = setTimeout(() => fn.apply(this, args), delay);
  }
  debounced.cancel = () => clearTimeout(timer);
  return debounced;
}
Enter fullscreen mode Exit fullscreen mode

50. Implement debounce and throttle?

Answer
Answer: Debounce clears the previous timer and schedules a new one, so only the final call after quiet time executes. Throttle tracks last execution or a pending timer so calls occur at most once per interval. I preserve this and arguments, expose cancel when useful, and clean it on component unmount.

Code example:

const debounce = (fn, delay) => {
  let timer;
  return (...args) => {
    clearTimeout(timer);
    timer = setTimeout(() => fn(...args), delay);
  };
};

const throttle = (fn, delay) => {
  let ready = true;
  return (...args) => {
    if (!ready) return;
    ready = false;
    fn(...args);
    setTimeout(() => {
      ready = true;
    }, delay);
  };
};
Enter fullscreen mode Exit fullscreen mode

51. Implement debounce?

Answer
Answer: Return a wrapper that clears the previous timer and schedules the latest call after the delay while preserving this and arguments. A production implementation should define leading and trailing execution and expose cancel and flush behavior.

Code example:

function debounce(fn, delay) {
  let timer;
  return function (...args) {
    clearTimeout(timer);
    timer = setTimeout(() => fn.apply(this, args), delay);
  };
}
Enter fullscreen mode Exit fullscreen mode

52. Implement throttle (Medium)?

Answer
Answer: Expected result: At most one call runs per delay window.
Explanation: This is a leading-only throttle. I explicitly ask whether trailing calls, cancel, flush or maxWait are required because those change the implementation.

Code example:

function throttle(fn, delay) {
  let waiting = false;
  return function (...args) {
    if (waiting) return;
    waiting = true;
    fn.apply(this, args);
    setTimeout(() => {
      waiting = false;
    }, delay);
  };
}
Enter fullscreen mode Exit fullscreen mode

53. Implement throttle?

Answer
Answer: Return a wrapper that runs at most once per interval while preserving this and arguments. Track the last execution and optionally schedule the latest trailing call; define leading, trailing, cancel, and flush semantics before coding.

Code example:

function throttle(fn, delay) {
  let ready = true;
  return function (...args) {
    if (!ready) return;
    ready = false;
    fn.apply(this, args);
    setTimeout(() => {
      ready = true;
    }, delay);
  };
}
Enter fullscreen mode Exit fullscreen mode

54. Implement useDebounce and explain when to use it?

Answer
Answer: useDebounce returns a value only after it has stopped changing for a delay. I use it for search input and validation to avoid one API call per keystroke. Cleanup clears the previous timeout; that reset behavior is the key difference from throttle.

Code example:

function useDebounce(value, delay = 300) {
  const [debounced, setDebounced] = useState(value);
  useEffect(() => {
    const id = setTimeout(() => setDebounced(value), delay);
    return () => clearTimeout(id);
  }, [value, delay]);
  return debounced;
}
Enter fullscreen mode Exit fullscreen mode

55. Reverse a string (Easy)?

Answer
Answer: evitaN tcaeR
I use Array.from instead of split('') because it handles Unicode code points such as many emoji better. A follow-up can ask for an in-place array reversal.

Code example:

function reverseString(value) {
  return Array.from(value).reverse().join('');
}
console.log(reverseString('React Native'));
Enter fullscreen mode Exit fullscreen mode

56. Run async tasks with a concurrency limit (Hard)?

Answer
Answer: Runs no more than limit tasks simultaneously and preserves result order.
I accept task functions rather than already-started Promises so concurrency can actually be controlled. I ask whether one rejection should fail fast or whether all results should be collected.

Code example:

async function runLimited(tasks, limit) {
  if (limit < 1) throw new RangeError('limit must be positive');
  const results = new Array(tasks.length);
  let next = 0;
  async function worker() {
    while (true) {
      const index = next++;
      if (index >= tasks.length) return;
      results[index] = await tasks[index]();
    }
  }
  const workers = Array.from(
    { length: Math.min(limit, tasks.length) },
    worker,
  );
  await Promise.all(workers);
  return results;
}
Enter fullscreen mode Exit fullscreen mode

57. Safely access a nested property by path (Easy/Medium)?

Answer
Answer: Returns the city or Unknown without throwing.
For a fixed known path I prefer optional chaining. A helper is useful for dynamic paths, but production parsing needs clear rules for escaping and unsafe keys.

Code example:

function get(object, path, fallback) {
  const keys = Array.isArray(path)
    ? path
    : path
        .replace(/\[(\w+)\]/g, '.$1')
        .split('.')
        .filter(Boolean);
  let current = object;
  for (const key of keys) {
    if (current == null) return fallback;
    current = current[key];
  }
  return current === undefined ? fallback : current;
}
get(user, 'profile.address.city', 'Unknown');
Enter fullscreen mode Exit fullscreen mode

58. Two Sum?

Answer
Answer: I scan once with a Map from value to index. For each number I check whether target minus that number was already seen; if yes I return both indices. This is O(n) time and O(n) space, better than the O(n squared) nested-loop solution.

Code example:

function twoSum(nums, target) {
  const seen = new Map();
  for (let i = 0; i < nums.length; i++) {
    const need = target - nums[i];
    if (seen.has(need)) return [seen.get(need), i];
    seen.set(nums[i], i);
  }
  return [];
}
Enter fullscreen mode Exit fullscreen mode

59. What is the difference between debounce and throttle?

Answer
Answer: Debounce waits until calls stop for a quiet period; throttle limits execution to at most once per interval. Debounce fits search input, while throttle fits continuous scroll updates.

Code example:

const debouncedSearch = debounce(search, 300);
const throttledScroll = throttle(onScroll, 300);
Enter fullscreen mode Exit fullscreen mode

60. Why is JSON.parse(JSON.stringify(value)) not a general deep clone?

Answer
Answer: It loses undefined and functions, converts Date to string, Map/Set to empty objects, NaN/Infinity to null, throws on BigInt and cycles, and does not preserve prototypes. Prefer structuredClone or a type-aware clone.

Code example:

const source = { missing: undefined, createdAt: new Date() };
const clone = JSON.parse(JSON.stringify(source));
console.log(clone); // createdAt is a string; missing is removed
Enter fullscreen mode Exit fullscreen mode

🔴 Senior

61. How do you expose battery level through a native module?

Answer
Answer: Define a narrow asynchronous typed method, read BatteryManager or the iOS equivalent on the correct queue, resolve a Promise, and expose the generated module contract.

Code example:

const level = await NativeModules.Battery.getLevel();
console.log(`Battery level: ${level}%`);
Enter fullscreen mode Exit fullscreen mode

62. How do you implement Array.prototype.filter?

Answer
Answer: Iterate existing indices, call the predicate with the standard arguments and optional thisArg, and push values whose predicate is truthy.

Code example:

Array.prototype.myFilter = function (cb, thisArg) {
  const out = [];
  for (let i = 0; i < this.length; i++)
    if (i in this && cb.call(thisArg, this[i], i, this))
      out.push(this[i]);
  return out;
};
Enter fullscreen mode Exit fullscreen mode

63. How do you implement Array.prototype.map?

Answer
Answer: Iterate existing indices, call the callback with value, index, and source using the optional thisArg, preserve holes, and return a new array.

Code example:

Array.prototype.myMap = function (cb, thisArg) {
  const out = [];
  for (let i = 0; i < this.length; i++)
    if (i in this) out[i] = cb.call(thisArg, this[i], i, this);
  return out;
};
Enter fullscreen mode Exit fullscreen mode

64. How do you implement Array.prototype.reduce?

Answer
Answer: Use the supplied initial value when present; otherwise find the first existing element or throw for an empty array. Fold remaining existing indices with accumulator, value, index, and source.

Code example:

Array.prototype.myReduce = function (cb, init) {
  let i = 0,
    acc;
  if (arguments.length > 1) acc = init;
  else {
    while (i < this.length && !(i in this)) i++;
    if (i >= this.length) throw TypeError();
    acc = this[i++];
  }
  for (; i < this.length; i++)
    if (i in this) acc = cb(acc, this[i], i, this);
  return acc;
};
Enter fullscreen mode Exit fullscreen mode

65. How do you implement Function.prototype.bind?

Answer
Answer: Capture the target, thisArg, and preset arguments and return a function that applies the target with combined arguments. A production polyfill must also preserve new-constructor behavior.

Code example:

Function.prototype.myBind = function (ctx, ...pre) {
  const fn = this;
  return function (...args) {
    return fn.apply(ctx, [...pre, ...args]);
  };
};
Enter fullscreen mode Exit fullscreen mode

66. How do you implement Promise.all?

Answer
Answer: Normalize each input with Promise.resolve, preserve index order, count fulfillments, resolve when all complete, and reject on the first rejection. Resolve an empty iterable immediately.

Code example:

function promiseAll(ps) {
  return new Promise((resolve, reject) => {
    const a = Array.from(ps),
      r = [];
    if (!a.length) return resolve([]);
    let n = 0;
    a.forEach((p, i) =>
      Promise.resolve(p).then((v) => {
        r[i] = v;
        if (++n === a.length) resolve(r);
      }, reject),
    );
  });
}
Enter fullscreen mode Exit fullscreen mode

67. How do you implement Pub/Sub?

Answer
Answer: Maintain subscriber sets by topic; subscribe adds and returns an unsubscribe function, while publish calls a snapshot of current subscribers.

Code example:

function bus() {
  const m = new Map();
  return {
    subscribe(t, f) {
      const s = m.get(t) || new Set();
      s.add(f);
      m.set(t, s);
      return () => s.delete(f);
    },
    publish(t, v) {
      [...(m.get(t) || [])].forEach((f) => f(v));
    },
  };
}
Enter fullscreen mode Exit fullscreen mode

68. How do you implement a cycle-safe deepClone?

Answer
Answer: Return primitives directly, copy special types, register each source object in a WeakMap before recursing, and clone all own keys so cycles reuse the prior copy.

Code example:

function deepClone(v, m = new WeakMap()) {
  if (v === null || typeof v !== 'object') return v;
  if (m.has(v)) return m.get(v);
  if (v instanceof Date) return new Date(v);
  const out = Array.isArray(v) ? [] : {};
  m.set(v, out);
  for (const k of Reflect.ownKeys(v)) out[k] = deepClone(v[k], m);
  return out;
}
Enter fullscreen mode Exit fullscreen mode

69. How do you implement an EventEmitter?

Answer
Answer: Store listeners by event, let on add and off remove callbacks, emit over a snapshot, and implement once with a wrapper that unsubscribes before invoking.

Code example:

class EventEmitter {
  constructor() {
    this.m = Object.create(null);
  }
  on(e, f) {
    (this.m[e] ??= []).push(f);
    return this;
  }
  off(e, f) {
    this.m[e] = (this.m[e] || []).filter((x) => x !== f);
  }
  emit(e, ...a) {
    (this.m[e] || []).slice().forEach((f) => f(...a));
  }
  once(e, f) {
    const w = (...a) => {
      this.off(e, w);
      f(...a);
    };
    return this.on(e, w);
  }
}
Enter fullscreen mode Exit fullscreen mode

70. How do you implement an LRU cache?

Answer
Answer: Use insertion order in a Map: on get, delete and reinsert the key as most recent; on set, refresh the key and evict the first key when over capacity.

Code example:

class LRU {
  constructor(n = 10) {
    this.n = n;
    this.m = new Map();
  }
  get(k) {
    if (!this.m.has(k)) return;
    const v = this.m.get(k);
    this.m.delete(k);
    this.m.set(k, v);
    return v;
  }
  set(k, v) {
    this.m.delete(k);
    this.m.set(k, v);
    if (this.m.size > this.n)
      this.m.delete(this.m.keys().next().value);
  }
}
Enter fullscreen mode Exit fullscreen mode

71. How do you implement inheritance without class syntax?

Answer
Answer: Call the parent constructor for own fields, set the child prototype to Object.create(parent.prototype), and restore child.prototype.constructor.

Code example:

function Animal(n) {
  this.name = n;
}
Animal.prototype.speak = function () {
  return this.name;
};
function Dog(n) {
  Animal.call(this, n);
}
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;
Enter fullscreen mode Exit fullscreen mode

72. How do you implement offline retry?

Answer
Answer: Retry eligible transient network failures with bounded exponential backoff and jitter, then persist a replay-safe mutation in an outbox for reconnect.

Code example:

async function retry(request, attempts = 3, baseDelay = 200) {
  try {
    return await request();
  } catch (error) {
    if (attempts <= 1) throw error;
    const delay = baseDelay * 2 ** (3 - attempts);
    await new Promise((resolve) => setTimeout(resolve, delay));
    return retry(request, attempts - 1, baseDelay);
  }
}
Enter fullscreen mode Exit fullscreen mode

73. How do you limit concurrent asynchronous operations?

Answer
Answer: Start a fixed number of worker loops that claim the next index and await its work. Await all workers and store results by original index.

Code example:

async function mapPool(items, limit, worker) {
  const out = [],
    workers = [];
  let i = 0;
  async function run() {
    while (i < items.length) {
      const n = i++;
      out[n] = await worker(items[n], n);
    }
  }
  for (let n = 0; n < Math.min(limit, items.length); n++)
    workers.push(run());
  await Promise.all(workers);
  return out;
}
Enter fullscreen mode Exit fullscreen mode

74. How do you retry a failed Promise with exponential backoff?

Answer
Answer: Loop through a bounded number of attempts, return on success, and after each retryable failure await an exponentially increasing delay before rethrowing the final error.

Code example:

async function retry(fn, n = 3, d = 300) {
  let e;
  for (let i = 0; i < n; i++) {
    try {
      return await fn();
    } catch (x) {
      e = x;
      await new Promise((r) => setTimeout(r, d * 2 ** i));
    }
  }
  throw e;
}
Enter fullscreen mode Exit fullscreen mode

75. LRU cache design?

Answer
Answer: An LRU cache evicts the least recently used item when capacity is exceeded. In JavaScript, Map preserves insertion order, so get deletes and reinserts a key to mark it recent; set removes the oldest map key when over capacity. A production cache also defines TTL, memory limits, and whether undefined is a valid value.

Code example:

class LRUCache {
  constructor(capacity) {
    this.capacity = capacity;
    this.cache = new Map();
  }

  get(key) {
    if (!this.cache.has(key)) return undefined;
    const value = this.cache.get(key);
    this.cache.delete(key);
    this.cache.set(key, value);
    return value;
  }

  set(key, value) {
    this.cache.delete(key);
    this.cache.set(key, value);
    if (this.cache.size > this.capacity) {
      this.cache.delete(this.cache.keys().next().value);
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Output-Based JavaScript Questions

111 reviewed questions.

🟡 Intermediate

1. Array equality compares references?

Answer
Answer: Exact output: false, then true
Why: Each array literal creates a distinct object; b points to the same object as a.

Code example:

console.log([] === []);
const a = [];
const b = a;
console.log(a === b);
Enter fullscreen mode Exit fullscreen mode

2. Arrow function and arguments?

Answer
Answer: Exact output: outer
Why: Arrow functions do not create their own arguments object; they capture the surrounding one.

Code example:

function outer() {
  const arrow = () => console.log(arguments[0]);
  arrow('inner');
}
outer('outer');
Enter fullscreen mode Exit fullscreen mode

3. Async function return value?

Answer
Answer: Exact output: true, then 42
Why: An async function always returns a Promise fulfilled with its returned value.

Code example:

async function getValue() {
  return 42;
}
console.log(getValue() instanceof Promise);
getValue().then(console.log);
Enter fullscreen mode Exit fullscreen mode

4. Basic var hoisting?

Answer
Answer: Exact output: undefined, then 10
Why: The declaration is hoisted and initialized with undefined; the assignment stays in place.

Code example:

console.log(a);
var a = 10;
console.log(a);
Enter fullscreen mode Exit fullscreen mode

5. Boolean arithmetic?

Answer
Answer: Exact output: 2, 1, 0
Why: Numeric conversion maps true to 1 and false to 0.

Code example:

console.log(true + true);
console.log(true + false);
console.log(Number(false));
Enter fullscreen mode Exit fullscreen mode

6. Chained map and filter order?

Answer
Answer: Exact output: [6, 8]
Why: map first creates [2, 4, 6, 8], then filter keeps values above 4.

Code example:

const result = [1, 2, 3, 4]
  .map((value) => value * 2)
  .filter((value) => value > 4);
console.log(result);
Enter fullscreen mode Exit fullscreen mode

7. Changing key resets state?

Answer
Answer: Exact output: A changed userId resets Profile's local state
Why: Changing the key makes React treat it as a different component instance.

Code example:

<Profile key={userId} userId={userId} />;
Enter fullscreen mode Exit fullscreen mode

8. Class Temporal Dead Zone?

Answer
Answer: Exact output: ReferenceError
Why: Class declarations are not usable before their declaration is evaluated.

Code example:

const user = new User();
class User {}
Enter fullscreen mode Exit fullscreen mode

9. Closure counter?

Answer
Answer: Exact output: 1, 2
Why: The returned function retains access to its lexical environment.

Code example:

function counter() {
  let count = 0;
  return () => ++count;
}
const next = counter();
console.log(next());
console.log(next());
Enter fullscreen mode Exit fullscreen mode

10. Closure with let in a loop?

Answer
Answer: Exact output: 0, 1, 2
Why: let creates a new binding for every iteration.

Code example:

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}
Enter fullscreen mode Exit fullscreen mode

11. Closure with var in a loop?

Answer
Answer: Exact output: 3, 3, 3
Why: All callbacks close over the same function-scoped variable.

Code example:

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}
Enter fullscreen mode Exit fullscreen mode

12. Default parameter scope?

Answer
Answer: Exact output: ReferenceError
Why: The parameter's own uninitialized binding shadows the outer value in the default-expression scope.

Code example:

let value = 5;
function show(value = value) {
  return value;
}
show();
Enter fullscreen mode Exit fullscreen mode

13. Default sort is lexicographic?

Answer
Answer: Exact output: [1, 10, 2]
Why: Without a comparator, sort compares string representations.

Code example:

const values = [10, 2, 1];
values.sort();
console.log(values);
Enter fullscreen mode Exit fullscreen mode

14. Destructuring defaults and holes?

Answer
Answer: Exact output: 10, null, 30
Why: Defaults apply to undefined or a missing element, but not to null.

Code example:

const [a = 10, b = 20, c = 30] = [undefined, null];
console.log(a, b, c);
Enter fullscreen mode Exit fullscreen mode

15. Destructuring defaults?

Answer
Answer: Exact output: null, 20
Why: A default value is used only when the property is undefined.

Code example:

const { a = 10, b = 20 } = {
  a: null,
  b: undefined,
};
console.log(a, b);
Enter fullscreen mode Exit fullscreen mode

16. Duplicate function declarations?

Answer
Answer: Exact output: 2
Why: In the same scope, the later function declaration replaces the earlier declaration.

Code example:

console.log(getValue());
function getValue() {
  return 1;
}
function getValue() {
  return 2;
}
Enter fullscreen mode Exit fullscreen mode

17. Effect cleanup order?

Answer
Answer: Exact output: For 0 to 1: effect 0, cleanup 0, effect 1
Why: React cleans up the previous effect before running the replacement.

Code example:

useEffect(() => {
  console.log('effect', count);
  return () => console.log('cleanup', count);
}, [count]);
Enter fullscreen mode Exit fullscreen mode

18. Empty array conversions?

Answer
Answer: Exact output: empty string, 0, true
Why: An empty array converts to an empty string, which converts to zero for numeric comparison.

Code example:

console.log(String([]));
console.log(Number([]));
console.log([] == false);
Enter fullscreen mode Exit fullscreen mode

19. Empty dependency stale closure?

Answer
Answer: Exact output: It repeatedly logs the initial count
Why: The effect callback captures count from the first render.

Code example:

useEffect(() => {
  const id = setInterval(() => console.log(count), 1000);
  return () => clearInterval(id);
}, []); // captures the initial count
Enter fullscreen mode Exit fullscreen mode

20. Event loop: Promise vs timer?

Answer
Answer: Exact output: A, D, C, B
Why: Synchronous code runs first, then microtasks, then timer tasks.

Code example:

console.log('A');
setTimeout(() => console.log('B'), 0);
Promise.resolve().then(() => console.log('C'));
console.log('D');
Enter fullscreen mode Exit fullscreen mode

21. FlatList and extraData?

Answer
Answer: Exact output: Rows may not update when only selectedId changes
Why: FlatList behaves like a PureComponent and may skip work when its relevant props remain shallow-equal.

Code example:

<FlatList
  data={items}
  renderItem={({ item }) => (
    <Row item={item} selected={selectedId === item.id} />
  )}
/>;
Enter fullscreen mode Exit fullscreen mode

22. Function closure after return?

Answer
Answer: Exact output: 1, then 2
Why: inner retains the lexical environment of the completed outer call.

Code example:

function outer() {
  let value = 1;
  return function inner() {
    console.log(value++);
  };
}
const next = outer();
next();
next();
Enter fullscreen mode Exit fullscreen mode

23. Function declaration and var assignment?

Answer
Answer: Exact output: function, then number
Why: The function declaration initializes value first; the runtime assignment later replaces it with 10.

Code example:

console.log(typeof value);
var value = 10;
function value() {}
console.log(typeof value);
Enter fullscreen mode Exit fullscreen mode

24. Function declaration hoisting?

Answer
Answer: Exact output: Hello
Why: A function declaration is hoisted together with its function body.

Code example:

sayHello();
function sayHello() {
  console.log('Hello');
}
Enter fullscreen mode Exit fullscreen mode

25. Function expression hoisting?

Answer
Answer: Exact output: TypeError: sayHello is not a function
Why: Only the var declaration is hoisted. Its value is undefined at the call.

Code example:

sayHello();
var sayHello = function () {
  console.log('Hello');
};
Enter fullscreen mode Exit fullscreen mode

26. Function length?

Answer
Answer: Exact output: 3, 1, 0
Why: Function length counts parameters before the first default and excludes the rest parameter.

Code example:

function first(a, b, c) {}
function second(a, b = 2, c) {}
function third(...args) {}
console.log(first.length, second.length, third.length);
Enter fullscreen mode Exit fullscreen mode

27. Functional state updates?

Answer
Answer: Exact output: After one press, count is 3
Why: React applies each updater to the result of the previous queued updater.

Code example:

setCount((c) => c + 1);
setCount((c) => c + 1);
setCount((c) => c + 1);
Enter fullscreen mode Exit fullscreen mode

28. Getter execution?

Answer
Answer: Exact output: getter, then React Native
Why: Reading an accessor property executes its getter function.

Code example:

const user = {
  first: 'React',
  last: 'Native',
  get name() {
    console.log('getter');
    return `${this.first} ${this.last}`;
  },
};
console.log(user.name);
Enter fullscreen mode Exit fullscreen mode

29. Heavy JavaScript work and UI?

Answer
Answer: Exact output: The app can freeze or drop frames until the loop finishes
Why: Heavy synchronous work blocks the JavaScript thread and delays event handling and React updates.

Code example:

const press = () => {
  const result = expensiveSynchronousLoop();
  setResult(result);
};
Enter fullscreen mode Exit fullscreen mode

30. Hoisting with var?

Answer
Answer: Exact output: undefined
Why: The local declaration is hoisted, but the assignment remains in its original place.

Code example:

var x = 21;
function test() {
  console.log(x);
  var x = 20;
}
test();
Enter fullscreen mode Exit fullscreen mode

31. Lazy state initializer?

Answer
Answer: Exact output: Normally initialize prints only on mount
Why: React calls the initializer to create initial state, not on every ordinary re-render.

Code example:

const [value] = useState(() => {
  console.log('initialize');
  return expensiveCalculation();
});
Enter fullscreen mode Exit fullscreen mode

32. Local var shadows outer variable?

Answer
Answer: Exact output: undefined
Why: The local var is hoisted and shadows the outer count throughout the function.

Code example:

var count = 10;
function show() {
  console.log(count);
  var count = 20;
}
show();
Enter fullscreen mode Exit fullscreen mode

33. Logging immediately after setState?

Answer
Answer: Exact output: The first press logs 0
Why: The handler continues using state from the render that created it.

Code example:

const [count, setCount] = useState(0);
const press = () => {
  setCount(1);
  console.log(count);
};
Enter fullscreen mode Exit fullscreen mode

34. Loose vs strict equality?

Answer
Answer: Exact output: true, false, true, false
Why: Loose equality performs type coercion; strict equality requires matching types.

Code example:

console.log(0 == false);
console.log(0 === false);
console.log('' == false);
console.log('' === false);
Enter fullscreen mode Exit fullscreen mode

35. Multiple Promise microtasks?

Answer
Answer: Exact output: start, end, p1, p2
Why: Promise callbacks are queued in registration order after synchronous code.

Code example:

console.log('start');
Promise.resolve().then(() => console.log('p1'));
Promise.resolve().then(() => console.log('p2'));
console.log('end');
Enter fullscreen mode Exit fullscreen mode

36. Mutating React state?

Answer
Answer: Exact output: A re-render may be skipped
Why: The setter receives the same object reference, so React can consider the state unchanged.

Code example:

const [user, setUser] = useState({ name: 'Alex' });
const press = () => {
  user.name = 'Sam';
  setUser(user);
};
Enter fullscreen mode Exit fullscreen mode

37. NaN equality?

Answer
Answer: Exact output: false, true, true
Why: NaN is unequal to every value under ===, including itself.

Code example:

console.log(NaN === NaN);
console.log(Object.is(NaN, NaN));
console.log(Number.isNaN(NaN));
Enter fullscreen mode Exit fullscreen mode

38. Named function expression scope?

Answer
Answer: Exact output: function, then undefined
Why: The expression's name is available inside its own body, not in the surrounding scope.

Code example:

const run = function internal() {
  console.log(typeof internal);
};
run();
console.log(typeof internal);
Enter fullscreen mode Exit fullscreen mode

39. Nested Promise microtasks?

Answer
Answer: Exact output: 1, 2, 3
Why: The inner Promise callback is queued before the next chained reaction becomes runnable.

Code example:

Promise.resolve()
  .then(() => {
    console.log(1);
    Promise.resolve().then(() => console.log(2));
  })
  .then(() => console.log(3));
Enter fullscreen mode Exit fullscreen mode

40. OR vs nullish coalescing?

Answer
Answer: Exact output: 100, 0, 100
Why: || falls back for all falsy values; ?? only for null or undefined.

Code example:

console.log(0 || 100);
console.log(0 ?? 100);
console.log(null ?? 100);
Enter fullscreen mode Exit fullscreen mode

41. Object dependency causes repeated effects?

Answer
Answer: Exact output: fetch runs after every render
Why: A new options object is created on every render.

Code example:

const options = { page: 1 };
useEffect(() => {
  console.log('fetch');
}, [options]);
Enter fullscreen mode Exit fullscreen mode

42. Object keys are coerced to strings?

Answer
Answer: Exact output: second
Why: Both object keys become the same string, '[object Object]'.

Code example:

const store = {};
const first = { id: 1 };
const second = { id: 2 };
store[first] = 'first';
store[second] = 'second';
console.log(store[first]);
Enter fullscreen mode Exit fullscreen mode

43. Object.assign is shallow?

Answer
Answer: Exact output: true
Why: Object.assign copies the nested reference rather than cloning it.

Code example:

const source = { settings: { dark: false } };
const copy = Object.assign({}, source);
copy.settings.dark = true;
console.log(source.settings.dark);
Enter fullscreen mode Exit fullscreen mode

44. Object.freeze is shallow?

Answer
Answer: Exact output: Pune
Why: The outer object is frozen, but the nested address object is not.

Code example:

const user = Object.freeze({
  name: 'Alex',
  address: { city: 'Delhi' },
});
user.address.city = 'Pune';
console.log(user.address.city);
Enter fullscreen mode Exit fullscreen mode

45. Optional chaining?

Answer
Answer: Exact output: undefined, Guest
Why: Optional chaining stops safely at null/undefined; ?? supplies the fallback.

Code example:

const user = null;
console.log(user?.profile?.name);
console.log(user?.profile?.name ?? 'Guest');
Enter fullscreen mode Exit fullscreen mode

46. Parameter and var with the same name?

Answer
Answer: Exact output: 10, then 20
Why: The parameter supplies the initial local value; redeclaring it with var does not reset it.

Code example:

function show(value) {
  console.log(value);
  var value = 20;
  console.log(value);
}
show(10);
Enter fullscreen mode Exit fullscreen mode

47. Promise chain values?

Answer
Answer: Exact output: 2, 4
Why: Each then receives the value returned by the previous callback.

Code example:

Promise.resolve(1)
  .then((v) => v + 1)
  .then((v) => {
    console.log(v);
    return v * 2;
  })
  .then(console.log);
Enter fullscreen mode Exit fullscreen mode

48. Promise error recovery?

Answer
Answer: Exact output: error, recovered
Why: catch handles the rejection and returns a fulfilled value to the next then.

Code example:

Promise.reject('error')
  .catch((value) => {
    console.log(value);
    return 'recovered';
  })
  .then(console.log);
Enter fullscreen mode Exit fullscreen mode

49. Promise executor is synchronous?

Answer
Answer: Exact output: 1, 2, 4, 3
Why: The Promise constructor executes immediately. The then callback is a microtask.

Code example:

console.log(1);
new Promise((resolve) => {
  console.log(2);
  resolve();
}).then(() => console.log(3));
console.log(4);
Enter fullscreen mode Exit fullscreen mode

50. Promise.race?

Answer
Answer: Exact output: fast
Why: race settles with the first input to settle, not the first item in array order.

Code example:

Promise.race([
  new Promise((resolve) => setTimeout(() => resolve('slow'), 20)),
  Promise.resolve('fast'),
]).then(console.log);
Enter fullscreen mode Exit fullscreen mode

51. Prototype property lookup?

Answer
Answer: Exact output: admin, then editor
Why: user has no own role, so lookup follows its prototype reference.

Code example:

const parent = { role: 'admin' };
const user = Object.create(parent);
user.name = 'Alex';
console.log(user.role);
parent.role = 'editor';
console.log(user.role);
Enter fullscreen mode Exit fullscreen mode

52. React.memo and inline object?

Answer
Answer: Exact output: Child can log again whenever Parent renders
Why: The inline style is a new object reference, so shallow prop comparison fails.

Code example:

<View style={style} />;
});
function Parent() {
 return <Child style={{ flex: 1 }} />;
}
Enter fullscreen mode Exit fullscreen mode

53. Ref updates?

Answer
Answer: Exact output: It increases once for each render
Why: A ref persists between renders, but changing current does not cause a render.

Code example:

const renders = useRef(0);
renders.current += 1;
console.log(renders.current);
Enter fullscreen mode Exit fullscreen mode

54. Regular method vs arrow this?

Answer
Answer: Exact output: Alex, then usually undefined
Why: A regular method receives the calling object as this. An arrow captures lexical this.

Code example:

const user = {
  name: 'Alex',
  regular() {
    console.log(this.name);
  },
  arrow: () => console.log(this.name),
};
user.regular();
user.arrow();
Enter fullscreen mode Exit fullscreen mode

55. Render and effect order?

Answer
Answer: Exact output: Production: render, effect
Why: The component renders first; the passive effect runs after commit.

Code example:

<Text>Hello</Text>;
}
Enter fullscreen mode Exit fullscreen mode

56. Repeated direct state updates?

Answer
Answer: Exact output: After one press, count is 1
Why: All calls calculate the next value from count captured by the current render.

Code example:

const [count, setCount] = useState(0);
const press = () => {
  setCount(count + 1);
  setCount(count + 1);
  setCount(count + 1);
};
Enter fullscreen mode Exit fullscreen mode

57. Rest parameters?

Answer
Answer: Exact output: 1, then [2, 3, 4]
Why: The rest parameter collects remaining arguments into a real array.

Code example:

function inspect(first, ...rest) {
  console.log(first);
  console.log(rest);
}
inspect(1, 2, 3, 4);
Enter fullscreen mode Exit fullscreen mode

58. ScrollView vs FlatList output behavior?

Answer
Answer: ScrollView mounts its children eagerly, which is simple and appropriate for bounded content. FlatList virtualizes data-backed rows and is usually the safer baseline when item count or row cost can grow, but it adds tuning and state-preservation considerations. I choose from measured memory, fill rate, interaction cost, and product constraints rather than a fixed item-count rule.

Code example:

<ScrollView>
  {items.map((item) => (
    <Row key={item.id} item={item} />
  ))}
</ScrollView>;
Enter fullscreen mode Exit fullscreen mode

59. Shallow object equality?

Answer
Answer: Exact output: false, false
Why: Both operators compare object identity, and these are separate objects.

Code example:

const a = { value: 1 };
const b = { value: 1 };
console.log(a === b);
console.log(Object.is(a, b));
Enter fullscreen mode Exit fullscreen mode

60. Shallow spread copy?

Answer
Answer: Exact output: Sam
Why: Spread creates a new outer object but shares nested references.

Code example:

const a = { user: { name: 'Alex' } };
const b = { ...a };
b.user.name = 'Sam';
console.log(a.user.name);
Enter fullscreen mode Exit fullscreen mode

61. Shared object reference?

Answer
Answer: Exact output: Sam
Why: a and b contain references to the same object.

Code example:

const a = { name: 'Alex' };
const b = a;
b.name = 'Sam';
console.log(a.name); // 'Sam'
Enter fullscreen mode Exit fullscreen mode

62. Spread creates a shallow array copy?

Answer
Answer: Exact output: 9
Why: The array container is new, but the nested object reference is shared.

Code example:

const first = [{ value: 1 }];
const second = [...first];
second[0].value = 9;
console.log(first[0].value);
Enter fullscreen mode Exit fullscreen mode

63. Strict Mode console output?

Answer
Answer: Exact output: Development may print render twice; production normally once
Why: Strict Mode repeats selected work in development to expose impure rendering and missing cleanup.

Code example:

<Text>Profile</Text>;
}
Enter fullscreen mode Exit fullscreen mode

64. String addition vs numeric subtraction?

Answer
Answer: Exact output: 52, 3, 51
Why: The + operator concatenates when a string is involved; subtraction converts operands to numbers.

Code example:

console.log('5' + 2);
console.log('5' - 2);
console.log(5 + '2' - 1);
Enter fullscreen mode Exit fullscreen mode

65. String plus number coercion?

Answer
Answer: Exact output: 52, 3, 7
Why: + concatenates when one operand is a string; subtraction performs numeric coercion.

Code example:

console.log('5' + 2);
console.log('5' - 2);
console.log(Number('5') + 2);
Enter fullscreen mode Exit fullscreen mode

66. Strings are immutable?

Answer
Answer: Exact output: React
Why: Assigning to a string index does not modify the string value.

Code example:

let text = 'React';
text[0] = 'X';
console.log(text);
Enter fullscreen mode Exit fullscreen mode

67. Temporal Dead Zone?

Answer
Answer: Exact output: ReferenceError
Why: let is hoisted but cannot be accessed before its declaration is initialized.

Code example:

console.log(value);
let value = 10;
Enter fullscreen mode Exit fullscreen mode

68. Throwing inside then?

Answer
Answer: Exact output: data, caught
Why: An exception in a then callback rejects the Promise returned by that then.

Code example:

Promise.resolve('data')
  .then((value) => {
    console.log(value);
    throw new Error('broken');
  })
  .catch(() => console.log('caught'));
Enter fullscreen mode Exit fullscreen mode

69. Timer callback creates a microtask?

Answer
Answer: Exact output: start, end, timer 1, promise, timer 2
Why: After each timer task, JavaScript drains newly queued microtasks before the next timer task.

Code example:

console.log('start');
setTimeout(() => {
  console.log('timer 1');
  Promise.resolve().then(() => console.log('promise'));
}, 0);
setTimeout(() => console.log('timer 2'), 0);
console.log('end');
Enter fullscreen mode Exit fullscreen mode

70. Truthiness of string values?

Answer
Answer: Exact output: true, true, false, true
Why: Every non-empty string and every object is truthy.

Code example:

console.log(Boolean('false'));
console.log(Boolean('0'));
console.log(Boolean(''));
console.log(Boolean([]));
Enter fullscreen mode Exit fullscreen mode

71. What is the output of a closure counter called three times?

Answer
Answer: It prints 1, 2, 3 because every call updates the same closed-over count. Separate calls to outer create independent closure environments.

Code example:

function outer() {
  let count = 0;
  return () => console.log(++count);
}
const fn = outer();
fn();
fn();
fn(); // 1 2 3
Enter fullscreen mode Exit fullscreen mode

72. What is the output of synchronous logs, Promise.then, and setTimeout(0)?

Answer
Answer: The output is 1, 4, 3, 2: synchronous logs run first, then the Promise microtask, then the timer macrotask. The interview-worthy reasoning is to evaluate operands and side effects in source order, then apply the relevant coercion, scope, or scheduling rule before stating the result.

Code example:

console.log('1');
setTimeout(() => console.log('2'), 0);
Promise.resolve().then(() => console.log('3'));
console.log('4');
// 1 4 3 2
Enter fullscreen mode Exit fullscreen mode

73. What is the output of var versus let in a loop with setTimeout?

Answer
Answer: var produces 3,3,3 because all callbacks share one function-scoped binding after the loop. let produces 0,1,2 because each iteration gets a new binding.

Code example:

for (var i = 0; i < 3; i++) setTimeout(() => console.log(i)); // 3 3 3
for (let i = 0; i < 3; i++) setTimeout(() => console.log(i)); // 0 1 2
Enter fullscreen mode Exit fullscreen mode

74. What is the output when Promise.then and queueMicrotask are queued before a timer?

Answer
Answer: It prints A, E, C, D, B. Synchronous logs run first; Promise.then and queueMicrotask then run in enqueue order; the timer runs afterward.

Code example:

console.log('A');
setTimeout(() => console.log('B'));
Promise.resolve().then(() => console.log('C'));
queueMicrotask(() => console.log('D'));
console.log('E'); // A E C D B
Enter fullscreen mode Exit fullscreen mode

75. What is the output when a property exists only on the prototype?

Answer
Answer: It prints John because property lookup falls through the instance to Person.prototype. The interview-worthy reasoning is to evaluate operands and side effects in source order, then apply the relevant coercion, scope, or scheduling rule before stating the result.

Code example:

function Person() {}
Person.prototype.name = 'John';
const p = new Person();
console.log(p.name); // John
Enter fullscreen mode Exit fullscreen mode

76. What is the result of [] + []?

Answer
Answer: It is an empty string because both arrays convert to empty strings and + performs string concatenation. The interview-worthy reasoning is to evaluate operands and side effects in source order, then apply the relevant coercion, scope, or scheduling rule before stating the result.

Code example:

[] + []; // ''
Enter fullscreen mode Exit fullscreen mode

77. What is the result of [] == false?

Answer
Answer: It is true: the array converts to an empty string and then 0, while false converts to 0. The interview-worthy reasoning is to evaluate operands and side effects in source order, then apply the relevant coercion, scope, or scheduling rule before stating the result.

Code example:

[] == false; // true
Enter fullscreen mode Exit fullscreen mode

78. What is the result of {} + []?

Answer
Answer: The result is parsing-context dependent: leading {} may be parsed as a block, while parenthesized objects convert to '[object Object]'. Never rely on this ambiguity.

Code example:

({}) + []; // '[object Object]'
Enter fullscreen mode Exit fullscreen mode

79. async/await ordering?

Answer
Answer: Exact output: 3, 1, 4, 2
Why: The function runs synchronously until await. Its continuation is a microtask.

Code example:

async function run() {
  console.log(1);
  await Promise.resolve();
  console.log(2);
}
console.log(3);
run();
console.log(4);
Enter fullscreen mode Exit fullscreen mode

80. await with a non-Promise value?

Answer
Answer: Exact output: A, C, B
Why: await behaves like awaiting Promise.resolve(10), so continuation is asynchronous.

Code example:

async function run() {
  console.log('A');
  await 10;
  console.log('B');
}
run();
console.log('C');
Enter fullscreen mode Exit fullscreen mode

81. call, apply and bind?

Answer
Answer: Exact output: Alex-Delhi, Alex-Pune, Alex-Noida
Why: call invokes with separate arguments, apply invokes with an array-like list, and bind returns a function.

Code example:

function intro(city) {
  return `${this.name}-${city}`;
}
const user = { name: 'Alex' };
console.log(intro.call(user, 'Delhi'));
console.log(intro.apply(user, ['Pune']));
console.log(intro.bind(user, 'Noida')());
Enter fullscreen mode Exit fullscreen mode

82. catch recovers a Promise chain?

Answer
Answer: Exact output: failed, recovered
Why: Returning from catch fulfills the next Promise.

Code example:

Promise.reject('failed')
  .catch((error) => {
    console.log(error);
    return 'recovered';
  })
  .then(console.log);
Enter fullscreen mode Exit fullscreen mode

83. const before declaration?

Answer
Answer: Exact output: ReferenceError
Why: const also remains in the Temporal Dead Zone until its declaration executes.

Code example:

console.log(apiUrl);
const apiUrl = 'example.com';
Enter fullscreen mode Exit fullscreen mode

84. const object mutation?

Answer
Answer: Exact output: Sam
Why: const prevents rebinding, not mutation of the referenced object.

Code example:

const user = { name: 'Alex' };
user.name = 'Sam';
console.log(user.name);
Enter fullscreen mode Exit fullscreen mode

85. delete leaves an array hole?

Answer
Answer: Exact output: 3, then false
Why: delete removes the indexed property but does not shift elements or change length.

Code example:

const values = [10, 20, 30];
delete values[1];
console.log(values.length);
console.log(1 in values);
Enter fullscreen mode Exit fullscreen mode

86. delete reveals a prototype value?

Answer
Answer: Exact output: 2, then 1
Why: Deleting the own property exposes the inherited property during the next lookup.

Code example:

const parent = { value: 1 };
const child = Object.create(parent);
child.value = 2;
console.log(child.value);
delete child.value;
console.log(child.value);
Enter fullscreen mode Exit fullscreen mode

87. fill shares object references?

Answer
Answer: Exact output: [5, 5, 5]
Why: fill inserts the same object reference into every position.

Code example:

const rows = Array(3).fill({ count: 0 });
rows[0].count = 5;
console.log(rows.map((row) => row.count));
Enter fullscreen mode Exit fullscreen mode

88. filter(Boolean)?

Answer
Answer: Exact output: [1, 'RN']
Why: Boolean removes all falsy values, not only null and undefined.

Code example:

const values = [0, 1, '', 'RN', null, undefined, false];
console.log(values.filter(Boolean));
Enter fullscreen mode Exit fullscreen mode

89. finally does not replace a value?

Answer
Answer: Exact output: data
Why: A normal return from finally does not replace the settled value.

Code example:

Promise.resolve('data')
  .finally(() => 'other')
  .then(console.log);
Enter fullscreen mode Exit fullscreen mode

90. forEach return value?

Answer
Answer: Exact output: undefined
Why: forEach is for side effects and always returns undefined.

Code example:

const result = [1, 2, 3].forEach((value) => value * 2);
console.log(result);
Enter fullscreen mode Exit fullscreen mode

91. in vs own property?

Answer
Answer: Exact output: true, then false
Why: in checks the prototype chain; Object.hasOwn checks only the object itself.

Code example:

const parent = { role: 'admin' };
const user = Object.create(parent);
user.name = 'Alex';
console.log('role' in user);
console.log(Object.hasOwn(user, 'role'));
Enter fullscreen mode Exit fullscreen mode

92. includes handles NaN?

Answer
Answer: Exact output: -1, true
Why: indexOf uses strict-equality-like comparison; includes uses SameValueZero, which matches NaN.

Code example:

const values = [1, NaN, 3];
console.log(values.indexOf(NaN));
console.log(values.includes(NaN));
Enter fullscreen mode Exit fullscreen mode

93. let before declaration?

Answer
Answer: Exact output: ReferenceError
Why: let is hoisted but remains uninitialized in the Temporal Dead Zone.

Code example:

console.log(a);
let a = 10;
Enter fullscreen mode Exit fullscreen mode

94. let function expression?

Answer
Answer: Exact output: ReferenceError
Why: The let binding exists but is still in the Temporal Dead Zone.

Code example:

greet();
let greet = function () {
  console.log('Hello');
};
Enter fullscreen mode Exit fullscreen mode

95. let is block-scoped?

Answer
Answer: Exact output: ReferenceError
Why: The let binding exists only inside the if block.

Code example:

function test() {
  if (true) {
    let message = 'inside';
  }
  console.log(message);
}
test();
Enter fullscreen mode Exit fullscreen mode

96. map callback without return?

Answer
Answer: Exact output: [undefined, undefined, undefined]
Why: A block-bodied arrow function needs an explicit return.

Code example:

const result = [1, 2, 3].map((value) => {
  value * 2;
});
console.log(result);
Enter fullscreen mode Exit fullscreen mode

97. map with an async callback?

Answer
Answer: Exact output: true
Why: An async callback always returns a Promise, so map creates an array of Promises.

Code example:

const results = [1, 2, 3].map(async (value) => value * 2);
console.log(results[0] instanceof Promise);
Enter fullscreen mode Exit fullscreen mode

98. map with parseInt?

Answer
Answer: Exact output: [1, NaN, NaN]
Why: map supplies value, index and array. parseInt treats the index as its radix.

Code example:

console.log(['1', '2', '3'].map(parseInt));
Enter fullscreen mode Exit fullscreen mode

99. null and undefined arithmetic?

Answer
Answer: Exact output: 1, NaN, 0, NaN
Why: Numeric conversion turns null into 0 and undefined into NaN.

Code example:

console.log(null + 1);
console.log(undefined + 1);
console.log(Number(null));
console.log(Number(undefined));
Enter fullscreen mode Exit fullscreen mode

100. null compared with undefined?

Answer
Answer: Exact output: true, false
Why: Loose equality has a special rule making null equal to undefined; strict equality distinguishes them.

Code example:

console.log(null == undefined);
console.log(null === undefined);
Enter fullscreen mode Exit fullscreen mode

101. push return value?

Answer
Answer: Exact output: 4, then [1, 2, 3, 4]
Why: push mutates the array and returns its new length.

Code example:

const values = [1, 2, 3];
const result = values.push(4);
console.log(result);
console.log(values);
Enter fullscreen mode Exit fullscreen mode

102. reduce without an initial value?

Answer
Answer: Exact output: 6
Why: The first element becomes the initial accumulator and iteration starts at index 1.

Code example:

const values = [1, 2, 3];
const total = values.reduce((sum, value) => sum + value);
console.log(total);
Enter fullscreen mode Exit fullscreen mode

103. replace changes only the first string match?

Answer
Answer: Exact output: RN JS JS, then RN RN RN
Why: A string search in replace affects only the first occurrence; replaceAll affects all.

Code example:

const text = 'JS JS JS';
console.log(text.replace('JS', 'RN'));
console.log(text.replaceAll('JS', 'RN'));
Enter fullscreen mode Exit fullscreen mode

104. slice vs splice?

Answer
Answer: Exact output: [2, 3], [1, 2, 3, 4], [2, 3], [1, 4]
Why: slice returns a non-mutating copy; splice removes/replaces elements in the original.

Code example:

const values = [1, 2, 3, 4];
console.log(values.slice(1, 3));
console.log(values);
console.log(values.splice(1, 2));
console.log(values);
Enter fullscreen mode Exit fullscreen mode

105. slice with negative indexes?

Answer
Answer: Exact output: Script, then JavaScript
Why: slice counts negative indexes from the end; substring treats negative values as zero.

Code example:

const text = 'JavaScript';
console.log(text.slice(-6));
console.log(text.substring(-6));
Enter fullscreen mode Exit fullscreen mode

106. typeof null?

Answer
Answer: Exact output: 'object'
Why: This is a historical JavaScript language quirk.

Code example:

console.log(typeof null); // 'object'
Enter fullscreen mode Exit fullscreen mode

107. useCallback reference stability?

Answer
Answer: Exact output: The function reference stays stable until count changes
Why: useCallback returns the same function while dependencies are equal.

Code example:

const onPress = useCallback(() => {
  console.log(count);
}, [count]);
Enter fullscreen mode Exit fullscreen mode

108. useMemo dependencies?

Answer
Answer: Exact output: calculate runs on mount and when the items reference changes
Why: useMemo reuses its cached value while dependencies remain equal by Object.is.

Code example:

const total = useMemo(() => {
  console.log('calculate');
  return items.reduce((sum, x) => sum + x.price, 0);
}, [items]);
Enter fullscreen mode Exit fullscreen mode

109. var function expression?

Answer
Answer: Exact output: undefined, then TypeError
Why: The variable exists as undefined, but the function assignment has not executed.

Code example:

console.log(typeof greet);
greet();
var greet = function () {
  console.log('Hello');
};
Enter fullscreen mode Exit fullscreen mode

110. var is function-scoped?

Answer
Answer: Exact output: inside
Why: var does not create an if-block scope.

Code example:

function test() {
  if (true) {
    var message = 'inside';
  }
  console.log(message);
}
test();
Enter fullscreen mode Exit fullscreen mode

111. var vs let in loop?

Answer
Answer: Exact output: var prints 3, 3, 3; let prints 0, 1, 2.
Why: var shares one function-scoped binding; let creates a binding per iteration.

Code example:

for (var i = 0; i < 3; i++) setTimeout(() => console.log(i)); // 3 3 3
for (let i = 0; i < 3; i++) setTimeout(() => console.log(i)); // 0 1 2
Enter fullscreen mode Exit fullscreen mode

Scenario-Based Questions

13 reviewed questions.

🟡 Intermediate

1. Context causes input lag in a large form?

Answer
Answer: A changing Provider value notifies every consumer, so one Context containing fifteen fields can re-render the whole form per keystroke. I keep field state local or use React Hook Form with field subscriptions, split stable contexts, and memoize Provider values. Context is dependency distribution, not automatically an efficient high-frequency store.

2. Images cause OutOfMemoryError on Android?

Answer
Answer: I capture memory evidence and check decoded bitmap dimensions rather than only compressed file size. I request correctly sized images, avoid mounting too many at once, limit concurrent decodes, and use a maintained image pipeline with memory and disk caching. I then repeat the failing scroll path under constrained memory to verify that the peak and retained heap are lower.

3. Push works in foreground but not when app is killed?

Answer
Answer: I verify FCM and APNs credentials for the correct environment, bundle/package identifiers, Android channels, payload type, iOS entitlements, provisioning, and Background Modes. I test a fully killed release build on a real device because foreground JavaScript handlers are not sufficient for terminated state.

4. Screen re-renders every second with no visible change?

Answer
Answer: I use the React Profiler to identify the component that commits and inspect which state, props, or context value changed. Common causes include timer-driven state, recreated provider values, parent updates, and duplicated focus listeners. I remove unnecessary state writes or move rapidly changing state to the smallest owner, then profile the same interaction again.

5. TextInput is hidden behind the keyboard on Android?

Answer
Answer: I inspect the window soft-input mode, edge-to-edge insets, keyboard-aware layout, and scroll-container hierarchy. Depending on the navigation and Android configuration, I use an inset-aware keyboard controller or KeyboardAvoidingView and ensure the focused field can scroll into view. I verify the result on representative real devices because adjustResize behavior varies with window configuration.

6. onEndReached fires multiple times and duplicates pagination data. How do you fix it?

Answer
Answer: I add an isFetchingNextPage guard, track whether more data exists, and deduplicate records by stable id. I avoid changing the data reference unnecessarily during momentum and can use onMomentumScrollBegin when the UX requires it. With React Query I use fetchNextPage and its built-in isFetchingNextPage flag. The backend should preferably use cursor pagination so repeated requests are idempotent.

🔴 Senior

7. How would you diagnose a page becoming unresponsive after processing a large dataset?

Answer
Answer: Profile to confirm synchronous CPU work, then reduce complexity, virtualize rendered data, and chunk, defer, or move computation off the critical thread.

8. How would you migrate a legacy application to the New Architecture?

Answer
Answer: Upgrade incrementally, baseline crashes and performance, inventory libraries, replace abandoned dependencies, migrate custom specs, establish release E2E coverage, and stage the rollout with flags. React Native 0.82 and later run only on the New Architecture; 0.81 was the final release that allowed the Legacy Architecture, so migration and fallback advice must be tied to the project's target release.

9. How would you optimize an app with rising memory, slow renders, and long synchronous tasks?

Answer
Answer: Profile each symptom separately, fix retained resources, virtualize large lists, reduce hot re-renders, memoize measured bottlenecks, and split or move long synchronous work.

10. How would you redesign an app that has become difficult to maintain?

Answer
Answer: I first map dependencies, state ownership, API boundaries, native integrations, and pain metrics. I define feature boundaries and shared platform services, introduce typed interfaces and tests around current behavior, then migrate one vertical feature at a time. I separate server state from client state, centralize design tokens/network/security, add observability and CI gates, and avoid a risky full rewrite unless evidence justifies it.

11. How would you safely adopt React 19 in an existing React Native application?

Answer
Answer: Start from the React version supported by the selected React Native release rather than upgrading React independently. Audit native libraries, navigation, testing tools, custom render behavior, and deprecated APIs; then upgrade on a branch, run Android and iOS regression suites, profile startup and rendering, and use a staged rollout. Keep a rollback path until crash-free sessions and business journeys are stable. In React Native, availability follows the React version bundled by the chosen React Native release, so I verify that toolchain before using the API.

12. How would you structure a large React Native codebase?

Answer
Answer: Organize by product domains and public interfaces; presentation depends on use cases and domain models; infrastructure implements APIs, storage, analytics, and native adapters; a design system owns primitives.

13. The app is slow. Walk through your investigation?

Answer
Answer: I first define the symptom: startup, navigation, scrolling, input, network, or memory. I reproduce in release mode and inspect JS/UI FPS, React renders, Hermes CPU, native traces, network timing, images, and memory. I form one hypothesis, change one bottleneck, compare metrics, and add a regression guard. I never begin by adding memoization everywhere.

HR & Behavioral Questions

7 reviewed questions.

🔴 Senior

1. Describe a production mistake you made and what changed afterward?

Answer
Answer: Use a specific STAR story, own your contribution without blaming others, explain the immediate recovery, and quantify both user impact and the result. Finish with the durable process, test, observability, or design change you helped implement and how you verified it reduced recurrence.

2. How do you handle disagreement on architecture?

Answer
Answer: Restate constraints and success criteria, compare trade-offs, migration, failure modes, and reversibility, time-box evidence-gathering, record the ADR and revisit trigger, then support the decision.

3. How do you lead a performance improvement across a team?

Answer
Answer: Turn 'slow' into agreed metrics and representative devices, baseline, assign bottleneck ownership, review traces, set budgets, prioritize user impact, and encode proven patterns in shared components.

4. How do you mentor engineers while maintaining delivery speed?

Answer
Answer: Match support to risk and experience through pairing, examples, bounded ownership, and reasoning-focused reviews; protect feedback time and remove recurring friction with tooling and docs.

5. Tell me about a production incident—how should a senior answer?

Answer
Answer: Use a quantified situation, detection and containment, evidence-based cause, communication, and durable prevention. Separate the trigger from systemic contributors and state the learning.

6. Tell me about a time you disagreed with a technical decision?

Answer
Answer: Use a truthful STAR example that explains the shared goal, the evidence behind your disagreement, how you listened and proposed an experiment, the decision the team made, and the measured result. Show that you can disagree without turning the discussion into a contest and can commit after a decision.

7. What do you look for in code review as a senior engineer?

Answer
Answer: Review correctness, cancellation and failure paths, state ownership, security, privacy, accessibility, realistic performance, tests, native lifecycle, and observability; separate blockers from suggestions and explain why.

Common interview mistakes

  • useMemo always improves performance.”

    ✅ Memoization adds comparison, allocation, and maintenance costs. Profile first.

  • “React Native uses the DOM.”

    ✅ React Native uses React reconciliation with native host views, not browser DOM nodes.

  • “AsyncStorage is safe for tokens.”

    ✅ Store credentials in Keychain/Keystore-backed secure storage; keep server secrets off-device.

  • Promise.all cancels remaining requests after one rejection.”

    ✅ It rejects early, but other operations may continue unless explicitly cancelled.

  • “The New Architecture makes every app fast.”

    ✅ It reduces important boundary costs; slow renders, large images, and blocking work still need profiling.

Company and role preparation

Company-specific interview questions vary by team and change over time. Use these as preparation lenses, not claims about a company's fixed interview process.

  • Microsoft — cross-platform architecture, TypeScript, accessibility, testing, and collaboration.
  • PhonePe, Razorpay, Zeta, and CRED — payments, secure authentication, idempotency, offline recovery, and incident response.
  • Swiggy — high-volume feeds, location, notifications, performance, and unreliable networks.
  • Amazon and Walmart — scalable UI, operational excellence, customer impact, ownership, and system design.
  • Deloitte and consulting roles — client communication, delivery, debugging across environments, and explaining trade-offs clearly.

Related reading

Add canonical links to relevant existing Dev.to articles before publishing. Useful internal links include:

  • Biometric Authentication
  • React Native New Architecture
  • Fastlane and CI/CD
  • Multi-language Support
  • Debouncing
  • React Native Security

Downloadable preparation checklist

Copy this into your notes and mark each subject only after you can explain it, implement a small example, and answer at least two follow-up questions.

  • [ ] JavaScript fundamentals, closures, prototypes, and async behavior
  • [ ] React rendering, state ownership, hooks, and effects
  • [ ] Navigation, deep linking, and protected routes
  • [ ] Redux/Context/Zustand and server-state management
  • [ ] APIs, cancellation, retries, token refresh, and offline sync
  • [ ] AsyncStorage, MMKV, SQLite, Keychain, and Keystore
  • [ ] FlatList, image memory, startup, and profiling
  • [ ] Fabric, TurboModules, JSI, Codegen, and native modules
  • [ ] Android and iOS platform differences
  • [ ] Push notifications, analytics, crash reporting, and release debugging
  • [ ] Security, biometrics, deep-link validation, and secret management
  • [ ] Build variants, signing, Fastlane, CI/CD, and OTA compatibility
  • [ ] System design, production incidents, and behavioral examples

Series complete

You have completed all five parts of the 719-question React Native interview handbook:

  1. Part 1: JavaScript — questions 1–120
  2. Part 2: React — questions 121–220
  3. Part 3: React Native — questions 221–420
  4. Part 4: Performance & Architecture — questions 421–560
  5. Part 5: Senior & System Design — questions 561–719

Continue practising

Revisit weak topics, implement the coding exercises, and practise answering aloud with truthful examples from your experience.

Top comments (0)