29 Front End-utviklerintervju spørsmål og svar (2023)

Hvorfor trenger du å vite alle de vanligste spørsmålene og svarene på front-end-utviklerintervjuer?

I dagens teknologiverden bør en front-end-utvikler være teknisk kunnskapsrik og dyktig til å oversette klientbehov til kreative og interaktive nettapplikasjoner og mobilapper hvor utviklere trenger spesifikke ferdigheter for sistnevnte. Å få disse ferdighetene krever front-end utviklingstrening. I dag er mange toppbedrifter ute etter å ansette for front-end utviklerstillinger slik at disse utviklerne kan hjelpe dem med å bygge elegante, intuitive, responsive og interaktive brukergrensesnitt som fungerer godt på ulike enheter. Men problemet er at de fleste kandidater blir forvirret eller ikke er sikre på hvilken type intervjuspørsmål de må forberede seg på et front-end utviklingsintervju som til slutt vil hjelpe dem med å bli ansatt.

Det er ganske enkelt å oppdage forskjellige praksis spørsmål, men det er vanskelig å velge de rette blant disse alternativene.

Å vite de riktige spørsmålene er avgjørende for alle som ønsker å få tak i et front-end utviklerjobbintervju.

Enten du er nybegynner eller en erfaren kandidat, sjekk ut listen over de viktigste spørsmålene og svarene på front-end-utviklerintervju nedenfor. Denne artikkelen vil hjelpe deg å bli kjent med begge spørsmålene og være forberedt, slik at du vil lykkes i intervjuet ditt.

Front-End utviklerintervju Spørsmål og svar

La oss se hvilke viktige front-end utviklerintervju man trenger å forberede seg på.

1. Hva er de tekniske og tilleggsferdighetene som trengs for å være en front-end utvikler?

En god front-end-utvikler må ha kunnskap om:

• HTML
• CSS
• jQuery
• Javascript

Bortsett fra de ovennevnte tekniske ferdighetene, bør en front-end-utvikler ha de nedenfor nevnte "gode å ha" -ferdighetene:

• Erfaring i et av de mest populære Content Management Systems (CMS) som WordPress, Drupal og Joomla og til og med de nyere som Ghost
• Kunnskap om testing i flere nettlesere
• Kunnskap om testing av flere enheter
• Kunnskap om OOPS og PHP.
• Grunnleggende kunnskap om SEO og verktøy som Adobe Photoshop, og CSS3 og HTML5, og ulike Javascript -teknologier som native script, Angular, som brukes til å presentere nettbasert informasjon for sluttbrukere.

2. Forklar hvordan du vil sikre at webdesignet ditt er brukervennlig, og hvilke skritt vil du ta for å oppnå dette?

En front-end-utvikler må kommunisere ofte og jobbe sammen med UX-designere (User Experience) for å forestille seg og konseptualisere en nettside som utformer en brukersentrisk opplevelse, teste nettsiden med brukere for å sikre optimal design og sikre at nettsiden eller nettstedet er optimalisert for mobilsurfing. Hvis vi ikke har en UX-designer for hånden, vil vi kjøre brukertesting eller brukeropptak som Hotjar for å sikre at det ikke er noen UX-blokkere i nettdesignet eller nettappen vi utvikler.

3. Beskriv kaffe script?

CoffeeScript er et lite programmeringsspråk som kompileres til JavaScript. Det er et forsøk på å bruke de beste delene av Javascript på en enkel måte. Det hjelper også utviklere å skrive JavaScript-kode bedre ved å presentere brukeren med en mer konsistent syntaks og skjørt den uvanlige naturen til JavaScript-språket.

4. Forklar hva som er den klare egenskapen i CSS?

De clear egenskap spesifiserer på hvilke sider av et element flytende elementer som ikke får flyte. Den brukes når du ikke vil at et element skal vikles rundt et annet element, for eksempel en flottør.

5. Beskriv når vil du bruke CSS float-eiendommen?

Float brukes når du trenger at et element på websiden din skal skyves til høyre eller venstre og få andre elementer til å vises rundt den.

6. Hva er en tilbakeringingsfunksjon?

En tilbakeringingsfunksjon er en funksjon som overføres til en annen funksjon som et argument, som deretter påkalles inne i den ytre funksjonen for å fullføre en slags rutine eller handling.

7. Hvordan strukturerer du kildekoden slik at den blir enkel å bruke av kollegene?

En front-end-utvikler må bruke vanlige standarder og forklare bruken av kodeorganisering og kommentarer. De må forklare hvordan de bruker notater i programmeringsprosessen for å forklare trinnene de har tatt, og dermed sikre effektiviteten av forståelse blant samarbeidspartnere. Hvis det er standarder for å kommentere eller dokumentere kode i selskapet, må de følge disse standardene.

8. Forklar hva som er forskjellen mellom klasse og prototypisk arv i Javascript?

Arv i JavaScript er forskjellig fra de fleste andre programmeringsspråk. Objektsystemet i JavaScript er prototypebasert, ikke klassebasert. Objekter i JavaScript er bare en samling av et navn (nøkkel) og verdipar. Når det gjelder arv, har JavaScript bare en konstruksjon: objekter. Hvert objekt har en privat eiendom som inneholder en lenke til et annet objekt som kalles prototypen.

9. Kan du forklare forskjellen mellom synlighet: skjult; og vis: ingen?

Med synlighet: Skjult objektet er ikke synlig, men bruker det originale rommet. Med skjerm: Ingen; objektet er skjult og tar ikke plass.

10. Forklar hva er forskjellen mellom et vertsobjekt og et innfødt objekt i Javascript?

Vert objekter som er objekter levert av et bestemt miljø. Innfødte objekter er standard innebygde objekter definert av Javascript. 

11. Hva er forskjellen mellom XHTML og HTML?

HTML og XHTML er begge markeringsspråk der websider og nettsteder er skrevet. Hovedforskjellen mellom de to er at HTML-syntaks er SGML-basert mens XHTML-syntaks er XML-basert.

12. Forklar hvordan variabler er forskjellige i CoffeeScript sammenlignet med JavaScript?

Før vi bruker en variabel i JavaScript, må vi erklære og initialisere den (tilordne verdi). I motsetning til JavaScript, er det ikke nødvendig å erklære den ved hjelp av var-nøkkelordet mens du oppretter en variabel i CoffeeScript. Vi oppretter ganske enkelt en variabel bare ved å tilordne en verdi til en bokstav som vist nedenfor.

13. Kan du fortelle oss hva er fordelene med CoffeeScript i forhold til JavaScript?

• Lett forståelig - CoffeeScript er en stenografisk form for Javascript, syntaksen er ganske enkel i forhold til JavaScript. Ved hjelp av CoffeeScript kan vi skrive rene, klare og lett forståelige koder.

• Skriv less gjøre mer - For en enorm kode i JavaScript trenger vi relativt mye less antall linjer med CoffeeScript.

• Pålitelig - CoffeeScript er et trygt og pålitelig programmeringsspråk for å skrive dynamiske programmer.

• Lesbar og vedlikeholdbar - CoffeeScript gir alias for de fleste operatører som gjør koden lesbar. Det er også enkelt å vedlikeholde programmene skrevet i CoffeeScript.

• Klassebasert arv - JavaScript har ikke klasser. I stedet for dem gir det kraftige, men forvirrende prototyper. I motsetning til JavaScript kan vi opprette klasser og arve dem i CoffeeScript. I tillegg til dette, gir det også forekomst og statiske egenskaper samt mixins. Den bruker JavaScripts opprinnelige prototype for å lage klasser.

• Ingen var nøkkelord - Det er ikke nødvendig å bruke var nøkkelordet for å lage en variabel i CoffeeScript, slik at vi kan unngå utilsiktet eller uønsket retardasjon av omfanget.

• Unngår problematiske symboler - Det er ikke nødvendig å bruke de problematiske semikolonene og parentesen i CoffeeScript. I stedet for krøllete bukseseler, kan vi bruke mellomrom for å skille mellom blokkodene som funksjoner, sløyfer osv.

• Omfattende biblioteksstøtte - I CoffeeScript kan vi bruke bibliotekene til JavaScript og omvendt. Derfor har vi tilgang til et rikt sett med biblioteker mens vi jobber med CoffeeScript. 

14. Forklar hva er forskjellen mellom en GET- og POST-forespørsel?

Både en GET- og POST-metode brukes til å overføre data fra klient til server i HTTP-protokollen. Hovedforskjellen mellom POST og GET-metoden er at GET bærer forespørselsparametere som er lagt til i URL-strengen mens en POST bærer forespørselsparameter i meldingsdelen, noe som gjør det til en sikrere måte å overføre data fra klient til server i HTTP.

15. Kan du fortelle oss når vil du bruke CSS clear-egenskapen?

CSS clear-egenskapen brukes når du vil at et element til venstre eller høyre for `flytende element ikke skal vikles rundt det.

16. Beskriv hva som er forskjellen mellom null og udefinert?

I JavaScript, undefined betyr at en variabel er deklarert, men som ennå ikke har fått noen verdi. null er en oppdragsverdi. Den kan tilordnes en variabel som en representasjon av ingen verdi.

17. Forklar viktigheten av HTML DOCTYPE?

DOCTYPE er en instruksjon til nettleseren om versjonen av markeringsspråket siden er skrevet i. DOCTYPE-erklæringen må være det første i HTML-dokumentet ditt før stikkord. Doktypeerklæringen peker på en dokumenttypedefinisjon (DTD). Doktypen gir regler for markeringsspråk, slik at en nettleser kan tolke innholdet riktig.

18. Forklar forskjellen mellom informasjonskapsler, øktlagring og lokal lagring?

Informasjonskapsler lar programmer lagre data i en klients nettleser. Session storage-egenskapen lar programmer lagre data til nettleservinduet lukkes, men disse holdes vanligvis på servernivå (ikke på nettleseren). Lokal lagringsegenskap lar applikasjoner lagre data uten en utløpsdato.

19. Beskriv hva som er et tråd-lokalt objekt i Python Flask?

Et tråd-lokalt objekt er et objekt som er lagret i en dedikert struktur, festet til gjeldende tråd-id. Flask bruker interne trådtråder internt, slik at brukeren ikke trenger å sende objekter fra funksjon til funksjon i en forespørsel om å holde seg trådsikker. Trådens lokale lagring utføres innenfor gjeldende tråd. Denne tilnærmingen er nyttig, men den trenger en gyldig forespørselskontekst for avhengighetsinjeksjon eller når du prøver å gjenbruke kode som bruker en verdi knyttet til forespørselen.

20. Forklar syntaksen og hvordan du bruker en funksjon som klasse?

function functionName(name){
this.name = name;
}
// Creating an object
var variable_name = new functionName(“Collective”);
console.log(variable_name.name); //Collective

21. Hva er lat belastning?

Lazy loading (også kalt on-demand loading) er en optimaliseringsteknikk for online innhold, det være seg et nettsted eller en webapp. I stedet for å laste hele websiden eller bildene og gjengi den til brukeren på en gang som ved masseinnlasting, hjelper konseptet med lat lasting med å laste inn bare den nødvendige delen og forsinke den gjenværende, til den er nødvendig av brukeren (for eksempel når brukeren blar til ønsket bilde).

22. Forklar forskjellen mellom klasser og ID-er?

Klasser og ID-velgere, begge brukes som kroker for CSS-stiler. ID-er brukes ofte til å style elementer som bare vises en gang på en side, for eksempel en forekomst av en navigasjonsmeny. Klasser brukes til å style forskjellige elementer på samme måte, som for eksempel tilstedeværelse av lenker, knapper, skjemaer, tekst, etc. 

23. Hva er begivenhetsdelegasjon?

Hendelsesdelegering er prosessen med å bruke hendelsesformidling til å håndtere hendelser på et høyere nivå i DOM i stedet for elementet som hendelsen stammer fra. Det lar deg unngå å legge til hendelseslyttere til bestemte noder; i stedet kan du legge til en enkelt hendelseslytter til et overordnet element. 

24. Hvordan kan du øke sidens ytelse?

• Rydd opp i HTML-dokumentet
• Reduser eksterne HTTP-forespørsler og eksterne skript
• Bruk komprimert og mindre bilde
• Utsett JavaScript til bunnen av siden
• Bruk de nyeste versjonene av kode som PHP
• Miniser CSS, JavaScript, HTML
• Bruk CDN og Caching
• GZip eller Brotli Komprimer innhold
• Utnytt hurtigbufring av nettleseren 

25. Hva er Ajax?

AJAX (Asynchronous JavaScript and XML) tillater applikasjoner å transportere data til / fra en server asynkront uten å oppdatere siden. Dette betyr at det sannsynligvis vil oppdatere deler av en webside, uten å laste hele siden på nytt. For eksempel kommer de nye Gmail-meldingene dine og blir merket som nye, selv om du ikke har oppdatert nettsiden. 

26. Hva er forskjellen mellom Block, Inline, Inline-block og Box-dimensionering?

• Inline er standard. For eksempel: Et innebygd element er .
• Blokk viser som et blokkelement, for eksempel eller .
• Inline-block viser et element som en inline-level block container.
• Box-størrelse viser nettleserens størrelsesegenskaper.

27. Hva er eventbobling?

Hendelsesbobling er en type begivenhetsformering der hendelsen først utløses på det dypeste målelementet. Det fører til at alle hendelser i underordnede noder automatisk overføres til foreldrenodene. Fordelen med denne metoden er ytelse fordi koden bare krever å krysse DOM-treet en gang.

28. Forklar hva som er en lukking? 

A nedleggelse er en kombinasjon av en funksjon samlet (vedlagt) med referanser til dens omgivende tilstand ( leksikalske miljø). En lukking gir deg tilgang til en ytre funksjons omfang fra en indre funksjon. I JavaScript opprettes lukkinger hver gang en funksjon opprettes, på funksjonstidspunktet. 

29. Forklar hvordan du håndterer nettleserspesifikk stilkompatibilitet?

Det er flere måter å omgå dette på. Den enkleste måten å gå videre på er å bruke en betinget uttalelse i HTML-koden. På denne måten kan du gjenkjenne nettleseren og laste inn et eksternt stilark.

konklusjonen

Dette er noen av de viktigste front-end-utviklerintervjuspørsmålene og svarene. De vil hjelpe deg med forberedelsene til et jobbintervju i front-end-utvikling. Hvis vi har gått glipp av andre viktige front-end-utviklerspørsmål, gi oss beskjed i kommentarene nedenfor.

om forfatteren

Forfatter: David Attardnettside: https://www.linkedin.com/in/dattard/E-post: david@collectiveray. Med

David har jobbet i eller rundt den elektroniske / digitale industrien de siste 18 årene. Han har lang erfaring innen programvare- og webdesignindustrien ved å bruke WordPress, Joomla og nisjer rundt dem. Som digital konsulent er hans fokus på å hjelpe bedrifter med å få et konkurransefortrinn ved å bruke en kombinasjon av deres nettside og digitale plattformer som er tilgjengelige i dag.