CARVIEW |
Introduction to React
Here we will cover all the basic concepts of React like JSX, Virtual Dom, Components and much more.
Question 1
What happens if you call setState
inside render()
?
Updates the state
Leads to maximum call stack size exceeded
It is valid in strict mode only
Causes a re-render normally
Question 2
What will be the output of the following code?
import React, { useState } from 'react';
function App() {
const [count, setCount] = useState(0);
return (
<div>
<h1>{count}</h1>
<button onClick={() => setCount(count + 1)}>Increment</button>
</div>
);
}
export default App;
The counter will increment by 2 each time.
The counter will increment by 1 each time.
The counter will stay the same.
The code will throw an error.
Question 3
What will be the output of the following code snippet?
const element = <div>{true + 1}</div>;
Compilation Error
true1
2
NaN
Question 4
What is the purpose of the Virtual DOM in React?
It improves server performance.
It provides a faster way to update the user interface.
It helps in routing between pages.
It is used for managing application state.
Question 5
Which hook will cause an infinite loop if used without a dependency array?
useState()
useRef()
useEffect()
useMemo()
Question 6
What is the default development server port when running a Vite React app?
3000
5000
5173
8080
Question 7
When using Vite to set up a React project, which command is correct?
vite create react-app my-app
npm create vite@latest my-app --template react
npx create-react-app my-app
npm install react-vite
Question 8
Which of the following JSX expressions is invalid?
{user.name}
{if (loggedIn) { return "Hi"; }}
{items.length > 0 && <List />}
<div>{message}</div>
Question 9
What is the purpose of the ReactDOM.render method?
To manage application state
To compile JSX into JavaScript
To render a React component into the DOM
To define the Virtual DOM
Question 10
What will be the output of this React code?
import React from 'react';
import ReactDOM from 'react-dom';
function App() {
const greeting = "Hello";
return <h1>{greeting} World</h1>;
}
ReactDOM.render(<App />, document.getElementById('root'));
Hello World
{greeting} World
"Hello World"
Error
There are 10 questions to complete.