interview questions

--- # Mastering React: A Comprehensive Interview Preparation Guide 🚀 ## Understanding React Lifecycle In the world of React, components have a lifecycle that spans from their creation to their eventual removal from the DOM. This lifecycle is crucial for managing state, handling updates, and performing cleanup tasks. Let's delve into the three main phases of the React component lifecycle: ### 1. Mounting Phase This phase covers the initial rendering of a component onto the DOM. Key lifecycle methods include: - **constructor**: Used for initializing state and binding event handlers. - **render**: Responsible for rendering the component's UI. - **componentDidMount**: Executed after the component is mounted onto the DOM. Ideal for tasks like data fetching and initialization. ### 2. Updating Phase During this phase, a component receives new props or state updates, triggering a re-render. Important methods include: - **shouldComponentUpdate**: Decides whether the component should re...

  Q) arr 1 = [1, 2, 3, 4, 5], arr2 = [ "5", 6,7]  compare ans '5' Q)html 5 features. Q)center an element in html without css Q)css preprocessors Q) React Lifelycle method. Q) Set Timeout & setinterval. Q) In urettet how many steryle methods can be und Q) use callback & use memo Q)closure Q) hoisting Q) It we have. 20 items, In each line we need to place only 5 items in row? e.g. flex 1 0 20%  in child, Q) arr1 = [1,2,3,4,5] after every 2 sec print all Value

  Q)current project.  Q) features in React Q) Virtual DOM. Q) pure component. Q)when we use pure component? Q)Lifecycle metheds in Read Q)Diff blw class & function component.. Q)write class comperent? Q)set state synchronous Q)hoots! Q) use callback & usememo Q)Reconciliation Q)Canvas for rectangular box. Q)rectangular box in html & CSS. Q)we need to count no of characters, no of words, no of paragraph, no of love. of a given Sentences Q)html web storage. local & session storage Q)box model , Flexbox. closure promise ES6 feature.  Q)CICD

  Q) React coding for form validation for name, email and phonenumber. Q)Route changes in Reart component Q)use history() Q)use Navigate use ref() Q)Lazy loading. Q)React-lazy loading Q) suspence Q) implement flex in React.

1) bootstrap 2) default position of the web page? 3)usestate () 4) Const? 5)primitive. 6)Json stringify 4 parse 7) fandtion declaration & expression. 8) time complexicity & space complexicity 9) dependency array. 10)use callback  11) bedouncing 12) Navigate, useHistroy 13) use param. 14) Redux 15)can we breate two stores.    16) periting the data of redux. 17) caching? 18) get fetch & git pull. 19) git checkout branchname  20) Typescript?

  Q)HTML structure Q)Js is synchronous. Q) css import Q) react version Q)how to run J.S.. Q)Promise,await asyne. Q)array methods Q) temperal death Zone  Q)let, var, const  Q)ways of writing function.  Q) debugging is easy in array fenition (s) named function  Q) data types Q) Implict type?

  Q) callback function? Q)html Doctype? Q)bootstrap grid-column?  Q)bootstrap Q)Jquery Q) Json Q)Roles & responsibilities. Q)Ongoing project. Q) what's html file?  Q)session token", Q) what is SPA ?

HTML Q)html5 features.  CSS Q)css selectors? Q)box model? Q)display inline & inline block box? Q)z-index? Q)slot,order? Javascript: Q) how to get HTML in js. Q) == vs === Q) spead, rest Q)callback Q)promise Q)closure Reactjs Q) null ? Q) shouldcomponetupdate Q) code splitting? Q) webpack ? Q) JSX? Q)Props? Q)hooks? Q) New hooks in React 18?  Q)context? Q)useMemo & useCallback Q)class vs functional component?  Q)lifecycle phases? Q)useeffect? Q)virtual DOM? Q)babel? Q)state & props? Q) Redux? Q)state management?

 Q)Style how to write styles? There are 3 different ways to write the styles for HTML elements. Inline styles Internal styles External styles <link rel="stylesheet" href="styles.css"> Href? The href attribute specifies the URL of the page the link goes to. Q)Sementic tag? <article> <aside> <details> <figcaption> <figure> <footer> <header> <main> <mark> <nav> <section> <summary> <time> Q) How to center a element without css? Insert the tag <center> in the blank line after the <body> tag. Add </center> in the blank line above the </body> tag.

Q) Reconciliation? Reconciliation is the process through which React updates the DOM. When a component’s state changes, React has to calculate if it is necessary to update the DOM. It does this by creating a virtual DOM and comparing it with the current DOM. In this context, the virtual DOM will contain the new state of the component.    Q) shouldComponentUpdate method return Boolean value ? shouldComponentUpdate method return Boolean value that specifies whether React should continue with the rendering or not. By default value is true. when to use shouldComponentUpdate: when you want that your components do not render when your previous state value is equal to next state value Q)What is Virtual DOM. Explain its concept.? Q) lifecycle methods? Q) which method first between componentdidmount (or) render? Q) how to define context api and consume it? Q) how to useEffect for different lifecycle methods? Q)What are lifecycle methods.? Q) Functional components and React hooks? Q) ...

  Method                       Description getDate()        Returns the day of the month (from 1-31) getDay()          Returns the day of the week (from 0-6) getFullYear()  Returns the year getHours()      Returns the hour (from 0-23) getMilliseconds()         Returns the milliseconds (from 0-999) getMinutes() Returns the minutes (from 0-59) getMonth()    Returns the month (from 0-11) getSeconds() Returns the seconds (from 0-59) getTime()        Returns the number of milliseconds since midnight Jan 1 1970, and a specified date getTimezoneOffset()  Returns the time difference between UTC time and local time, in minutes getUTCDate() Returns the day of the month, according to universal time (from 1-31) getUTCDay()  Returns the day of the week, according to universal time (from 0-6...

1) var fruits=["Water Melon","Plum","Apple","Grapes"]; let newData=[]; fruits.map(function(fruit){     if(fruit.substr(2).length>3){         // console.log(fruit);         newData.push(fruit);     }     return newData; }) console.log(newData); Ans: [ 'Water Melon', 'Grapes' ] 2.    function is_domain(str){         regexp=/^[a-z]+([.\:]{1}{a-z0-9]+)+\.[a-z]{2,6}$/         if(str.match(regexp)){             return true;         }         else return false;              } console.log(is_domain("www.jimbo.5.cn.in")); console.log(is_domain("http://:google.com")); console.log(is_domain("www.n5m.co.uKT")); console.log(is_d...

Q) explain the this keyword with arrow function and normal function To transform the input string "searchBoxKey" into the desired output format "search_Box_Key," you can use JavaScript and regular expressions. Here's one way to achieve this: ```javascript function transformInput(input) {   // Use a regular expression to insert an underscore before each uppercase letter   const output = input.replace(/([A-Z])/g, '_$1').toLowerCase();     // Remove any leading underscore   return output.replace(/^_/, ''); } const input = "searchBoxKey"; const output = transformInput(input); console.log(output); // Outputs: "search_Box_Key" ``` In this code, the `transformInput` function takes the input string and uses the `replace` method with a regular expression to find all uppercase letters and insert an underscore before each of them. It then converts the resulting string to lowercase. Finally, it removes any leading underscore that might ha...