Top React Native Interview Questions 2025 | Complete Guide for Developers

In 2025, React Native continues to be one of the most popular frameworks for cross-platform mobile app development. Many leading tech companies are actively hiring skilled React Native developers, and interviews often include challenging questions that test both JavaScript fundamentals and deep knowledge of React Native. In this article, we’ve curated the top React Native interview questions for experienced developers, designed to help you prepare with confidence and stand out in competitive interviews.

1. Can you tell me what will be the output code that I pasted in the chat box?

console.log(name);
console.log(age);
console.log(address);
var name = "Jim";
const age = 30;
let address = "Mumbai";

Answer: For this question, they accept the following explanation from you.

There are a couple of things to note. Firstly, when you try to log the name variable before it is defined, it will result in an undefined being printed to the console. This is because the variable is declared using the var keyword, which gets hoisted to the top of its scope but does not have an initial value assigned at that point.

Secondly, when trying to log the age variable, it will throw a ReferenceError because const variables must be initialized when declared, and they cannot be reassigned or redeclared.

Lastly, when trying to log the address variable, it will also throw a ReferenceError because let the variables are block-scoped and cannot be accessed before they are declared.

2. What is the difference between var, let & const?

• var: JavaScript treats variables declared with var as function-scoped or global-scoped, depending on where you declare them. The engine hoists them to the top of their scope, so you can access them before declaration. You can redeclare and reassign var within the same scope.
• let: Variables declared with let stay block-scoped, meaning you can access them only inside the block where you declare them. JavaScript does not hoist let in a usable way, so you cannot access them before declaration. You can reassign let but cannot redeclare it in the same scope.
• const: Variables declared with const also stay block-scoped. You must initialize them at the time of declaration, and once assigned, you cannot reassign them.

const array = [{name: "First"}, {name: "Second"}]
array[0].name = 0;
console.log(array);

Note: Now,  you will get confused because as per the previous question, const variables are only read-only but in the above code it will update the value of the array. read-only means you cannot assign a new array to a const variable array. so the output will be as follows:

[{name: 0}, {name: "Second"}]

4. What is variable Hoisting?

Variable hoisting in JavaScript means the engine moves variable declarations to the top of their scope during compilation. Only variables declared with var support hoisting. This behavior lets you assign a value before the declaration appears in the code.

a = 5;
console.log(a);
var a;

This prints 5 because:

1. The JavaScript engine sees var a; first by hoisting it to the top of the global scope.

2. Then it processes the assignment a = 5;.

3. Finally, console.log(a); outputs 5.

So even though you wrote the assignment before the declaration, hoisting makes the code work.

As a result, when console.log(a) is executed, it will output 5 to the console, indicating that the value assigned to a is accessible and correctly retrieved.

It’s important to note that while hoisting allows the code to run without errors, it is generally considered best practice to declare variables before using them to improve code readability and maintainability.

5. What are promises?

Promises in Javascript are the way to handle asynchronous operations such as fetching data from the server, reading files, and executing time-consuming tasks. without blocking the execution of the program.

A promise represents the eventual completion or failure of an asynchronous operation and allows you to attach callbacks to handle the result when it becomes available.

1. Pending: The initial state of a promise. It is neither fulfilled nor rejected.
2. Fulfilled: The state of a promise when it successfully completes the asynchronous operation, providing the result value.
3. Rejected: The state of a promise when it encounters an error or fails to complete the asynchronous operation, providing the reason for the failure.

example,

const delay = (duration) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(`Operation completed after ${duration} milliseconds`);
    }, duration);
  });
};

delay(2000)
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.log(error);
  });

6. What is Callback?

A callback is a function that you pass as an argument to another function, and that function later executes it. In JavaScript, developers often use callbacks to handle asynchronous operations or run specific actions after a task or event finishes.

Callbacks let you define custom behavior that runs when a condition is met or when an asynchronous operation completes. They give you control over the program’s flow and allow you to handle results as soon as they are available.

function fetchData(callback) {
  // Simulating an asynchronous operation
  setTimeout(() => {
    const data = { id: 1, name: "John Doe" };
    callback(data);
  }, 2000);
}

function processResult(data) {
  console.log("Processing data:", data);
}

fetchData(processResult);

7. What is an Event loop?

The event loop is the mechanism that continually listens to events & executes them and moves to the next one if the task queue is empty. It ensures that tasks are processed in a non-blocking manner, allowing for efficient handling of events and responsiveness in JavaScript applications. Let’s explore an example to understand how the event loop works:

console.log("Start");

setTimeout(() => {
  console.log("setTimeout");
}, 0);

Promise.resolve().then(() => {
  console.log("Promise");
});

console.log("End");

Here’s how the event loop handles this code:

1. The code starts running, and the console logs “Start”.

2. The program reaches setTimeout. It schedules the callback to run after a minimum delay of 0 ms. That callback will log “setTimeout” when executed.

3. The program reaches Promise.resolve().then(). It schedules a microtask that will run as soon as the call stack becomes empty. That microtask contains the callback that logs “Promise”.

4. The console logs “End”.

5. Now the call stack is empty. The event loop checks the microtask queue.

6. The event loop takes the microtask, places its callback on the call stack, and executes it. The console logs “Promise”.

7. The microtask finishes, and the call stack becomes empty again.

8. The event loop then checks the task queue and finds the setTimeout callback.

9. It places that callback on the call stack and executes it. The console logs “setTimeout”.

10. The setTimeout task finishes.

Output:

Start
End
Promise
setTimeout

Note: Promise microtask, created by Promise.resolve().then(), has higher priority than the setTimeout task. This means that microtasks, such as Promises, are processed before tasks like setTimeout in the event loop.

8. What is MicroTask?

It represents the queue of the task which executes asynchronously with higher priority than regular tasks. When a microtask is created, it is added to the microtask queue. The event loop processes this queue after completing the current task and before moving on to the regular task queue. This means that microtasks have a higher priority and are executed before regular tasks.

Here’s an example to illustrate the concept of microtasks:

console.log('Start');

Promise.resolve().then(() => {
  console.log('Microtask 1');
}).then(() => {
  console.log('Microtask 2');
});

console.log('End');

Start
End
Microtask 1
Microtask 2

function exampleFunction() {
  var x = 10;
  
  if (x > 5) {
    let y = 20;
    const z = 30;
    console.log(x, y, z); // Output: 10 20 30
  }
  
  console.log(x); // Output: 10
  console.log(y); // ReferenceError: y is not defined
  console.log(z); // ReferenceError: z is not defined
}

function outerFunction() {
  var outerVariable = 'Hello';

  function innerFunction() {
    console.log(outerVariable);
  }

  return innerFunction;
}

var closure = outerFunction();
closure(); // Output: Hello

function delay(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function example() {
  console.log('Start');
  
  await delay(2000);
  console.log('After 2 seconds');
  
  await delay(1000);
  console.log('After another 1 second');

  return 'Done';
}

example().then(result => {
  console.log(result);
});

import React, { useState } from 'react';

function ControlledComponent() {
  const [value, setValue] = useState('');

  const handleChange = (event) => {
    setValue(event.target.value);
  };

  return (
    <input type="text" value={value} onChange={handleChange} />
  );
}

import React, { useRef } from 'react';

function UncontrolledComponent() {
  const inputRef = useRef();

  const handleSubmit = (event) => {
    event.preventDefault();
    console.log('Input value:', inputRef.current.value);
  };

  return (
    <form onSubmit={handleSubmit}>
      <input type="text" ref={inputRef} />
      <button type="submit">Submit</button>
    </form>
  );
}