iEnergizer Front end Developer Interview Questions and Answers

Q1. Let var const in JavaScript
Ans. 
var and const are used to declare variables in JavaScript, with var being mutable and const being immutable.
• var is used to declare variables that can be reassigned and updated

• const is used to declare variables that cannot be reassigned or updated

• let is another keyword used for declaring variables, similar to var but with block scope
Answered by AI
Add your answer
Q2. Error boundary and how to handle
Ans. 
Error boundary is a React component that catches JavaScript errors anywhere in a component tree and logs those errors.
• Error boundaries are React components that catch JavaScript errors in their child component tree.

• They are used to prevent the entire UI from crashing due to a single error.

• Error boundaries work like a JavaScript catch {} block, but for components.

• They are defined using componentDidCatch lifecycle method
Answered by AI
Add your answer
Q3. Event.bind and event.property
Add your answer
Q4. Use of never in typescript
Ans. 
The 'never' type in TypeScript represents a value that will never occur.
• Used to indicate that a function will not return a value

• Commonly used in union types to exclude certain values

• Helps catch potential errors at compile time
Answered by AI
Add your answer
Q5. What hooks you have used
Ans. 
I have used React hooks such as useState, useEffect, useContext, and useRef in my projects.
• useState

• useEffect

• useContext

• useRef
Answered by AI
Add your answer
Q6. What is difference between use reducer and use state
Ans. 
useReducer is preferred for managing complex state logic, while useState is simpler for basic state management.
• useReducer is more suitable for managing complex state logic and multiple state values

• useState is simpler and more straightforward for basic state management with a single value

• useReducer allows for more organized and centralized state updates through actions and reducers

• useState is commonly used for simple co
Answered by AI
Add your answer
Q7. Why we use state and props
Add your answer
Q8. How you will pass data from parent to child
Ans. 
Data can be passed from parent to child components in React using props.
• Pass data as props from parent component to child component

• Use state management libraries like Redux or Context API for complex data sharing

• Use callback functions to pass data from child to parent components
Answered by AI
Add your answer
Q9. Write your own custom hook
Ans. 
Custom hook to fetch data from an API
• Create a function that uses the useState and useEffect hooks

• Use the fetch API to make a request to the desired endpoint

• Return the fetched data and loading state in an array
Answered by AI
Add your answer
Q10. Explain map filter and reduce functions
Ans. 
Map, filter, and reduce are higher-order functions in JavaScript used to manipulate arrays.
• Map: Transforms each element in an array and returns a new array with the transformed elements.

• Example: [1, 2, 3].map(num => num * 2) returns [2, 4, 6].

• Filter: Returns a new array with elements that pass a certain condition.

• Example: [1, 2, 3].filter(num => num > 1) returns [2, 3].

• Reduce: Applies a function against an accumulator ...read more
Answered by AI
Add your answer
Q11. How you can clone an object
Ans. 
To clone an object in JavaScript, you can use the spread operator or Object.assign() method.
• Use the spread operator to create a shallow copy of an object: const clonedObj = { ...originalObj };

• Use Object.assign() method to create a shallow copy of an object: const clonedObj = Object.assign({}, originalObj);

• For deep cloning, you can use libraries like Lodash or write a custom function to recursively clone nested objects.
Answered by AI
Add your answer
Q12. What are the three stages of event propagation and how to handle it
Ans. 
Event propagation consists of three stages: capturing, target, and bubbling.
• Capturing phase: Events are captured from the outermost element to the target element.

• Target phase: Event reaches the target element where the event originated.

• Bubbling phase: Events bubble up from the target element to the outermost element.
Answered by AI
Add your answer
Q13. How to handle errors in your react application
Ans. 
Errors in a React application can be handled by using error boundaries, try-catch blocks, and displaying error messages to users.
• Use error boundaries to catch errors in components and display a fallback UI

• Wrap code that may throw errors in try-catch blocks to handle exceptions

• Use libraries like React Error Boundary to easily implement error handling

• Display error messages to users to inform them about the issue and poss
Answered by AI
Add your answer
Q14. Write code to call fake api and display the title where category is “some category “
Add your answer

Q1. Basics of react and JavaScript
Add your answer

An aptitude test is a way for employers to assess a candidate's abilities through a variety of different testing formats. Aptitude tests will test your ability to perform tasks and react to situations at work. This includes problem-solving, prioritisation and numerical skills, amongst other things.

An assignment is the transfer of rights or property. In financial markets, it is a notice to an options writer that the option has been exercised.

Q1. What is react and it's advantage
Ans. 
React is a JavaScript library for building user interfaces.
• React allows for the creation of reusable UI components

• It uses a virtual DOM for efficient rendering

• React is declarative, making it easier to understand and debug code
Answered by AI
Add your answer
Q2. React life cycle
Add your answer
Q3. Questions related to Redux
Add your answer
Q4. Simple app using redux
Ans. 
Creating a simple app using Redux for state management in a front end application.
• Set up Redux store with reducers and actions

• Connect components to Redux store using mapStateToProps and mapDispatchToProps

• Dispatch actions to update state in Redux store

• Use combineReducers to manage multiple reducers
Answered by AI
Add your answer

Q1. Previous project
Add your answer
Q2. Agile process followed in project
Ans. 
Agile process involves iterative development, frequent collaboration, and adaptability to changes.
• Daily stand-up meetings to discuss progress and roadblocks

• Sprints for focused development and testing

• Continuous feedback and iteration based on user input

• Use of tools like Jira or Trello for project management
Answered by AI
Add your answer

Q1. Salary discussion
Add your answer
Q2. Work location discussion
Add your answer

Q1. Reverse the string
Ans. 
Reverse a given string
• Use built-in methods like split(), reverse(), and join() to reverse the string

• Alternatively, loop through the string from end to start and build a new reversed string
Answered by AI
Add your answer

Q1. Reverse given array
Ans. 
Reverse the given array of strings
• Use the reverse() method to reverse the array in place

• Alternatively, you can use a for loop to iterate through the array and build a new reversed array
Answered by AI
Add your answer

Q1. Call api and print data in using react
Ans. 
To call an API and print data in React, use fetch or axios to make the API call and then render the data in the component.
• Use fetch or axios to make the API call in React component

• Store the API response data in state using useState hook

• Render the data in the component using JSX
Answered by AI
Add your answer

Q1. How to handle state in functional components.
Ans. 
State in functional components can be managed using the useState hook in React.
• Use the useState hook to declare state variables in functional components.

• useState returns an array with the current state value and a function to update that value.

• Example: const [count, setCount] = useState(0);

• State variables should be immutable, so always use the setter function to update them.
Answered by AI
Add your answer
Q2. What is event loop in javascript.
Ans. 
Event loop in JavaScript is responsible for handling asynchronous operations by executing callback functions in a non-blocking way.
• Event loop is a mechanism that allows JavaScript to perform non-blocking operations.

• It continuously checks the call stack and the callback queue to see if there are any functions that need to be executed.

• If the call stack is empty, it takes the first function from the callback queue and pus...read more
Answered by AI
Add your answer
Q3. What is hosting in Javascript
Ans. 
Hosting in JavaScript refers to the process of declaring a variable or function before it is used in the code.
• Hosting allows you to use variables and functions before they are declared in the code.

• Variables are hoisted to the top of their scope, while functions are fully hoisted.

• Example: console.log(myVar); var myVar = 10; This will not throw an error because 'myVar' is hoisted to the top of the scope.
Answered by AI
View 1 more answer