0% found this document useful (0 votes)
2 views

React

The document provides an overview of React.js, a JavaScript library for building user interfaces, highlighting its key features such as component-based architecture, virtual DOM, JSX, and unidirectional data flow. It explains the concept of JSX, the virtual DOM's functionality, and the differences between class and functional components, including lifecycle methods in React. The content is aimed at preparing individuals for React.js-related interview questions.

Uploaded by

amazonha99
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views

React

The document provides an overview of React.js, a JavaScript library for building user interfaces, highlighting its key features such as component-based architecture, virtual DOM, JSX, and unidirectional data flow. It explains the concept of JSX, the virtual DOM's functionality, and the differences between class and functional components, including lifecycle methods in React. The content is aimed at preparing individuals for React.js-related interview questions.

Uploaded by

amazonha99
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 10

SHEKHOBABA.

COM

Part 01

MOST ASKED
REACT JS QUESTIONS
INTERVIEW

Burhan Tahir
@iamshekhobaba
1. WHAT IS REACT.JS ?

React.js is a JavaScript library by


Facebook for building user interfaces,
especially single-page applications. It
enables developers to create large web
apps that efficiently update and render
with data changes, using a component-
based architecture for reusable UI
components.

Burhan Tahir
@iamshekhobaba
2. WHAT ARE THE MAIN
FEATURES OF REACT.JS?
Component-Based Architecture

React allows you to build encapsulated


components that manage their own
state, which can be composed to
create complex UIs.

Virtual DOM

React uses a virtual DOM to optimize


rendering. When the state of an object
changes, React updates only the
specific parts of the DOM instead of
the entire DOM, improving performance.

Burhan Tahir
@iamshekhobaba
2. WHAT ARE THE MAIN
FEATURES OF REACT.JS?
JSX

React uses JSX, a syntax extension


that allows you to write HTML
elements in JavaScript and place them
in the DOM.

Unidirectional Data Flow

React follows a unidirectional data flow


where data is passed from parent to
child components, making it easier to
debug and understand.

Burhan Tahir
@iamshekhobaba
WHAT IS JSX?

JSX stands for JavaScript XML. It is a


syntax extension for JavaScript that
looks similar to HTML. JSX is used in
React to describe the UI structure.
With JSX, you can write HTML-like
code directly within JavaScript, which
is then transformed into React
elements by Babel.

Burhan Tahir
@iamshekhobaba
WHAT IS THE VIRTUAL DOM, AND
HOW DOES IT WORK IN REACT?
The Virtual DOM is a lightweight copy
of the real DOM maintained in memory
by React.

When a component's state changes,


React creates a new Virtual DOM tree,
compares it with the previous one (a
process called reconciliation), and
updates only the parts of the actual
DOM that have changed.

This approach enhances performance


by reducing the number of direct
manipulations to the actual DOM.

Burhan Tahir
@iamshekhobaba
WHAT ARE REACT COMPONENTS?

React components are the building


blocks of a React application. They are
reusable, isolated pieces of code that
define how a part of the UI should
appear. Components can be class-
based (using ES6 classes) or functional
(using functions). They can manage
their own state and lifecycle.

Burhan Tahir
@iamshekhobaba
WHAT IS THE DIFFERENCE BETWEEN
A CLASS COMPONENT AND A
FUNCTIONAL COMPONENT?
Class Components: Class components are
ES6 classes that extend from
React.Component and can hold and
manage their own state. They also have
lifecycle methods like componentDidMount,
componentDidUpdate, etc.

Functional Components: Functional


components are simpler and are just
JavaScript functions that take props as
arguments and return JSX. They were
stateless until React introduced hooks,
which allowed functional components to
manage state and side effects.

Burhan Tahir
@iamshekhobaba
WHAT ARE THE LIFECYCLE
METHODS IN REACT?
Lifecycle methods are special methods in
class components that get called at
different stages of a component's lifecycle,
such as when the component is being
mounted to the DOM, updated, or
unmounted. Key lifecycle methods include:

componentDidMount: Called once,


after the component is mounted.
componentDidUpdate: Called after the
component has been updated.
componentWillUnmount: Called right
before the component is removed
from the DOM.

Burhan Tahir
@iamshekhobaba

You might also like