Web / ReactJS Interview questions
Difference between Element and Component.
An Element is a plain object describing what you want to appear on the screen in terms of the DOM nodes or other components. Elements can contain other Elements in their props. Creating a React element is cheap. Once an element is created, it is never mutated.
The object representation of React Element would be as follows:
const element = React.createElement( 'div', {id: 'sign-in-btn'}, 'Sign in' )
The above element renders to the DOM using ReactDOM.render():
<div id='sign-in-btn'>Sign in</div>
a component can be declared in several different ways. It can be a class with a render() method. Alternatively, in simple cases, it can be defined as a function. In either case, it takes props as an input, and returns a JSX tree as the output:
const Button = ({ onSignIn}) => <div id={'sign-in-btn'} onClick={onSignIn}>Sign in</div>
Then JSX gets transpiled to a React.createElement() function tree:
const Button = ({ onSignIn}) => React.createElement( 'div', { id: 'sign-in-btn', onClick: onSignIn }, 'Sign in' )
More Related questions...