74 parasta React JS -haastattelun kysymystä ja vastausta

Reagoi haastattelun kysymyksiin ja vastauksiin

Täältä löydät ReactJ:n haastattelukysymykset ja vastaukset niin fuksilaisille kuin kokeneille hakijoille unelmatyönsä saamiseksi.

1) Mikä Reactjs on?

React on JavaScript-kirjasto, joka tekee käyttöliittymien rakentamisesta helppoa. Sen on kehittänyt Facebook.


2) Käyttääkö React HTML?

Ei, se käyttää JSX:ää, joka on samanlainen kuin HTML.

Ilmainen PDF-lataus: React Interview Questions & Answers


3) Milloin React julkaistiin ensimmäisen kerran?

React julkaistiin ensimmäisen kerran maaliskuussa 2013.


4) Kerro minulle kaksi Reactin merkittävintä haittaa

  • Reactin integrointi MVC-kehykseen, kuten Railsiin, vaatii monimutkaisen konfiguroinnin.
  • React vaatii käyttäjiltä tietoa käyttöliittymän integroinnista MVC-kehykseen.

5) Ilmoita ero Real DOM:n ja Virtual DOM:n välillä

Todellinen DOM Virtuaalinen DOM
Se päivitetään hitaasti. Se päivittyy nopeammin.
Se mahdollistaa suoran päivityksen HTML:stä. Sitä ei voi käyttää HTML:n päivittämiseen suoraan.
Se tuhlaa liikaa muistia. Muistin kulutus on pienempi
Vastaa JS-haastattelukysymyksiin
Vastaa JS-haastattelukysymyksiin

6) Mikä on Flux Concept In React?

Facebook käyttää laajalti flux-arkkitehtuurikonseptia asiakaspuolen web-sovellusten kehittämiseen. Se ei ole kehys tai kirjasto. Se on yksinkertaisesti uudenlainen arkkitehtuuri, joka täydentää Reactia ja unidirectional dataflow -konseptia.


7) Määrittele termi Redux kohdassa React

Redux on kirjasto, jota käytetään käyttöliittymän kehittämiseen. Se on JavaScript-sovellusten tilasäilö, jota tulisi käyttää sovellusten tilanhallintaan. Voit testata ja käyttää Reduxilla kehitettyä sovellusta eri ympäristöissä.


8) Mikä on "Store"-ominaisuus Reduxissa?

Reduxissa on ominaisuus nimeltä "Store", jonka avulla voit tallentaa sovelluksen koko tilan yhteen paikkaan. Siksi kaikki sen komponentin tila tallennetaan Storeen, jotta saat säännölliset päivitykset suoraan Storesta. Yhden tilan puu auttaa sinua seuraamaan ajan mittaan tapahtuvia muutoksia ja korjaamaan tai tarkastamaan sovellusta.


9) Mikä on toiminta Reduxissa?

Se on funktio, joka palauttaa toimintaobjektin. Toimintotyyppi ja toimintatiedot tallennetaan aina toimintaobjektiin. Toiminnot voivat lähettää tietoja Kaupan ja ohjelmistosovelluksen välillä. Kaikki Kaupan hakemat tiedot ovat toimien tuottamia.


10) Nimeä Reactin tärkeät ominaisuudet

Tässä on Reactin tärkeitä ominaisuuksia.

  • Mahdollistaa kolmannen osapuolen kirjastojen käytön
  • Aikaa säästävä
  • Nopeampi kehitys
  • Yksinkertaisuus ja koostettavuus
  • Täysin Facebookin tukema.
  • Koodin vakaus ja yksisuuntainen tiedonsidonta
  • Reagoi komponentit

11) Selitä termi valtiottomat komponentit

Tilattomat komponentit ovat puhtaita toimintoja, jotka tekevät DOM-pohjaisiksi vain niille tarjottujen ominaisuuksien perusteella.


12) Selitä React Router

React Router on reitityskirjasto, jonka avulla voit lisätä uusia näyttövirtoja sovellukseesi, ja se myös pitää URL-osoitteen synkronoituna sivulla näkyvän kanssa.


13) Mitkä ovat suositut animaatiopaketit React-ekosysteemissä?

Suositut animaatiopaketit React-ekosysteemissä ovat

  • Reagoi liike
  • React Transition Group

14) Mikä on Jest?

Jest on Facebookin Jasmineen pohjalta luoma JavaScript-yksikkötestauskehys. Se tarjoaa automaattisen pilkan luomisen ja jsdom-ympäristön. Sitä käytetään myös testauskomponenttina.


15) Mikä on lähettäjä?

Välittäjä on sovelluksen keskeinen keskus, jossa vastaanotat toimintoja ja lähetät hyötykuorman rekisteröityihin takaisinsoittoihin.


16) Mitä takaisinsoittotoiminto tarkoittaa? Mikä sen tarkoitus on?

Takaisinsoittotoiminto tulee kutsua, kun setState on valmis ja komponentti hahmonnetaan uudelleen. Koska setState on asynkroninen, minkä vuoksi se ottaa toisen takaisinsoittotoiminnon.


17) Selitä termi korkealuokkainen komponentti

Korkeamman asteen komponentti, joka tunnetaan myös lyhyesti nimellä HOC, on edistynyt tekniikka komponenttilogiikan uudelleenkäyttöön. Se ei ole osa Reactia API, mutta ne ovat kuvio, joka syntyy Reactin sävellysluonteesta.


18) Selitä Esittely-osio

Esittelyosa on segmentti, jonka avulla voit renderöidä HTML:ää. Segmentin kapasiteetti on merkinnöissä edustava.


19) Mitä ovat react js:n rekvisiitta?

Properties tarkoittaa ominaisuuksia, jotka ovat tapa siirtää dataa vanhemmalta lapselle. Voimme sanoa, että propsit ovat vain komponenttien välinen kommunikaatiokanava. Ne liikkuvat aina vanhemmalta lapselle.


20) Mitä hyötyä superavainsanasta on Reactissa?

Super-avainsana auttaa pääsemään ja kutsumaan kohteen ylätason toimintoja.


21) Selitä JavaScriptin tuoton tunnuslause

Tuoton tunnuslausetta käytetään viivyttämiseen ja jatkaa generaattorityö, joka tunnetaan tuottolauseena.


22) Nimeä kaksi React-komponenttityyppiä

Kahden tyyppisiä reagoivia komponentteja ovat:

  • Toimintokomponentti
  • Luokan komponentti

23) Selitä synteettinen tapahtuma React js:ssä

Synteettinen tapahtuma on eräänlainen objekti, joka toimii selainten välisenä kääreenä selaimen natiivin tapahtuman ympärillä. Se auttaa meitä myös yhdistämään eri selainten toimintoja signaali-API:ksi.


24) Mikä on React State?

Se on objekti, joka päättää, miten tietty komponentti renderöityy ja miten se käyttäytyy. Tila tallentaa tiedot, joita voidaan muuttaa React-komponentin elinkaaren aikana.


25) Kuinka voit päivittää tilan react js: ssä?

Komponentin tila voidaan päivittää suoraan tai epäsuorasti.


26) Selitä nuolitoiminnon käyttö Reactissa

Nuolitoiminto auttaa sinua ennustamaan virheiden käyttäytymistä, kun se lähetetään takaisinsoittona. Siksi se estää tämän aiheuttamat bugit yhdessä.


27) Mitkä ovat Reactin elinkaaren vaiheet?

React js:n tärkeitä elinkaaren vaiheita ovat:

  • Alustus
  • Osavaltion/omaisuuden päivitykset
  • Tuhoaminen on Reactin elinkaarta

28) Kerro pääasiallinen ero plussan ja valtion välillä

Suurin ero näissä kahdessa on, että valtio on muuttuva ja plussat muuttumattomat.


29) Selitä React js:n puhtaat komponentit

Puhtaat komponentit ovat nopeimpia komponentteja, jotka voivat korvata minkä tahansa komponentin vain renderillä(). Se auttaa sinua parantamaan koodin yksinkertaisuutta ja sovelluksen suorituskykyä.


30) Millainen tieto ohjaa segmenttiä Reactissa?

Segmenttiä hallitsee pääasiassa kahdenlaisia ​​tietoja: Tila ja Props

  • Tila: Tilatieto, joka muuttuu, meidän on hyödynnettävä tila.
  • Rekvisiitta: Rekvisiitta asetetaan vanhempien toimesta ja ne asetetaan koko osan käyttöiän ajan.

31) Mikä on "create-react-app"?

"create-react-app" on komentorivityökalu, jonka avulla voit luoda yhden perusreact-sovelluksen.


32) Selitä 'avaimen' käyttö reaktioluettelossa

Avainten avulla voit antaa jokaiselle luetteloelementille vakaan identiteetin. Avainten tulee olla ainutlaatuisia.


33) Mitä ovat lasten rekvisiitta?

Lasten rekvisiitta käytetään siirtämään komponentteja muille komponenteille ominaisuuksina. Pääset siihen käyttämällä

{props.children}

34) Selitä virheen rajat?

Virherajat auttavat sinua havaitsemaan Javascript-virheen missä tahansa alikomponenteissa. Niitä käytetään useimmiten virheen kirjaamiseen ja varakäyttöliittymän näyttämiseen.


35) Mitä hyötyä on tyhjistä tunnisteista <> ?

Tyhjiä tunnisteita käytetään Reactissa fragmenttien ilmoittamiseen.


36) Selitä tiukka tila

StrictModen avulla voit suorittaa reaktiokomponenttien tarkistuksia ja varoituksia. Se toimii vain kehitysversiossa. Se auttaa sinua tuomaan esiin ongelmat ilman näkyvää käyttöliittymää.


37) Mitä ovat reagoineet portaalit?

Portaalin avulla voit renderoida lapsia DOM-solmuksi. Luo portaalimenetelmä käytetään siihen.


38) Mikä on konteksti?

Reaktiokonteksti auttaa sinua välittämään tietoja reaktiokomponenttien puun avulla. Se auttaa sinua jakamaan tietoja maailmanlaajuisesti eri reagoivien komponenttien välillä.


39) Mitä hyötyä Webpackista on?

Webpack in on pohjimmiltaan moduulien rakentaja. Sitä käytetään pääasiassa kehitysprosessin aikana.


40) Mikä on Babel React js:ssä?

Babel on JavaScript-kääntäjä, joka muuntaa uusimmat JavaScriptin, kuten ES6, ES7, tavalliseksi vanhaksi ES5 JavaScriptiksi, jonka useimmat selaimet ymmärtävät.


41) Kuinka selain voi lukea JSX-tiedoston?

Jos haluat selaimen lukevan JSX:ää, se JSX-tiedosto tulee korvata JSX-muuntajalla, kuten Babel, ja lähettää sitten takaisin selaimeen.


42) Mitkä ovat tärkeimmät ongelmat MVC-arkkitehtuurin käytössä Reactissa?

Tässä ovat suurimmat haasteet, joita kohtaat käsiteltäessäsi MVC-arkkitehtuuria:

  • DOM-käsittely on melko kallista
  • Suurimman osan ajasta sovellukset olivat hitaita ja tehottomia
  • Pyöreän funktion ansiosta mallien ja ideoiden ympärille on luotu monimutkainen malli

43) Mitä voidaan tehdä, kun lausekkeita on useampi kuin yksi?

Tuolloin monirivinen JSX-lauseke on ainoa vaihtoehto sinulle.


44) Mikä on vähennys?

Vähennys on sovellusmenetelmä valtion käsittelyyn.


45) Selitä termi synteettiset tapahtumat

Se on itse asiassa selaimen välinen kääre selaimen alkuperäisen tapahtuman ympärillä. Näillä tapahtumilla on käyttöliittymä stopPropagation() ja preventDefault().


46) Milloin funktioelementissä tulee käyttää huippuluokan elementtejä?

Jos elementtisi suorittaa vaiheen tai elinkaaren, meidän tulisi käyttää huippuluokan elementtejä.


47) Kuinka voit jakaa elementin jäsennykseen?

Valtion avulla voimme jakaa tietoja.


48) Selitä termi sovitus

Kun komponentin tila tai rekvisiitta muuttuu, rest vertaa renderöityä elementtiä aiemmin renderoituun DOM:iin ja päivittää todellisen DOM:n tarvittaessa. Tätä prosessia kutsutaan sovinnoksi.


49) Miten voit hahmontaa komponentin uudelleen ilman setState()-funktiota?

Voit käyttää forceUpdate()-funktiota minkä tahansa komponentin uudelleenrenderimiseen.


50) Voitko päivittää rekvisiitta reactissa?

Et voi päivittää react js:n rekvisiitta, koska rekvisiitta on vain luku -tilassa. Et myöskään voi muokata vanhemmalta lapselle saatuja rekvisiitta.


51) Selitä termi "rakenneuudistus".

Rakenneuudistus on louhintaprosessi ryhmä esineitä. Kun prosessi on valmis, voit erottaa kunkin objektin erilliseksi muuttujaksi.


52) Voitko päivittää rekvisiittajen arvot?

Rekvisiitin arvoa ei voi päivittää, koska se on muuttumaton.


53) Selitä Asennus ja Irrotus merkitys

  • Elementin kiinnittämistä DCOMiin kutsutaan asennukseksi.
  • Elementin irrottamista DCOM:sta kutsutaan irrotusprosessiksi.

54) Mikä on "prop-types" -kirjaston käyttö?

"Prop-types" -kirjaston avulla voit suorittaa ajonaikaisen tyyppitarkistuksen rekvisiittalle ja vastaaville objekteille viimeaikaisessa sovelluksessa.


55) Selitä reagointikoukut

React-koukkujen avulla voit käyttää State- ja muita React-ominaisuuksia kirjoittamatta luokkaa.


56) Mitä ovat fragmentit?

Voit käyttää fragmenttiavainsanaa ryhmitelläksesi luettelon alikomponenteista ilman, että käytät ylimääräisiä solmuja DOM:iin. Esimerkiksi:

render() {

return (
);
}

57) Mikä on tärkein ero createElementin ja cloneElmentin välillä?

  • React käyttää createElementiä react-elementtien luomiseen.
  • cloneElementiä käytetään elementin kloonaamiseen ja uusien rekvisiittausten välittämiseen.

58) Mitä ovat valvotut komponentit?

Ohjatut komponentit ovat komponentteja, jotka ohjaavat tuloelementtejä.


59) Miksi sinun on käytettävä rekvisiittaa.lapset?

Tämän props.children avulla voit välittää komponentin tietona muille komponenteille.


60) Listaa joitakin react-dom-paketin menetelmiä

Tärkeitä react-dom-pakettien menetelmiä ovat:

  • render()
  • hydraatti()
  • luo portaali()
  • unmountComponentAtNode()
  • findDOMNode()

61) Kuinka voimme tehdä palvelinpuolen renderöinnin Reactissa?

Voimme käyttää reaktiopalvelua palvelinpuolen renderöinnin tekemiseen.


62) Kerro ero getInitialState():n ja constructor():n välillä?

Jos haluat luoda yhden komponentin laajentamalla React. Component', rakentaja auttaa sinua alustamaan tilan. Mutta jos haluat luoda käyttämällä Reat.createClassia. niin sinun tulee käyttää "genInitiaState".


63) Mikä on refs?

Ref ovat DOM-elementtien attribuutteja. Viitteiden ensisijainen tarkoitus on löytää DOM-elementit helposti.


64) Mikä on ComponentWillMount()

ComponentWillMount() tekee API-kutsuja, kun komponentti on aloitettu, ja määrittää arvot tilaan. Soita API-kutsu käyttämällä HttpClient-ohjelmaa, kuten Axios, tai voimme käyttää fetch()-toimintoa käynnistämään AJAX-kutsun.


65) Kuinka tiedot lähetetään myymälään?

Voimme lähettää tiedot toiseen komponenttiin, jonka pitäisi perustua toimintoon, joka tallentaa pääkomponentin.


66) Kuinka pystyt käsittelemään enemmän toimintoja käyttämällä reduxia?

Käytämme samoja toimintoja eri moduuleissa luodaksemme saman komponentin useammassa toimintakulussa.


67) Kuinka voit läikytä vähennysaineet?

Voimme levittää pelastukset tapahtuman toimenpiteiden perusteella. Tämä toiminto tulisi jakaa erillisiin moduuleihin.


68) Nimeä mitkä tahansa viisi ennalta määritettyä prototyyppiä, joita käytetään Reactissa

Tärkeimmät React js:ssä käytetyt prototyypit ovat:

  • numero
  • jono
  • ryhmä
  • objekti
  • elementti

69) Mikä on bindActionsCreatorsin käytön tarkoitus?

BindActionCreator auttaa sinua sitomaan tapahtuman toimintojen välittäjän perusteella HTML-elementtiin.


70) Mikä on REFS Reactissa

Ref on viittaus elementtiin. Sitä tulee välttää useimmissa tapauksissa. Joskus sitä kuitenkin käytetään, kun haluat käyttää DOM:ia tai komponentin esiintymää suoraan.


71) Voidaanko JSX-elementti liittää muihin JSX-komponentteihin?

Kyllä, voit käyttää liitä JSX-elementtiä muiden JSX-komponenttien kanssa, mikä on hyvin samankaltaista kuin sisäkkäiset HTML-elementit.


72) Mikä on Reactin nykyinen vakaa versio?

Reactin nykyinen vakaa versio on versio 17.5


73) Mainitse Reduxin työnkulkuominaisuuksien tärkeä ominaisuus

Redux-työnkulun tärkeitä ominaisuuksia ovat:

  • Nollaa: Auttaa palauttamaan Storen tilan
  • Palauta: Voit palata viimeisimpään sitoutuneeseen tilaan
  • Pyyhkäisy: Kaikki poistotoiminnot, jotka saatat käynnistää vahingossa, poistetaan
  • Sitoutuminen: Auttaa sinua tekemään nykyisestä tilasta alkutilan.

74) Ilmoita ero React JS:n ja React Nativen välillä

React JS on käyttöliittymän rakentamiseen käytettävä avoimen lähdekoodin JavaScript-kirjasto, kun taas React Native on avoimen lähdekoodin mobiilikehys, jonka avulla kehittäjät voivat käyttää Reactia alustoilla, kuten Android ja iOS. Nämä haastattelukysymykset auttavat myös vivassasi (suullinen)

Jaa:

10 Kommentit

  1. Avatar Valmik Jadhav sanoo:

    64) Mikä on ComponentWillMount()

    vastaus on väärä..

  2. kirjoitusvirhe kysymyksessä numero 74 "Rect Native",

    1. Alex Silverman Alex Silverman sanoo:

      Hei, kiitos huomautuksesta. Se on korjattu.

  3. Avatar Paul Fleischer-Djoleto sanoo:

    Hyviä kysymyksiä. En nähnyt toiminnallisia koukkukysymyksiä. Ei edes yksi.

  4. kirjoitusvirhe kysymyksessä numero 62 “getIntialState()”

    1. Kiitos, sisältö on päivitetty.

  5. Avatar Atul Ghisali sanoo:

    Lisää kysymyksiä Reactiin

  6. Avatar anonyymi sanoo:

    Mainitsit rakenneuudistuksen, se ei ole uudelleenjärjestelyä, vaan tuhoamista. Korjaa se

Jätä vastaus

Sähköpostiosoitettasi ei julkaista. Pakolliset kentät on merkitty *