The top 10 questions asked to me in Front-end mock interview
1 . What is Event in JavaScript ?
Answer : Events are actions or occurrence that happen in the system you are programming, which the system tells you about so you can respond to them in some way if desired. For example, if the user clicks a button on a webpage you might want to respond to that action by displaying an information box.
2 . How Event Handler work in JavaScript?
Answer : Each available event has an event handler, which is a block of code that will be run when the event fires. When any event fires that goes into 3 phase :
Capturing phase — the event goes down from the window to the element.
Target phase — the event reached the target element.
Bubbling phase — the event bubbles up from the element to the window object .
3 . What is the meaning of ES6 .
Answer : ES6 refers to version 6 of the ECMA Script programming language. ECMA Script is the standardized name for JavaScript, and version 6 is the next version after version 5, which was released in 2015.
4 . Tell me some new features of ES6 that does not exist before .
Answer : Well there are some mind blowing features are new in ES6. Like :
We got new keyword let and const for variable declaration, that support block scope .
We got Arrow function which is a nice and shorter way to write function .
We got some extended parameter handling , like default default parameter, rest parameter …
We got ability of Destructuring , now we can extract data from array or objects into variables .
We got the class keyword , which is just syntactic sugar for the old prototypal pattern .
Yeah .. there are some more …
5 . What is difference between Regular function and Arrow function ?
Answer : Well the difference that I would like to mention first is the difference of this value binding.
Arrow function have’t it’s own this value binding , here regular function have his win this binding .
And there is some other difference like Arrow function can’t use as a constructor , and arrow function does not have argument object too etc.
6 . Explain Prototype Chaining in JavaScript ?
Answer: In JavaScript, every object has a prototype and we also know that the prototype of an object is also an object, thus creating nesting of prototypes.
So, JavaScript uses a similar concept for creating an inheritance by chaining multiple instances to prototypes and creating nested prototypes. I will say the level of nesting prototype as is a Prototype chain.
7 . What is pure function in functional programming ?
Answer : If a function give same output for same input and the function does not create any side effect in the program , then the function can be called as a pure function .
8 . Explain the Virtual DOM .
Answer : Virtual DOM is a in memory representation of Browser DOM . There is also a new virtual DOM is being created when any change happen or when component get re-rendered , when any change happen react will not update the Original browser DOM immediately instead it will compare between new virtual DOM with the previous one By it’s Diffing algorithm to find out the exact change of element object , then the minimal change will be updated in the Browser DOM .
9 . What does Higher component function return ?
Answer : Actually Higher order component is a function that take component as argument and return a component at the end before them in the function that could be some modification happen to the input component .
10 . When we need to use context API ?
Answer : When we need to pass props in multiple level of component tree in such case we can use Context API , Context API is a way to enable components to share some data without explicitly passing via each component manually. Hence we can go for alternative solution like Redux or useReducer Hook .
