Our experts have gathered these React.js MCQs through research, and we hope that you will be able to see how much knowledge base you have for the subject of React.js by answering these multiple-choice questions.
Get started now by scrolling down!
In relation to stateful React components, which of the following statements is correct?
i) React triggers the event handlers in the bubble phase, by default.
ii) For event handlers, CamelCase naming convention is used by React.
iii) React actually attaches event handlers to the DOM nodes themselves.
A.
Only statements i) and ii) are correct.
B.
Only statement ii) is correct.
C.
Both statements i) and iii) are correct.
D.
All statements i), ii) and iii) are correct.
A. React Addons
B. Redux
C. React Motion
D. React Fire
Which of the following options is the correct signature of the unmountComponentAtNodeO method that is used for removing a mounted React component from the DOM and Cleaning its event handlers and state?
A.
ReactDOM.unmountComponentAtNode(container)
B.
ReactDOM.unmountComponentAtNode(container, component)
C.
ReactDOM.unmountComponentAtNode(component, children)
D.
ReactDOM.unmountComponentAtNode(element, container)
A. jsx
B. reactx
C. reactxml
D. jsxml
A. componentDidUpdate()
B. shouldComponentUpdate()
C. componentwillUpdate()
D. componentWillReceiveProps()
E. None of the above.
In the below given code snippet, which of the following functions should be placed in place of "???" so that the values of numbers array are doubled?
const numbers= [2, 4, 6, 8, 10];
const increased = ???((numbers) => number * 2);
console.log(increased);
A.
numbers.map
B.
updateState
C.
numbers.transform
D.
updateState.map.numbers
In relation to React renderIntoDocument() function, which of the following options should be present globally before importing React?
i) window
ii) window.document
iii) window.document.createElement
A.
Only option i).
B.
Only options i) and ii).
C.
Only options ii) and iii).
D.
All options i), ii) and iii).
A. testRenderer.update(element,Options)
B. testRenderer.update(type, element)
C. testRenderer.update(element)
D. testRenderer.update(element, type, Options)
Which of the following statements is! are correct about the ReactJS features?
1. In a ReactJS application, all components have a state.
2. ReactJS virtual DOM can differentiate between a static and a dynamic element.
3. Rendering is possible using a virtual DOM even without dirty checking.
A.
Only1 and 2
B.
Only1 and 3
C.
Only 2 and 3
D.
All 1, 2, and 3
In relation to React test utilities, which of the following options is used for finding all DOM elements of components in the rendered tree that have DOM components with the matching tag name?
A.
scryRenderedDOMComponentsWithTag()
B.
findRenderedDOMComponentWithTag()
C.
findRenderedComponentWithType()
D.
scryRenderedComponentsWithType()
Which of the following methods is first invoked in the component lifecycle's updating phase and is called when a component receives new properties from its parent component?
A.
shouldComponentUpdate()
B.
componentWillUpdate()
C.
componentWillReceiveProps()
D.
render()
While using React, which of the following commands is used for creating a new project?
A.
npm install -a create-react-app
create-react-app example-app
B.
npm install -g create-react-app
create new react-app example-app
C.
npm install -g create-react-app
create-react-app example-app
D.
npm install -a create-react-app
create new app example-app
Which of the following statements is/are correct about ReactJS?
i) It is mandatory to use JSX in React development.
ii) One-way data flow is implemented by React.
A.
Only statement i) is correct.
B.
Only statement ii) is correct.
C.
Both statements i) and ii) are correct.
D.
Neither statement i) nor ii) is correct
A. It is a JavaScript object that is passed from a parent element to a child element but not the other way around.
B. It is a JavaScript object that is passed from a child element to a parent element but not the other way around.
C. It is a JavaScript object that is either passed from a parent element to a child element or from a child element to a parent element.
D. It is used for creating a ReactClass.
A. React.Component
B. React.PureComponent
C. Both options i) and ii).
D. Neither option i) nor ii).
A. getDefaultProps()
B. componentDidMount()
C. componentwillMount()
D. getlnitialState()
A. It is used for controlling the contents of the container node that the user passes in.
B. It is used for modifying the container node.
C. It can be used for returning a reference to the root ReactComponent instance.
A. This.props
B. this.state
C. None of the above.
A. Actions
B. Reducers
C. Root Component
D. Store
A. Mutable state is only updated using the setstate() method.
B. In the React select tag, only a single value can be passed into the value attribute.
C. Both statements a and b are correct.
D. Neither statement a nor b is correct.
Consider the current state as following:
{
isHidden: true,
title: 'React new Example'
}
Suppose the this.setState(nextState) method is called and the current state is updated to the following:
{
isHidden: false
}
Which of the following is the correct way in which React will merge these two states?
A.
{
isHidden: false
}
B.
{
isHidden: true,
title: ' '
}
C.
{
isHidden: true,
title: 'React new Example'
}
D.
{
isHidden: false,
title: 'React new Example'
}
A. Only one parameter is passed and that is state.
B. Two parameters are passed and that are state and action.
C. Only one parameter is passed and that is action.
D. Two parameters are passed and that are state and ReactElement
E. Three parameters are passed and that are state, ReactElement and action.
While using React, keys help in the identification of which of the following options?
i) New added items.
ii) Removed items.
iii) Updated items.
iv) Total number of items.
A.
Only options i) and iv).
B.
Only options i). ii) and iv).
C.
Only options i), ii) and iii).
D.
All options i). ii), iii) and iv).
Which of the following statements is/are correct about the eslint-plugin-jsx-aiiy plugin?
i) It is used for providing AST tinting feedback regarding accessibility issues in the JSX.
ii) This plugin is provided by the Create React App with a subset of activated rules.
A.
Only statement i).
B.
Only statement ii).
C.
Both statements i) and ii).
D.
Neither statement I) nor ii).