29 spørgsmål og svar om frontend-udviklerinterview (2021)

top jobsamtale spørgsmål

Hvorfor skal du kende alle de mest almindelige spørgsmål og svar på front-end-udviklerinterview?

I nutidens teknologiverden skal en front-end-udvikler være teknologisk kyndig og dygtig til at oversætte kundebehov til kreative og interaktive webapplikationer. At få disse færdigheder kræver front-end udviklingstræning. I dag søger mange topvirksomheder at ansætte front-end-udviklerpositioner, så disse udviklere kan hjælpe dem med at opbygge elegante, intuitive, lydhøre og interaktive brugergrænseflader, der fungerer godt på forskellige enheder. Men problemet er, at de fleste kandidater bliver forvirrede eller ikke er sikre på, hvilken type interviewspørgsmål de skal forberede sig på et front-end-udviklingssamtale, som i sidste ende vil hjælpe dem med at blive ansat.

Det er ret simpelt at finde forskellige praksis spørgsmål, men det er svært at vælge de rigtige blandt disse muligheder.

At kende de rigtige spørgsmål er afgørende for alle, der ønsker at få et front-end udviklerjobsinterview.

Uanset om du er en nybegynder eller en erfaren kandidat, skal du tjekke listen over top-front-end-spørgsmål og -spørgsmål og svar nedenfor. Denne artikel hjælper dig med at lære begge spørgsmål at kende og være forberedt, så du får succes i dit interview.

Indhold[show]

Front-End-interviewspørgsmål og svar til udviklere

Lad os se, hvilke vigtige front-end-udviklerinterviews spørgsmål man har brug for at forberede sig på.

1. Hvad er de tekniske og yderligere færdigheder, der er nødvendige for at være en front-end-udvikler?

En god front-end-udvikler skal have en fungerende viden om:

  • HTML
  • CSS
  • jQuery
  • Javascript

Bortset fra de ovennævnte tekniske færdigheder, bør en front-end-udvikler have de nedennævnte "gode til at have" færdigheder:

  • Erfaring i et af de mest populære Content Management Systems (CMS) som WordPress, Drupal og Joomla og endda de nyere som Ghost
  • Kendskab til testning på tværs af browsere
  • Kendskab til testning på tværs af enheder
  • Viden om OOPS og PHP.
  • Grundlæggende viden om SEO og værktøjer som Adobe Photoshop og CSS3 og HTML5 og forskellige Javascript -teknologier såsom native script, Angular, der bruges til at præsentere webbaserede oplysninger til slutbrugere.

2. Forklar, hvordan du vil sikre, at dit webdesign er brugervenligt, og hvilke skridt vil du tage for at opnå dette?

En front-end-udvikler har brug for at kommunikere ofte og arbejde sammen med UX (User Experience) -designere for at forestille sig og konceptualisere en webside, der designer en brugercentreret oplevelse, teste hjemmesiden med brugerne for at sikre et optimalt design og sikre, at websiden eller webstedet er optimeret til browsing på mobiltelefoner.

3. Beskriv kaffe script?

CoffeeScript er et lille programmeringssprog, der kompileres til JavaScript. Det er et forsøg på at bruge de bedste dele af Javascript på en enkel måde. Det hjælper også udviklere med at skrive JavaScript-kode bedre ved at præsentere brugeren for en mere ensartet syntaks og omslutte JavaScript-sprogets usædvanlige natur.

4. Forklar, hvad der er den klare egenskab i CSS?

 clear egenskab angiver, på hvilke sider af et element flydende elementer ikke må flyde. Det bruges, når du ikke ønsker, at et element skal vikles rundt om et andet element, såsom en float.

5. Beskriv hvornår ville du bruge CSS float-ejendommen?

Float bruges, når du har brug for, at et element på din webside skal skubbes til højre eller venstre og få andre elementer til at vises omkring det.

6. Hvad er en tilbagekaldsfunktion?

En tilbagekaldsfunktion er en funktion, der overføres til en anden funktion som et argument, som derefter påberåbes inde i den ydre funktion for at fuldføre en slags rutine eller handling.

7. Hvordan strukturerer du din kildekode, så den er nem at bruge af dine kolleger?

En front-end-udvikler skal bruge fælles standarder og forklare deres brug af kodeorganisation og kommentarer. De har brug for at forklare, hvordan de bruger noter i deres programmeringsproces til at forklare de trin, de har taget, og dermed sikre effektiviteten af ​​forståelsen blandt samarbejdspartnere.

8. Forklar hvad er forskellen mellem klasse- og prototypearv i Javascript?

Arv i JavaScript adskiller sig fra de fleste andre programmeringssprog. Objektsystemet i JavaScript er prototype-baseret, ikke klassebaseret. Objekter i JavaScript er kun en samling af et navn (nøgle) og værdipar. Når det kommer til arv, har JavaScript kun en konstruktion: objekter. Hvert objekt har en privat ejendom, der indeholder et link til et andet objekt, der kaldes dets prototype.

9. Kan du forklare forskellen mellem synlighed: skjult; og display: ingen?

Med synlighed: Skjult objektet er ikke synligt, men bruger det originale rum. Med skærm: Ingen; objektet er skjult og tager ikke plads.

10. Forklar hvad er forskellen mellem et værtsobjekt og et oprindeligt objekt i Javascript?

Værtsobjekter, der er objekter leveret af et bestemt miljø. Indfødte objekter er standardindbyggede objekter defineret af Javascript. 

11. Hvad er forskellen mellem XHTML og HTML?

HTML og XHTML er begge markeringssprog, hvor websider og websteder er skrevet. Hovedforskellen mellem de to er, at HTML-syntaks er SGML-baseret, mens XHTML-syntaks er XML-baseret.

12. Forklar, hvordan variabler adskiller sig i CoffeeScript sammenlignet med JavaScript?

I JavaScript skal vi, før vi bruger en variabel, erklære og initialisere den (tildele værdi). I modsætning til JavaScript er det ikke nødvendigt at erklære det ved hjælp af var-nøgleordet, mens der oprettes en variabel i CoffeeScript. Vi opretter simpelthen en variabel bare ved at tildele en værdi til en bogstavelig som vist nedenfor.

13. Kan du fortælle os, hvad er fordelene ved CoffeeScript i forhold til JavaScript?

  • Let forståeligt - CoffeeScript er en stenografisk form for JavaScript, dens syntaks er ret enkel sammenlignet med JavaScript. Ved hjælp af CoffeeScript kan vi skrive rene, klare og let forståelige koder.

  • Skrive less gør mere - For en enorm kode i JavaScript har vi brug for forholdsvis meget less antal linjer af CoffeeScript.

  • Pålidelig - CoffeeScript er et sikkert og pålideligt programmeringssprog til at skrive dynamiske programmer.

  • Læsbar og vedligeholdelig - CoffeeScript giver alias for de fleste operatører, hvilket gør koden læsbar. Det er også let at vedligeholde de programmer, der er skrevet i CoffeeScript.

  • Klassebaseret arv - JavaScript har ikke klasser. I stedet for dem giver det kraftige, men forvirrende prototyper. I modsætning til JavaScript kan vi oprette klasser og arve dem i CoffeeScript. Ud over dette giver det også instans- og statiske egenskaber samt mixins. Det bruger JavaScript's native prototype til at oprette klasser.

  • Intet var nøgleord - Det er ikke nødvendigt at bruge var nøgleordet til at oprette en variabel i CoffeeScript, så vi kan undgå utilsigtet eller uønsket deceleration af omfanget.

  • Undgår problematiske symboler - Det er ikke nødvendigt at bruge de problematiske semikoloner og parenteser i CoffeeScript. I stedet for krøllede seler kan vi bruge mellemrum til at differentiere blokkoder som funktioner, sløjfer osv.

  • Omfattende biblioteksupport - I CoffeeScript kan vi bruge JavaScript-bibliotekerne og omvendt. Derfor har vi adgang til et rigt sæt biblioteker, mens vi arbejder med CoffeeScript. 

14. Forklar hvad er forskellen mellem en GET- og POST-anmodning?

Både en GET- og POST-metode bruges til at overføre data fra klient til server i HTTP-protokollen. Hovedforskellen mellem POST- og GET-metoden er, at GET bærer anmodningsparametre, der er tilføjet i URL-strengen, mens en POST bærer anmodningsparameter i meddelelsesteksten, hvilket gør det til en mere sikker måde at overføre data fra klient til server i HTTP.

15. Kan du fortælle os, hvornår vil du bruge CSS clear-egenskaben?

CSS clear-egenskaben bruges, når du vil have et element til venstre eller højre for `flydende element for ikke at vikle rundt om det.

16. Beskriv hvad er forskellen mellem Null og Udefineret?

n JavaScript, undefined betyder, at en variabel er blevet deklareret, men endnu ikke er tildelt en værdi. null er en tildelingsværdi. Det kan tildeles en variabel som en repræsentation af ingen værdi.

17. Forklar vigtigheden af ​​HTML DOCTYPE?

DOCTYPE er en instruktion til webbrowseren om versionen af ​​det markup-sprog, siden er skrevet i. DOCTYPE-erklæringen skal være den første ting i dit HTML-dokument, inden tag. Doctype-erklæringen peger på en dokumenttypedefinition (DTD). Doktypen indeholder markup-sprogregler, så en browser kan fortolke indholdet korrekt.

18. Forklar forskellen mellem cookies, sessionlagring og lokal lagring?

Cookies tillader applikationer at gemme data i en klients browser. Session storage-egenskab giver applikationer mulighed for at gemme data, indtil browservinduet lukkes. Lokal lageregenskab giver applikationer mulighed for at gemme data uden en udløbsdato.

19. Beskriv hvad der er et tråd-lokalt objekt i Python Flask?

Et tråd-lokalt objekt er et objekt, der er gemt i en dedikeret struktur, knyttet til det aktuelle tråd-id. Flask bruger interne trådlokalobjekter internt, så brugeren ikke behøver at sende objekter fra funktion til funktion inden for en anmodning om at forblive threadsafe. Trådens lokale lagring udføres inden for den aktuelle tråd. Denne tilgang er nyttig, men den har brug for en gyldig anmodningskontekst for afhængighedsinjektion eller når du forsøger at genbruge kode, der bruger en værdi, der er knyttet til anmodningen.

20. Forklar syntaksen, og hvordan man bruger en funktion som klasse?

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

21. Hvad er doven belastning?

Lazy loading (også kaldet on-demand loading) er en optimeringsteknik til onlineindhold, det være sig et websted eller en webapp. I stedet for at indlæse hele websiden eller billederne og gengive den til brugeren på én gang som ved bulkindlæsning, hjælper begrebet doven indlæsning kun med at indlæse det krævede afsnit og udsætter det resterende, indtil det er nødvendigt af brugeren når brugeren ruller til det ønskede billede).

22. Forklar forskellen mellem klasser og ID'er?

Klasser og ID-vælgere, begge bruges som kroge til CSS-stilarter. ID'er bruges ofte til at style elementer, der kun vises en gang på en side, såsom en forekomst af en navigationsmenu. Klasser bruges til at style forskellige elementer på samme måde, såsom tilstedeværelsen af ​​links, knapper, formularer, tekst osv. 

23. Hvad er begivenhedsdelegation?

Begivenhedsdelegering er processen med at bruge begivenhedsformering til at håndtere begivenheder på et højere niveau i DOM snarere end det element, som begivenheden stammer fra. Det giver dig mulighed for at undgå at tilføje hændelseslyttere til bestemte noder; i stedet kan du tilføje en enkelt begivenhedslytter til et overordnet element. 

24. Hvordan kan du øge sidens ydeevne?

  • Ryd op i HTML-dokumentet
  • Reducer eksterne HTTP-anmodninger og eksterne scripts
  • Brug komprimeret og mindre billede
  • Udsæt JavaScript til bunden af ​​siden
  • Brug de nyeste versioner af kode, såsom PHP
  • Minimer CSS, JavaScript, HTML
  • Brug CDN og Caching
  • GZip eller Brotli Komprimér indhold
  • Udnyt cache-browser 

25. Hvad er Ajax?

AJAX (Asynchronous JavaScript and XML) tillader applikationer at transportere data til / fra en server asynkront uden at opdatere siden. Dette betyder, at det sandsynligvis opdateres dele af en webside uden at genindlæse hele siden. For eksempel ankommer dine nye Gmail-meddelelser og markeres som nye, selvom du ikke har opdateret websiden. 

26. Hvad er forskellen mellem Block, Inline, Inline-block og Box-dimensionering?

  • Inline er standard. For eksempel: Et integreret element er .
  • Blokering vises som et blokelement, f.eks eller .
  • Inline-block viser et element som en inline-level-container.
  • Box-størrelse viser browserens størrelsesegenskaber.

27. Hvad er begivenhedsbobling?

Begivenhedsbobling er en form for begivenhedsformering, hvor begivenheden først udløses på det dybeste målelement. Det medfører, at alle begivenheder i underordnede noder automatisk overføres til deres overordnede noder. Fordelen ved denne metode er ydeevne, fordi koden kun kræver at krydse DOM-træet en gang.

28. Forklar hvad der er en lukning? 

lukning er en kombination af en funktion samlet (lukket) med henvisninger til dens omgivende tilstand ( leksikalsk miljø). En lukning giver dig adgang til en ydre funktions rækkevidde fra en indre funktion. I JavaScript oprettes lukninger hver gang en funktion oprettes, på tidspunktet for oprettelse af funktion.

 

29. Forklar, hvordan du håndterer browserspecifik stilkompatibilitet?

Der er flere måder at omgå dette på. Den enkleste måde at gå videre på er at bruge en betinget erklæring i head-tagget til din HTML. På denne måde kan du genkende browseren og indlæse et eksternt stilark.

Konklusion

Dette er nogle af de vigtigste spørgsmål og svar på front-end-udviklerinterview. T / hey hjælper dig med din forberedelse til et jobinterview i front-end-udvikling. Hvis vi har gået glip af andre vigtige spørgsmål om frontend-udvikler, så lad os det vide i kommentarerne nedenfor.

Om forfatteren
David Attard
Forfatter: David AttardInternet side: https://www.linkedin.com/in/dattard/
David har arbejdet i eller omkring online / digital industri i de sidste 18 år. Han har stor erfaring inden for software- og webdesignindustrien ved hjælp af WordPress, Joomla og nicher, der omgiver dem. Som digital konsulent er hans fokus på at hjælpe virksomheder med at få en konkurrencemæssig fordel ved hjælp af en kombination af deres hjemmeside og digitale platforme, der er tilgængelige i dag.

En ting mere... Vidste du, at folk, der deler nyttige ting som dette indlæg, også ser FANTASTISKE ud? ;-)
Vær venlig forlade a nyttigt kommenter med dine tanker, så del dette på din Facebook-gruppe (r), der ville finde det nyttigt, og lad os høste fordelene sammen. Tak fordi du delte og var god!

Afsløring: Denne side kan indeholde links til eksterne websteder for produkter, som vi elsker og helhjertet anbefaler. Hvis du køber produkter, vi foreslår, tjener vi muligvis et henvisningsgebyr. Sådanne gebyrer påvirker ikke vores anbefalinger, og vi accepterer ikke betalinger for positive anmeldelser.

Forfatter (e) Fremhævet den:  Inc Magazine-logo   Sitepoint-logo   CSS Tricks-logo    webdesignerdepot logo   WPMU DEV-logo   og mange flere ...