Top 74 React JS-interviewspørgsmål og -svar

Reager interviewspørgsmål og svar

Her er ReactJs interviewspørgsmål og svar til friskere såvel som erfarne kandidater til at få deres drømmejob.

1) Hvad er Reactjs?

React er et JavaScript-bibliotek, der gør det nemt at bygge brugergrænseflader. Det er udviklet af Facebook.

---

2) Bruger React HTML?

Nej, den bruger JSX, som ligner HTML.

Gratis PDF-download: React Interview Spørgsmål & Svar

---

3) Hvornår blev React udgivet første gang?

React blev første gang udgivet i marts 2013.

---

4) Giv mig to væsentligste ulemper ved React

• At integrere React med MVC-rammeværket som Rails kræver kompleks konfiguration.
• React kræver, at brugerne har viden om integrationen af ​​brugergrænsefladen i MVC-rammeværket.

---

5) Angiv forskellen mellem Real DOM og Virtual DOM

Rigtig DOM	Virtuel DOM
Den opdateres langsomt.	Den opdaterer hurtigere.
Det tillader en direkte opdatering fra HTML.	Det kan ikke bruges til at opdatere HTML direkte.
Det spilder for meget hukommelse.	Hukommelsesforbruget er mindre

---

6) Hvad er Flux Concept In React?

Facebook bruger i vid udstrækning flux-arkitekturkonceptet til at udvikle klientsidede webapplikationer. Det er ikke et framework eller et bibliotek. Det er simpelthen en ny type arkitektur, der supplerer React og konceptet Unidirectional Data Flow.

---

7) Definer begrebet Redux i React

Redux er et bibliotek, der bruges til frontend-udvikling. Det er en tilstandsbeholder til JavaScript-applikationer, som skal bruges til applikationstilstandsstyring. Du kan teste og køre en applikation udviklet med Redux i forskellige miljøer.

---

8) Hvad er 'Store'-funktionen i Redux?

Redux har en funktion kaldet 'Store', som giver dig mulighed for at gemme hele applikationens tilstand ét sted. Derfor er alle dens komponents tilstand gemt i butikken, så du får regelmæssige opdateringer direkte fra butikken. Enkelttilstandstræet hjælper dig med at holde styr på ændringer over tid og fejlfinde eller inspicere applikationen.

---

9) Hvad er en handling i Redux?

Det er en funktion, som returnerer et handlingsobjekt. Handlingstypen og handlingsdataene gemmes altid i handlingsobjektet. Handlinger kan sende data mellem butikken og softwareapplikationen. Al information hentet af Butikken er produceret af handlingerne.

---

10) Nævn de vigtige funktioner i React

Her er vigtige funktioner i React.

• Giver dig mulighed for at bruge 3. parts biblioteker
• Tidsbesparende
• Hurtigere udvikling
• Enkelhed og komponerbar
• Fuldt understøttet af Facebook.
• Kodestabilitet med envejsdatabinding
• Reaktionskomponenter

---

11) Forklar begrebet statsløse komponenter

Statsløse komponenter er rene funktioner, der gør DOM-baseret udelukkende på de egenskaber, de har fået.

---

12) Forklar React Router

React Router er et routingbibliotek, som giver dig mulighed for at tilføje nye skærmflows til din applikation, og den holder også URL synkroniseret med det, der bliver vist på siden.

---

13) Hvad er de populære animationspakker i React-økosystemet?

Populær animationspakke i React-økosystemet er

• React Motion
• Reager Overgangsgruppe

---

14) Hvad er Jest?

Jest er en JavaScript-enhedstestramme skabt af Facebook baseret på Jasmine. Det tilbyder automatiseret mock-oprettelse og et jsdom-miljø. Det bruges også som en testkomponent.

---

15) Hvad er dispatcher?

En dispatcher er en central hub i app, hvor du vil modtage handlinger og udsende nyttelast til registrerede tilbagekald.

---

16) Hvad menes med tilbagekaldsfunktion? Hvad er dens formål?

En tilbagekaldsfunktion skal kaldes, når setState er færdig, og komponenten genrenderes. Da setState er asynkron, hvilket er grunden til, at den tager en anden tilbagekaldsfunktion.

---

17) Forklar begrebet højordenskomponent

En højere ordens komponent også kort kendt som HOC er en avanceret teknik til genbrug af komponentlogik. Det er ikke en del af React API, men de er et mønster, der udspringer af Reacts kompositoriske natur.

---

18) Forklar præsentationssegmentet

En præsentationsdel er et segment, som giver dig mulighed for at gengive HTML. Segmentets kapacitet er præsentativ i markup.

---

19) Hvad er Props i react js?

Props betyder props, hvilket er en måde at overføre data fra forælder til underordnet komponent. Vi kan sige, at props blot er en kommunikationskanal mellem komponenter. De bevæger sig altid fra forælder- til underordnet komponent.

---

20) Hvad er brugen af ​​et supersøgeord i React?

Supernøgleordet hjælper dig med at få adgang til og kalde funktioner på et objekts forælder.

---

21) Forklar yield catchphrase i JavaScript

Udbyttet slagord bruges til at forsinke og Genoptag en generator arbejde, som er kendt som udbytte catchphrase.

---

22) Nævn to typer React-komponenter

To typer reaktionskomponenter er:

• Funktionskomponent
• Klasse komponent

---

23) Forklar syntetisk hændelse i React js

En syntetisk begivenhed er en type objekt, der fungerer som en cross-browser wrapper omkring browserens native begivenhed. Det hjælper os også med at kombinere forskellige browseres adfærd i signal-API'en.

---

24) Hvad er React State?

Det er et objekt, der bestemmer, hvordan en specifik komponent gengiver, og hvordan den opfører sig. Tilstanden gemmer den information, som kan ændres i løbet af en React-komponents levetid.

---

25) Hvordan kan du opdatere tilstand i react js?

En tilstand kan opdateres på komponenten direkte eller indirekte.

---

26) Forklar brugen af ​​pilefunktionen i React

Pilefunktionen hjælper dig med at forudsige fejls adfærd, når de sendes som et tilbagekald. Derfor forhindrer det fejl forårsaget af dette alt sammen.

---

27) Hvad er livscyklustrinene i React?

Vigtige livscyklustrin for React js er:

• Initialisering
• Stats-/ejendomsopdateringer
• Destruktion er Reacts livscyklus

---

28) Angiv hovedforskellen mellem fordele og stat

Den største forskel på de to er, at staten er foranderlig, og fordele er uforanderlige.

---

29) Forklar rene komponenter i React js

Rene komponenter er de hurtigste komponenter, som kan erstatte enhver komponent med kun en render(). Det hjælper dig med at forbedre kodens enkelhed og applikationens ydeevne.

---

30) Hvilken slags information styrer et segment i React?

Der er hovedsageligt to slags information, der styrer et segment: Stat og Props

• Stat: Statsoplysninger, der vil ændre sig, vi skal bruge staten.
• Rekvisitter: Rekvisitter indstilles af forælderen, og som afregnes gennem hele levetiden af ​​en del.

---

31) Hvad er 'create-react-app'?

'create-react-app' er et kommandolinjeværktøj, som giver dig mulighed for at oprette en grundlæggende reaktionsapplikation.

---

32) Forklar brugen af ​​'nøgle' ​​i reaktionslisten

Taster giver dig mulighed for at give hvert listeelement en stabil identitet. Nøglerne skal være unikke.

---

33) Hvad er rekvisitter for børn?

Børnerekvisitter bruges til at overføre komponent til andre komponenter som egenskaber. Du kan få adgang til det ved at bruge

{props.children}

---

34) Forklar fejlgrænser?

Fejlgrænser hjælper dig med at fange Javascript-fejl hvor som helst i de underordnede komponenter. De bruges mest til at logge fejlen og vise en reserve-brugergrænseflade.

---

35) Hvad er brugen af ​​tomme tags <> ?

Tomme tags bruges i React til at deklarere fragmenter.

---

36) Forklar streng tilstand

StrictMode giver dig mulighed for at køre kontroller og advarsler for reagerende komponenter. Det kører kun på udviklingsbuild. Det hjælper dig med at fremhæve problemerne uden at gøre nogen synlig brugergrænseflade.

---

37) Hvad er reagerede portaler?

Portal giver dig mulighed for at gengive børn til en DOM-node. Opret Portalmetode bruges til det.

---

38) Hvad er kontekst?

React-kontekst hjælper dig med at videregive data ved hjælp af træet af react-komponenter. Det hjælper dig med at dele data globalt mellem forskellige reaktionskomponenter.

---

39) Hvad er brugen af ​​Webpack?

Webpack i er grundlæggende en modulbygger. Det kører hovedsageligt under udviklingsprocessen.

---

40) Hvad er Babel i React js?

Babel, er en JavaScript-compiler, der konverterer nyeste JavaScript som ES6, ES7 til almindelig gammel ES5 JavaScript, som de fleste browsere forstår.

---

41) Hvordan kan en browser læse JSX-fil?

Hvis du vil have browseren til at læse JSX, skal den JSX-fil erstattes med en JSX-transformer som Babel og derefter sende den tilbage til browseren.

---

42) Hvad er de største problemer ved at bruge MVC-arkitektur i React?

Her er de store udfordringer, du vil møde, mens du håndterer MVC-arkitektur:

• DOM-håndtering er ret dyrt
• Det meste af tiden var applikationer langsomme og ineffektive
• På grund af cirkulære funktioner er der skabt en kompleks model omkring modeller og ideer

---

43) Hvad kan man gøre, når der er mere end én udtrykslinje?

På det tidspunkt er et JSX-udtryk med flere linjer den eneste mulighed, der er tilbage for dig.

---

44) Hvad er reduktionen?

Reduktionen er en ansøgningsmetode til håndtering af staten.

---

45) Forklar begrebet syntetiske hændelser

Det er faktisk en cross-browser wrapper omkring browserens oprindelige begivenhed. Disse hændelser har interface stopPropagation() og preventDefault().

---

46) Hvornår skal du bruge topklasseelementerne til funktionselementet?

Hvis dit element udfører en fase eller livscyklus, bør vi bruge elementer i topklasse.

---

47) Hvordan kan du dele et element i parsingen?

Ved at bruge staten kan vi dele dataene.

---

48) Forklar begrebet forsoning

Når en komponents tilstand eller rekvisitter ændres, vil rest sammenligne det renderede element med tidligere gengivet DOM og opdatere den faktiske DOM, hvis det er nødvendigt. Denne proces er kendt som forsoning.

---

49) Hvordan kan du gengive en komponent uden at bruge setState()-funktionen?

Du kan bruge forceUpdate()-funktionen til at genrendere enhver komponent.

---

50) Kan du opdatere rekvisitter som reaktion?

Du kan ikke opdatere rekvisitter i react js, fordi rekvisitter er skrivebeskyttet. Desuden kan du ikke ændre rekvisitter modtaget fra forælder til barn.

---

51) Forklar udtrykket 'Omstrukturering'.

Omstrukturering er udvindingsproces af matrix genstande. Når processen er afsluttet, kan du adskille hvert objekt i en separat variabel.

---

52) Kan du opdatere værdierne af rekvisitter?

Det er ikke muligt at opdatere værdien af ​​rekvisitter, da den er uforanderlig.

---

53) Forklar betydningen af ​​montering og afmontering

• Processen med at fastgøre elementet til DCOM kaldes montering.
• Processen med at adskille elementet fra DCOM'en kaldes afmonteringsprocessen.

---

54) Hvad er brugen af ​​'prop-types' bibliotek?

Biblioteket 'Prop-types' giver dig mulighed for at udføre runtime-typekontrol for rekvisitter og lignende objekter i et nyligt program.

---

55) Forklar reagere kroge

React hooks giver dig mulighed for at bruge State og andre React-funktioner uden at skrive en klasse.

---

56) Hvad er Fragmenter?

Du kan bruge fragment nøgleord til at gruppere en liste over underordnede komponenter uden at bruge nogen ekstra noder til DOM. For eksempel:

render() {

return (
);
}

---

57) Hvad er hovedforskellen mellem createElement og cloneElment?

• createElement bruges af react til at skabe react-elementer.
• cloneElement bruges til at klone et element og give det nye rekvisitter.

---

58) Hvad er kontrollerede komponenter?

Styrede komponenter er komponent, som styrer input-elementerne.

---

59) Hvorfor skal du bruge rekvisitter.børn?

Denne props.children giver dig mulighed for at videregive en komponent som data til andre komponenter.

---

60) Nedskriv nogle af metoderne i en react-dom-pakke

Vigtige metoder til react-dom-pakker er:

• render()
• hydrat()
• createPortal()
• unmountComponentAtNode()
• findDOMNode()

---

61) Hvordan kan vi lave server-side rendering i React?

Vi kan bruge reaktionsserve til at udføre gengivelsen på serversiden.

---

62) Angiv forskellen mellem getInitialState() og constructor()?

Hvis du vil oprette én komponent ved at udvide 'React. Component', hjælper konstruktøren dig med at initialisere tilstanden. Men hvis du vil oprette ved at bruge 'Reat.createClass.' så skal du bruge 'genInitiaState.'

---

63) Hvad er refs?

Ref er en attribut for DOM-elementerne. Det primære formål med refs er let at finde DOM-elementerne.

---

64) Hvad er ComponentWillMount()

componentWillMount() er at foretage API-kald, når komponenten er startet, og konfigurere værdierne til tilstanden. For at foretage et API-kald skal du bruge en HttpClient såsom Axios, eller vi kan bruge fetch() til at udløse AJAX-kaldet.

---

65) Hvordan sender man dataene i butikken?

Vi kan sende dataene til en anden komponent, som skal være baseret på handlingen, der gemmer den overordnede komponent.

---

66) Hvordan vil du være i stand til at håndtere mere handling ved hjælp af redux?

For at skabe den samme komponent i mere handlingsflow, bruger vi den samme funktionalitet i forskellige moduler.

---

67) Hvordan kan du spilde reduktionsrørene?

Vi kan spilde redningerne baseret på begivenhedens handlinger. Denne handling bør opdeles i separate moduler.

---

68) Nævn fem foruddefinerede prototyper, der bruges i React

De vigtigste prototype brugt i React js er:

• nummer
• streng
• matrix
• objekt
• element

---

69) Hvad er formålet med at bruge bindActionsCreators?

BindActionCreator hjælper dig med at binde hændelsen baseret på handlingsformidleren til HTML-elementet.

---

70) Hvad er REFS i React

Ref er en reference til elementet. Det bør undgås i de fleste tilfælde. Nogle gange bruges det dog, når du skal have direkte adgang til DOM eller instans af komponenten.

---

71) Kan JSX-element tilsluttes andre JSX-komponenter?

Ja, du kan bruge attach JSX-element med andre JSX-komponenter, som meget ligner indlejrede HTML-elementer.

---

72) Hvad er den aktuelle stabile version af React?

Den nuværende stabile version af React er version 17.5

---

73) Nævn en vigtig funktion ved Redux workflow-funktioner

Vigtige funktioner i Redux workflow er:

• Nulstil: Hjælper dig med at nulstille butikkens tilstand
• Revert: Giver dig mulighed for at rulle tilbage til den sidste forpligtede tilstand
• Sweep: Alle deaktiveringshandlinger, som du kan udløse ved en fejl, vil blive fjernet
• Commit: Hjælper dig med at gøre den nuværende tilstand til den oprindelige tilstand.

---

74) Angiv forskellen mellem React JS og React Native

React JS er et front-end open source JavaScript-bibliotek, der bruges til at bygge brugergrænseflader, mens React Native er en open source, mobil framework, som giver udviklere mulighed for at bruge React på platforme som Android og iOS. Disse interviewspørgsmål vil også hjælpe i din viva(orals)