Topp 74 React JS-intervjufrågor och svar

Reagera intervjufrågor och svar

Här är ReactJs intervjufrågor och svar för nyblivna såväl som erfarna kandidater för att få sitt drömjobb.

1) Vad är Reactjs?

React är ett JavaScript-bibliotek som gör det enkelt att bygga användargränssnitt. Den har utvecklats av Facebook.


2) Används React HTML?

Nej, den använder JSX, som liknar HTML.

Gratis PDF-nedladdning: Reagera intervjufrågor och svar


3) När släpptes React första gången?

React släpptes första gången i mars 2013.


4) Ge mig två viktigaste nackdelarna med React

  • Att integrera React med MVC-ramverket som Rails kräver komplex konfiguration.
  • React kräver att användarna har kunskap om integrationen av användargränssnitt i MVC-ramverket.

5) Ange skillnaden mellan Real DOM och Virtual DOM

Riktigt DOM Virtuell DOM
Den uppdateras långsamt. Den uppdateras snabbare.
Det tillåter en direkt uppdatering från HTML. Det kan inte användas för att uppdatera HTML direkt.
Det slösar för mycket minne. Minnesförbrukningen är mindre
Reagera JS-intervjufrågor
Reagera JS-intervjufrågor

6) Vad är Flux Concept In React?

Facebook använder i stor utsträckning fluxarkitekturkonceptet för att utveckla klientsidiga webbapplikationer. Det är inte ett ramverk eller ett bibliotek. Det är helt enkelt en ny typ av arkitektur som kompletterar React och konceptet Unidirectional Data Flow.


7) Definiera termen Redux i React

Redux är ett bibliotek som används för frontend-utveckling. Det är en tillståndsbehållare för JavaScript-applikationer som ska användas för applikationens tillståndshantering. Du kan testa och köra en applikation utvecklad med Redux i olika miljöer.


8) Vad är "Store"-funktionen i Redux?

Redux har en funktion som heter "Store" som låter dig spara hela programmets tillstånd på ett ställe. Därför lagras all dess komponents tillstånd i butiken så att du får regelbundna uppdateringar direkt från butiken. Enkeltillståndsträdet hjälper dig att hålla reda på ändringar över tid och felsöka eller inspektera applikationen.


9) Vad är en åtgärd i Redux?

Det är en funktion som returnerar ett åtgärdsobjekt. Åtgärdstypen och åtgärdsdatan lagras alltid i åtgärdsobjektet. Åtgärder kan skicka data mellan butiken och programvaran. All information som hämtas av Butiken produceras av åtgärderna.


10) Nämn de viktiga funktionerna i React

Här är viktiga egenskaper hos React.

  • Låter dig använda tredje parts bibliotek
  • Tids sparande
  • Snabbare utveckling
  • Enkelhet och komponerbar
  • Fullt stöd av Facebook.
  • Kodstabilitet med enkelriktad databindning
  • Reagera komponenter

11) Förklara termen tillståndslösa komponenter

Statslösa komponenter är rena funktioner som gör DOM-baserade enbart på de egenskaper som tillhandahålls dem.


12) Förklara React Router

React Router är ett routingbibliotek som låter dig lägga till nya skärmflöden till din applikation, och den håller även URL synkroniserad med vad som visas på sidan.


13) Vilka är de populära animationspaketen i React-ekosystemet?

Populära animationspaket i React ekosystem är

  • Reagera rörelse
  • Reager Transition Group

14) Vad är skämt?

Jest är ett ramverk för JavaScript-enhetstestning skapat av Facebook baserat på Jasmine. Det erbjuder automatiskt skenskapande och en jsdom-miljö. Det används också som en testkomponent.


15) Vad är dispatcher?

En dispatcher är ett centralt nav i appen där du kommer att ta emot åtgärder och sända nyttolast till registrerade återuppringningar.


16) Vad menas med callback-funktion? Vad är dess syfte?

En återuppringningsfunktion bör anropas när setState har avslutats och komponenten återrenderas. Eftersom setState är asynkron, vilket är anledningen till att den tar in en andra callback-funktion.


17) Förklara termen hög ordningskomponent

En högre ordningskomponent, kort även känd som HOC, är en avancerad teknik för att återanvända komponentlogik. Det är inte en del av React API, men de är ett mönster som kommer från Reacts kompositionsnatur.


18) Förklara presentationssegmentet

En presentationsdel är ett segment som låter dig rendera HTML. Segmentets kapacitet är presentationsmässig i markup.


19) Vad är Props i react js?

Props betyder props, vilket är ett sätt att skicka data från förälder till barn. Vi kan säga att props bara är en kommunikationskanal mellan komponenter. Den rör sig alltid från förälder till barn.


20) Vad är nyttan med ett supersökord i React?

Supernyckelordet hjälper dig att komma åt och anropa funktioner på ett objekts överordnade.


21) Förklara avkastningsfrasen i JavaScript

Avkastningsfrasen används för att fördröja och Fortsätt ett generatorarbete, som är känt som yield catchphrase.


22) Nämn två typer av React-komponenter

Två typer av reaktionskomponenter är:

  • Funktionskomponent
  • Klasskomponent

23) Förklara syntetisk händelse i React js

En syntetisk händelse är en typ av objekt som fungerar som ett webbläsaromslag runt webbläsarens nativa händelse. Det hjälper oss också att kombinera beteenden från olika webbläsare till ett signal-API.


24) Vad är React State?

Det är ett objekt som bestämmer hur en specifik komponent återges och hur den beter sig. Tillståndet lagrar informationen som kan ändras under en React-komponents livstid.


25) Hur kan du uppdatera tillstånd i react js?

Ett tillstånd kan uppdateras på komponenten direkt eller indirekt.


26) Förklara användningen av pilfunktionen i React

Pilfunktionen hjälper dig att förutsäga beteendet hos buggar när de skickas som en återuppringning. Därför förhindrar det bugg som orsakas av detta tillsammans.


27) Vilka är livscykelstegen för React?

Viktiga livscykelsteg för React js är:

  • Initieringen
  • Status/fastighetsuppdateringar
  • Förstörelse är Reacts livscykel

28) Ange huvudskillnaden mellan proffs och stat

Den största skillnaden de två är att staten är föränderlig och proffsen är oföränderliga.


29) Förklara rena komponenter i React js

Rena komponenter är de snabbaste komponenterna som kan ersätta vilken komponent som helst med endast en render(). Det hjälper dig att förbättra kodens enkelhet och applikationens prestanda.


30) Vilken typ av information styr ett segment i React?

Det finns huvudsakligen två typer av information som styr ett segment: State och Props

  • State: Statlig information som kommer att förändras, vi måste använda staten.
  • Rekvisita: Rekvisita ställs in av föräldern och som avgörs under hela livstiden för en del.

31) Vad är "skapa-reagera-app"?

'create-react-app' är ett kommandoradsverktyg som låter dig skapa en grundläggande react-applikation.


32) Förklara användningen av 'nyckel' i reaktionslistan

Med nycklar kan du ge varje listelement en stabil identitet. Nycklarna ska vara unika.


33) Vad är barnrekvisita?

Barnrekvisita används för att överföra komponenter till andra komponenter som egenskaper. Du kan komma åt den genom att använda

{props.children}

34) Förklara felgränser?

Felgränser hjälper dig att fånga Javascript-fel var som helst i de underordnade komponenterna. De används mest för att logga felet och visa ett reservgränssnitt.


35) Vad är användningen av tomma taggar <> ?

Tomma taggar används i React för att deklarera fragment.


36) Förklara strikt läge

StrictMode låter dig köra kontroller och varningar för reaktionskomponenter. Den körs bara på utvecklingsbyggd. Det hjälper dig att lyfta fram problemen utan att göra något synligt användargränssnitt.


37) Vad är reagerade portaler?

Portal låter dig rendera barn till en DOM-nod. CreatePortalmethod används för det.


38) Vad är kontext?

React context hjälper dig att skicka data med hjälp av trädet av react-komponenter. Det hjälper dig att dela data globalt mellan olika reaktionskomponenter.


39) Vad är användningen av Webpack?

Webpack i är i grunden en modulbyggare. Det körs främst under utvecklingsprocessen.


40) Vad är Babel i React js?

Babel, är en JavaScript-kompilator som konverterar senaste JavaScript som ES6, ES7 till vanlig gammal ES5 JavaScript som de flesta webbläsare förstår.


41) Hur kan en webbläsare läsa JSX-fil?

Om du vill att webbläsaren ska läsa JSX, då ska den JSX-filen ersättas med en JSX-transformator som Babel och sedan skicka tillbaka till webbläsaren.


42) Vilka är de största problemen med att använda MVC-arkitektur i React?

Här är de stora utmaningarna du kommer att möta när du hanterar MVC-arkitektur:

  • DOM-hantering är ganska dyrt
  • För det mesta var applikationerna långsamma och ineffektiva
  • På grund av cirkulära funktioner har en komplex modell skapats kring modeller och idéer

43) Vad kan göras när det finns mer än en uttryckslinje?

Vid den tiden är ett JSX-uttryck med flera rader det enda alternativet som finns kvar för dig.


44) Vad är minskningen?

Minskningen är en tillämpningsmetod för att hantera staten.


45) Förklara termen syntetiska händelser

Det är faktiskt en webbläsares omslag runt webbläsarens ursprungliga händelse. Dessa händelser har gränssnittet stopPropagation() och preventDefault().


46) När ska man använda toppklasselementen för funktionselementet?

Om ditt element gör en scen eller livscykel, bör vi använda förstklassiga element.


47) Hur kan du dela ett element i analysen?

Genom att använda staten kan vi dela uppgifterna.


48) Förklara termen avstämning

När en komponents tillstånd eller rekvisita ändras kommer rest att jämföra det renderade elementet med tidigare renderat DOM och kommer att uppdatera den faktiska DOM om det behövs. Denna process är känd som avstämning.


49) Hur kan du återrendera en komponent utan att använda funktionen setState()?

Du kan använda funktionen forceUpdate() för att återrendera vilken komponent som helst.


50) Kan du uppdatera rekvisita som reaktion?

Du kan inte uppdatera rekvisita i react js eftersom rekvisita är skrivskyddade. Dessutom kan du inte ändra rekvisita som tas emot från förälder till barn.


51) Förklara termen "Omstrukturering."

Omstrukturering är utvinningsprocessen av array föremål. När processen är klar kan du separera varje objekt i en separat variabel.


52) Kan du uppdatera värdena på rekvisita?

Det är inte möjligt att uppdatera värdet på rekvisita då det är oföränderligt.


53) Förklara innebörden av montering och demontering

  • Processen att fästa elementet till DCOM kallas montering.
  • Processen att koppla bort elementet från DCOM kallas demonteringsprocessen.

54) Vad är användningen av "prop-types" bibliotek?

Biblioteket 'Prop-types' låter dig utföra runtime-typkontroll för rekvisita och liknande objekt i en nyligen genomförd applikation.


55) Förklara reagera krokar

React hooks låter dig använda State och andra React-funktioner utan att skriva en klass.


56) Vad är fragment?

Du kan använda fragment nyckelord för att gruppera en lista med underordnade komponenter utan att använda några extra noder till DOM. Till exempel:

render() {

return (
);
}

57) Vad är den största skillnaden mellan createElement och cloneElment?

  • createElement används av react för att skapa react-element.
  • cloneElement används för att klona ett element och skicka nya rekvisita till det.

58) Vad är kontrollerade komponenter?

Kontrollerade komponenter är en komponent som styr ingångselementen.


59) Varför behöver du använda props.children?

Denna props.children låter dig skicka en komponent som data till andra komponenter.


60) Lista ner några av metoderna i ett react-dom-paket

Viktiga metoder för react-dom-paket är:

  • framställa()
  • hydrat()
  • createPortal()
  • unmountComponentAtNode()
  • findDOMNode()

61) Hur kan vi göra rendering på serversidan i React?

Vi kan använda reaktionsservrar för att göra renderingen på serversidan.


62) Ange skillnaden mellan getInitialState() och constructor()?

Om du vill skapa en komponent genom att utöka 'React. Component', hjälper konstruktören dig att initiera tillståndet. Men om du vill skapa genom att använda 'Reat.createClass.' då bör du använda 'genInitiaState.'


63) Vad är refs?

Ref är ett attribut för DOM-elementen. Det primära syftet med referenserna är att enkelt hitta DOM-elementen.


64) Vad är ComponentWillMount()

componentWillMount() är att göra API-anrop när komponenten har initierats och konfigurera värdena till tillståndet. För att göra ett API-anrop, använd en HttpClient som Axios, eller så kan vi använda fetch() för att trigga AJAX-anropet.


65) Hur skickar man data i butik?

Vi kan skicka data till en annan komponent som bör baseras på åtgärden som lagrar den överordnade komponenten.


66) Hur kommer du att kunna hantera mer action med hjälp av redux?

För att skapa samma komponent i mer actionflöde använder vi samma funktionalitet i olika moduler.


67) Hur kan du spilla reducerarna?

Vi kan spilla räddningar baserat på händelsens handlingar. Den åtgärden bör delas upp i separata moduler.


68) Nämn fem fördefinierade prototyper som används i React

Den viktigaste prototypen som används i React js är:

  • antal
  • sträng
  • array
  • objektet
  • elementet

69) Vad är syftet med att använda bindActionsCreators?

BindActionCreator hjälper dig att binda händelsen baserat på handlingsavsändaren till HTML-elementet.


70) Vad är REFS i React

Ref är en referens till elementet. Det bör undvikas i de flesta fall. Men ibland används det när du behöver komma åt DOM eller instans av komponenten direkt.


71) Kan JSX-element anslutas till andra JSX-komponenter?

Ja, du kan använda attach JSX-element med andra JSX-komponenter, vilket är mycket likt att kapsla HTML-element.


72) Vilken är den nuvarande stabila versionen av React?

Den nuvarande stabila versionen av React är version 17.5


73) Nämn en viktig funktion i Redux arbetsflödesfunktioner

Viktiga funktioner i Redux arbetsflöde är:

  • Återställ: Hjälper dig att återställa butikens tillstånd
  • Återställ: Låter dig rulla tillbaka till det senast engagerade tillståndet
  • Svep: Alla inaktiveringsåtgärder som du kan aktivera av misstag kommer att tas bort
  • Commit: Hjälper dig att göra det aktuella tillståndet till det ursprungliga tillståndet.

74) Ange skillnaden mellan React JS och React Native

React JS är ett JavaScript-bibliotek med öppen källkod som används för att bygga användargränssnitt, medan React Native är ett mobilt ramverk med öppen källkod som tillåter utvecklare att använda React på plattformar som Android och iOS. Dessa intervjufrågor kommer också att hjälpa dig i din viva (orals)

Dela

10 Kommentarer

  1. Avatar Rishabh säger:

    En bra uppsättning frågor.

  2. Avatar Valmik Jadhav säger:

    64) Vad är ComponentWillMount()

    Svaret är fel..

    1. Alex Silverman Alex Silverman säger:

      Det är rättat..!!

  3. Avatar subhani säger:

    stavfel i fråga nummer 74 "Rect Native,"

    1. Alex Silverman Alex Silverman säger:

      Hej, tack för att du påpekade. Det är rättat.

  4. Avatar Paul Fleischer-Djoleto säger:

    Bra frågor. Jag såg inte funktionella krokfrågor. Inte ens en.

  5. stavfel i fråga nummer 62 "getIntialState()"

    1. Tack, innehållet har uppdaterats.

  6. Avatar Atul Ghisali säger:

    Lägg till fler frågor på React

  7. Du har nämnt omstrukturering det är inte omstrukturering det är förstörande. Vänligen rätta till det

Lämna en kommentar

E-postadressen publiceras inte. Obligatoriska fält är markerade *