5 standaardvragen tijdens sollicitaties voor JavaScript: analyse en oplossingen

5 standaardvragen tijdens sollicitaties voor JavaScript: analyse en oplossingen

Van de vertaler: hebben we een artikel gepubliceerd voor u van Maria Perna (Maria Antonietta Perna), waarin de typische taken in JavaScript worden besproken, die het vaakst worden aangeboden aan ontwikkelaarssollicitanten tijdens gesprekken. Het artikel zal vooral nuttig zijn voor beginnende programmeurs.

Sollicitatiegesprekken in technologiebedrijven zijn al lang een veelbesproken onderwerp. Het is niet verwonderlijk - het succesvol doorlopen van een interview biedt de mogelijkheid om een goede baan te krijgen. Maar het is niet zo eenvoudig, want vaak moet men complexe taken oplossen.

Bovendien hebben de meeste van deze taken vaak niets te maken met het werk dat de sollicitant zal uitvoeren, maar toch moet men ze oplossen. Soms moet je dit op een bord doen, zonder te verwijzen naar Google of een andere bron. Ja, de situatie verandert geleidelijk, en in sommige bedrijven worden dergelijke sollicitatiegesprekken afgewezen, maar veel werkgevers houden nog steeds vast aan deze traditie. Dit artikel is gewijd aan de typische JavaScript-taken die vaak worden gebruikt als opdrachten voor sollicitanten.

Ter herinnering: voor alle lezers van «Habr» — een korting van 10.000 roebel bij inschrijving voor elke cursus van Skillbox met de promocode «Habr».

Skillbox raadt aan: Praktische cursus ‘Mobiele Ontwikkelaar PRO’.

Het belangrijkste is een goede voorbereiding op je sollicitatiegesprek

Ja, voordat we de taken gaan bekijken, laten we enkele algemene tips voor de voorbereiding op het interview doornemen.

Het belangrijkste is van tevoren te bereiden. Controleer hoe goed je algoritmes en datastructuren onthoudt, en werk je kennis bij op gebieden die je niet zo goed kent. Er zijn veel online platforms die helpen bij de voorbereiding op sollicitatiegesprekken. We raden aan GeeksforGeeks, Pramp, Interviewing.io en CodeSignal.

Het is belangrijk om te leren je oplossing hardop uit te spreken. Je moet sollicitanten vertellen wat je aan het doen bent, en niet alleen op een bord schrijven (of stilletjes code typen op een computer). Op deze manier, als je een fout in de code maakt, maar de aanpak in het algemeen correct is, vergroot je je kansen op succes.

Je moet de taak begrijpen voordat je begint met het oplossen. In sommige gevallen is het mogelijk om de opdracht oppervlakkig te begrijpen en daarna de verkeerde weg in te slaan. Het is misschien verstandig om een paar verduidelijkende vragen aan de interviewer te stellen.

Je moet oefenen met het handmatig schrijven van code, niet op de pc. Het komt voor dat tijdens sollicitatiegesprekken de sollicitant een marker en een whiteboard krijgt, zonder hints of automatische opmaak. Bij het zoeken naar een oplossing is het verstandig om je code op papier of direct op het whiteboard te schrijven. Als je alles in je hoofd houdt, kun je iets belangrijks vergeten.

Sjabloonopdrachten in JavaScript

Waarschijnlijk ben je al bekend met sommige van deze opdrachten. Of je hebt sollicitatiegesprekken gehad waarbij je iets dergelijks moest oplossen, of je hebt erop geoefend tijdens het leren van JavaScript. Nu is het tijd om ze opnieuw op te lossen, dit keer met een gedetailleerde uitleg van het proces.

Palindroom

Een palindroom is een woord, zin of tekenreeks die hetzelfde blijft wanneer deze van links naar rechts of van rechts naar links wordt gelezen. Bijvoorbeeld, "Anna" is een palindroom, maar "table" en "John" zijn dat niet.

Opdracht

Je krijgt een string; schrijf een functie die true retourneert als de string een palindroom is, en false als dat niet het geval is. Hierbij moeten spaties en leestekens worden meegenomen.

palindrome(‘racecar’) === true
palindrome(‘table’) === false

De opdracht analyseren

Het hoofddoel hier is om de string om te keren. Als de "omgekeerde" string volledig overeenkomt met de originele, dan hebben we een palindroom en moet de functie true retourneren. Als dat niet zo is, dan false.

Oplossing

Hier is de code die de palindroom-opdracht oplost.

const palindrome = str => {
  // zet de string om naar kleine letters
  str = str.toLowerCase()
  // keer de invoerstring om en retourneer het resultaat van de
  // vergelijking
  return str === str.split('').reverse().join('')
}

De eerste stap is om de karakters van de invoerstring om te zetten naar kleine letters. Dit garandeert dat het programma daadwerkelijk de karakters vergelijkt en niet de hoofdletters of iets anders.

De tweede stap is het omkeren van de string. Dit is eenvoudig te doen: we moeten de string omzetten naar een array met behulp van de .split() methode (String bibliotheek). Vervolgens draaien we de array om met .reverse() (Array bibliotheek). De laatste stap is het omzetten van de omgekeerde array naar een string met .join() (Array bibliotheek).

Nu hoef je alleen nog maar de "omgekeerde" string te vergelijken met de originele en het resultaat true of false te retourneren.

FizzBuzz

Een van de populairste vragen in sollicitatiegesprekken.

Opdracht

Je moet een functie schrijven die de getallen van 1 tot n naar de console afdrukt, waarbij n een geheel getal is dat de functie als parameter ontvangt, met de volgende voorwaarden:

  • geef fizz weer in plaats van getallen die deelbaar zijn door 3;
  • toon buzz in plaats van getallen die deelbaar zijn door 5;
  • toon fizzbuzz in plaats van getallen die zowel deelbaar zijn door 3 als 5.

Voorbeeld

Fizzbuzz(5)

Resultaat

// 1
// 2
// fizz
// 4
// buzz

De opdracht analyseren

Het belangrijkste hier is de methode voor het vinden van deelbare getallen met JavaScript. Dit kan worden uitgevoerd met behulp van de modulus- of restoperator - %, die de rest bij deling van twee getallen toont. Als de rest 0 is, betekent dit dat het eerste getal deelbaar is door het tweede.

12 % 5 // 2 -> 12 is geen veelvoud van 5
12 % 3 // 0 -> 12 is een veelvoud van 3

Als we 12 door 5 delen, krijgen we 2 met een rest van 2. Delen we 12 door 3, dan krijgen we 4 met een rest van 0. In het eerste geval is 12 niet deelbaar door 5, in het tweede geval is 12 deelbaar door 3.

Oplossing

De optimale oplossing is de volgende code:

const fizzBuzz = num => {
  for(let i = 1; i <= num; i++) {
    // controleer of het getal een veelvoud van 3 en 5 is
    if(i % 3 === 0 && i % 5 === 0) {
      console.log('fizzbuzz')
    } // controleer of het getal een veelvoud van 3 is
      else if(i % 3 === 0) {
      console.log('fizz')
    } // controleer of het getal een veelvoud van 5 is
      else if(i % 5 === 0) {
      console.log('buzz')
    } else {
      console.log(i)
    }
  }
}

De functie voert de benodigde controles uit met behulp van voorwaardelijke operatoren en geeft het resultaat dat de gebruiker nodig heeft. In de opdracht moet aandacht worden besteed aan de volgorde van de if…else-operatoren: beginnen met de dubbele voorwaarde (&&) en eindigen met de situatie waarin geen deelbare getallen zijn gevonden. Hierdoor dekken we alle mogelijkheden.

Anagram

Dit is een woord dat alle letters van een ander woord in dezelfde hoeveelheid bevat, maar in een andere volgorde.

Opdracht

Je moet een functie schrijven die controleert of twee strings anagrammen zijn, waarbij de hoofdletters niet van invloed zijn. Alleen symbolen worden in aanmerking genomen; spaties of interpunctie worden niet meegeteld.

anagram(‘finder’, ‘Friend’) -> true
anagram(‘hello’, ‘bye’) -> false

De opdracht analyseren

Hier is het belangrijk om ervoor te zorgen dat elke letter in beide invoerstrings en hun aantal in elke string worden gecontroleerd.

finder -> f: 1 friend -> f: 1
i: 1 r: 1
n: 1 i: 1
d: 1 e: 1
e: 1 n: 1
r: 1 d: 1

Voor het opslaan van de gegevens van anagrammen is een objectliterale structuur in JavaScript een goede keuze. De sleutel in dit geval is het letterteken, de waarde is het aantal keer dat het in de huidige string voorkomt.

Er zijn ook andere voorwaarden:

  • Je moet ervoor zorgen dat de hoofdletters bij de vergelijking niet worden meegeteld. Zet gewoon beide strings om in kleine of hoofdletters.
  • Sluit alle niet-symbolen uit van de vergelijking. Het beste is om te werken met reguliere expressies.

Oplossing

// helper function that builds the
// object to store the data
const buildCharObject = str => {
  const charObj = {}
  for(let char of str.replace(/[^w]/g).toLowerCase()) {
    // if the object has already a key value pair
    // equal to the value being looped over,
    // increase the value by 1, otherwise add
    // the letter being looped over as key and 1 as its value
    charObj[char] = charObj[char] + 1 || 1
  }
  return charObj
}
 
// main function
const anagram = (strA, strB) => {
  // build the object that holds strA data
  const aCharObject = buildCharObject(strA)
  // build the object that holds strB data
  const bCharObject = buildCharObject(strB)
 
  // compare number of keys in the two objects
  // (anagrams must have the same number of letters)
  if(Object.keys(aCharObject).length !== Object.keys(bCharObject).length) {
    return false
  }
  // if both objects have the same number of keys
  // we can be sure that at least both strings
  // have the same number of characters
  // now we can compare the two objects to see if both
  // have the same letters in the same amount
  for(let char in aCharObject) {
    if(aCharObject[char] !== bCharObject[char]) {
      return false
    }
  }
  // if both the above checks succeed,
  // you have an anagram: return true
  return true
}

Let op het gebruik van Object.keys() in de bovenstaande snippet. Deze methode retourneert een array met namen of sleutels in dezelfde volgorde als ze in het object voorkomen. In dit geval zal de array als volgt zijn:

[‘f’, ‘i’, ‘n’, ‘d’, ‘e’, ‘r’]

Zo verkrijgen we de eigenschappen van het object zonder een zware lus uit te voeren. In deze taak kan deze methode worden gebruikt met de eigenschap .length — om te controleren of beide strings hetzelfde aantal karakters bevatten — dit is een belangrijke eigenschap van anagrammen.

Zoeken naar klinkers

Een vrij eenvoudige taak die vaak voorkomt in sollicitatiegesprekken.

Opdracht

We moeten een functie schrijven die een string als argument neemt en het aantal klinkers in die string retourneert.
Klinkers zijn ‘a’, ‘e’, ‘i’, ‘o’, ‘u’.

Voorbeeld:

findVowels(‘hello’) // —> 2
findVowels(‘why’) // —> 0

Oplossing

Hier is de eenvoudigste versie:

const findVowels = str => {
  let count = 0
  const vowels = ['a', 'e', 'i', 'o', 'u']
  for(let char of str.toLowerCase()) {
    if(vowels.includes(char)) {
      count++
    }
  }
  return count
}

Het is belangrijk om aandacht te besteden aan het gebruik van de methode .includes(). Deze is beschikbaar voor zowel strings als arrays. Het moet worden gebruikt om vast te stellen of een array een bepaalde waarde bevat. Deze methode retourneert true als de array de opgegeven waarde bevat, en false als dat niet het geval is.

Er is ook een kortere oplossing voor het probleem:

const findVowels = str => {
  const matched = str.match(/[aeiou]/gi)
  return matched ? matches.length : 0
}

Hier wordt de methode .match() gebruikt, die een efficiënte zoekopdracht mogelijk maakt. Als de reguliere expressie als argument binnen de opgegeven string wordt gevonden, dan is de geretourneerde waarde een array van overeenkomende karakters. Als er geen overeenkomsten zijn, retourneert .match() null.

Fibonacci

Een klassieke taak die je op sollicitaties van verschillende niveaus kunt tegenkomen. Het is belangrijk te herinneren dat de Fibonacci-reeks een reeks getallen is, waarbij elk volgend getal de som is van de twee voorgaande. De eerste tien getallen zijn als volgt: 0, 1, 1, 2, 3, 5, 8, 13, 21, 34.

Opdracht

We moeten een functie schrijven die de n-de term in een bepaalde reeks retourneert, waarbij n het nummer is dat wordt doorgegeven als argument aan de functie.

fibonacci(3) // —> 2

Deze taak omvat het doorlopen van een lus het aantal keren dat in het argument is aangegeven, met een terugkeerwaarde op de bijbehorende positie. Deze manier van aanpakken vereist het gebruik van lussen. Als je in plaats daarvan recursie gebruikt, kan dit de interviewer bevallen en je een paar extra punten opleveren.

Oplossing

const fibonacci = num => {
  // sla de Fibonacci-reeks op die je gaat
  // genereren in een array en
  // initialiseer de array met de eerste twee
  // getallen van de reeks
  const result = [0, 1]

  for(let i = 2; i <= num; i++) {
    // voeg de som van de twee getallen
    // die voorafgaan aan de positie van i in de result-array
    // aan het einde van de result-array toe
    const prevNum1 = result[i - 1]
    const prevNum2 = result[i - 2]
    result.push(prevNum1 + prevNum2)
  }
  // retourneer de laatste waarde in de result-array
  return result[num]
}

In de resultatenarray bevinden de eerste twee getallen zich in de rij, aangezien elke record in de reeks de som is van de twee voorgaande getallen. In het begin zijn er geen twee getallen die je kunt gebruiken om het volgende getal te verkrijgen, dus de lus kan ze niet automatisch genereren. Maar zoals we weten, zijn de eerste twee getallen altijd 0 en 1. Daarom kan de resultatenarray handmatig worden geïnitialiseerd.

Wat recursie betreft, hier is het tegelijkertijd eenvoudiger en moeilijker:

const fibonacci = num => {
  // als num 0 of 1 is, retourneer dan num
  if(num < 2) {
    return num
  }
  // recursie hier
  return fibonacci(num - 1) + fibonacci(num - 2)
}

We blijven fibonacci() aanroepen, waarbij we steeds kleinere getallen als argumenten doorgeven. We stoppen wanneer het doorgegeven argument gelijk is aan 0 of 1.

Uitslag

Waarschijnlijk ben je al met een van de genoemde taken in aanraking gekomen als je sollicitatiegesprekken voor frontend- of JavaScript-developer hebt gedaan (vooral als het op junior-niveau is). Maar zelfs als ze je niet zijn tegengekomen, kunnen ze in de toekomst van pas komen — tenminste voor algemene ontwikkeling.

Skillbox raadt aan:

Bron: habr.com

Koop betrouwbare webhosting met bescherming tegen DDoS, VPS VDS servers 🔥 Koop betrouwbare webhosting met bescherming tegen DDoS, VPS VDS servers | ProHoster