SurveySparrow Senior Front end Developer Interview Questions and Answers

They asked JS basics and Promises, hoisting

Just asked about my work culture, as I worked in startup and product based company, they except me work in Agile and how u will adopt to MNC / service based company culture

It was a hacker coding test mostly javascript questions

Q1. React advance concept
Add your answer
Q2. Context api how to use that
Ans. 
Context API is a feature in React that allows sharing data between components without having to pass props manually.
• Create a context using createContext() method

• Use the Provider component to wrap the components that need access to the context

• Access the context data using the useContext() hook within the consuming components
Answered by AI
Add your answer
Q3. Higher order component
Add your answer

Q1. Mainly introduction, how do you manage a project
Add your answer
Q2. How to debug a code
Ans. 
Debugging a code involves identifying and fixing errors in the code to ensure it runs correctly.
• Use console.log() statements to print out values and check for errors

• Utilize browser developer tools to inspect elements and debug JavaScript

• Step through the code using breakpoints to identify the source of the issue

• Review error messages and stack traces to pinpoint the problem

• Consider using tools like linters and debuggers
Answered by AI
Add your answer
Q3. How to get employee details using group by
Ans. 
Employee details can be retrieved using group by clause in SQL.
• Use GROUP BY clause in SQL to group employee details based on a specific column

• Aggregate functions like COUNT, SUM, AVG can be used with GROUP BY to get summarized employee details

• Example: SELECT department, COUNT(*) as total_employees FROM employees GROUP BY department
Answered by AI
Add your answer

Q1. General intro to the hr person
Add your answer

Q1. JS related questions
Add your answer

Q1. JS related questions
Add your answer

Q1. JS related questions
Add your answer

Q1. What are states and props in React?
Ans. 
States and props are important concepts in React for managing and passing data between components.
• States are mutable data that can be changed within a component

• Props are read-only data passed from parent to child components

• States are managed within a component using setState() method

• Props are accessed using this.props in a component
Answered by AI
Add your answer
Q2. What is Virtual DOM
Ans. 
Virtual DOM is a lightweight copy of the actual DOM that allows for efficient updates and rendering in web applications.
• Virtual DOM is a concept used in frameworks like React to improve performance by minimizing direct manipulation of the actual DOM.

• When changes are made to the virtual DOM, a comparison is done with the actual DOM to determine the minimal updates needed for rendering.

• This process helps reduce the numbe...read more
Answered by AI
Add your answer
Q3. Build a fetch and filter component
Ans. 
A fetch and filter component for data retrieval and manipulation
• Use fetch API to retrieve data from an API endpoint

• Implement a filter function to manipulate the retrieved data based on user input

• Display the filtered data in the UI
Answered by AI
Add your answer

Javascript and React snippets

Q1. Output questions on JavaScript.(Array, hoisting, event)
Add your answer
Q2. Questions on React and Redux
Add your answer

Q1. React JS and Java script
Add your answer

Q1. Basic components communication
Add your answer
Q2. Forms based questions
Add your answer

Q1. Tell me about yourself in terms of journey with your technical skills
Add your answer
Q2. What do you know about Angular and what features have you used in your project?
Add your answer
Q3. What features of HTML have you used?
Ans. 
I have used features like semantic tags, forms, tables, and multimedia elements in HTML.
• Semantic tags like

  ,

• Forms for user input with

  , ,

• Tables for organizing data with

  , ,

  Multimedia elements like ,
Answered by AI
Add your answer
Q4. What is flex in CSS?
Ans. 
Flex in CSS is a layout module that allows elements to align and distribute space within a container.
• Flexbox is used for creating flexible and responsive layouts.

• It allows for easy alignment and distribution of elements within a container.

• Flex properties include flex-direction, justify-content, align-items, and flex-grow.
Answered by AI
Add your answer
Q5. What are various things available in flex? What is hoisting? What are function expressions?
Ans. 
Flex is a CSS layout model that allows responsive and flexible design. Hoisting is a JavaScript behavior where variable and function declarations are moved to the top of their scope. Function expressions are anonymous functions assigned to variables.
• Flex is used for creating responsive and flexible layouts in CSS.

• Hoisting in JavaScript moves variable and function declarations to the top of their scope.

• Function expressi...read more
Answered by AI
Add your answer