25 Pytań Rekrutacyjnych na Javascript Developera

25 Pytań Rekrutacyjnych na Javascript Developera

Wstęp

Przygotowując się do rozmowy rekrutacyjnej, pierwszej lub kolejnej, możesz się zastanawiać na jakie pytania możesz zostać zapytany. W tym artykule znajdziesz listę pytań, które mogą Cię spotkać w trakcie rekrutacji. Wszystkie pytania są związane z językiem JavaScript.

1. Jakie są różne typy danych w javascript?

(ENG) What are the different data types present in javascript?

W JavaScript typy danych mogą być podzielone na dwie kategorie:

1. Prymitywne (składające się z podstawowych typów)

• String (łańcuch znaków)

let name = 'John';

• Number (liczba)

let age = 30;

• Boolean (wartość logiczna)

let isAdult = true;

• Null

let isNull = null;

• Undefined

let isUndefined;

• Symbol

let symbol = Symbol('symbol');

2. Nieprymitywne (bardziej złożone)

• Object (obiekt)

let person = {
  name: 'John',
  age: 30,
};

• List/Array (tablica)

let array = [1, 2, 3];

• Map (mapa)

let map = new Map();
map.set('name', 'John');
map.set('age', 30);

• Set (zbiór)

let set = new Set();
set.add('John');
set.add(30);

2. Wyjaśnij Hoisting w javascript?

(ENG) Explain Hoisting in javascript.

Hoisting jest procesem, w którym zmienne i deklaracje funkcji są przenoszone na górę ich zasięgu przed wykonaniem kodu.

W tym przykładzie, mimo, że deklaracja zmiennej jest na dole, jest przenoszona na górę, więc nie ma błędu.

hoistedVariable = 3;
console.log(hoistedVariable); // 3
var hoistedVariable;

Tu ten sam przykład z deklaracją funkcji

hoistedFunction(); // test
 
function hoistedFunction() {
  console.log('test');
}

Tutaj konsola zwróci nam undefined, ponieważ inicjalizacja nie podlega hoisting’owi, tylko deklaracja, więc wartość jest niezdefiniowana

var x;
console.log(x); // undefined
x = 23;

W powyższym przykładzie, zmienna name nie jest przenoszona na górę, więc występuje błąd.

console.log(name); // ReferenceError: name is not defined
let name = 'John';

Lub możemy użyć strict-mode, aby wyłączyć hoisting

'use strict';
x = 23;
var x; // ReferenceError: x is not defined

3. Różnica między „==” a „===” operatorami.

(ENG) Difference between “ == “ and “ === “ operators.

Operator == porównuje wartości obu zmiennych, a operator === porównuje wartości obu zmiennych oraz ich typy.

console.log(1 == '1'); // true
console.log(1 === '1'); // false

4. Różnica między var a let słowem kluczowym w javascript?

(ENG) Difference between var and let keyword in javascript.

Zmienna zadeklarowana za pomocą var jest dostępna w całym zakresie funkcji, w której została zadeklarowana, a zmienna zadeklarowana za pomocą let jest dostępna tylko w zakresie bloku, w którym została zadeklarowana.

var często nazywamy zmienną globalną, a let zmienną lokalną.

function test() {
  var x = 10;
  if (true) {
    var x = 20;
    console.log(x); // 20
  }
  console.log(x); // 20
}
test();

function test() {
  let x = 10;
  if (true) {
    let x = 20;
    console.log(x); // 20
  }
  console.log(x); // 10
}
test();

5. Wyjaśnij Implicit Type Coercion w javascript?

(ENG) Explain Implicit Type Coercion in javascript.

Implicit Type Coercion jest procesem, w którym JavaScript automatycznie lub niejawnie konwertuje wartość jednego typu na inny typ.

console.log(1 + '1'); // '11'

6. Czy javascript jest językiem statycznie typowanym lub dynamicznie typowanym?

(ENG) Is javascript a statically typed or a dynamically typed language?

JavaScript jest językiem dynamicznie typowanym, ponieważ typy danych są sprawdzane podczas wykonywania kodu.

Co oznacza, że możemy przypisać wartość innego typu do zmiennej ( co jest nie najlepszym pomysłem bo prowadzi długoterminowo do wielu bugów i problemów )

let name = 'John';
name = 30;

7. Co to jest właściwość NaN w JavaScript?

(ENG) What is NaN property in JavaScript?

NaN jest skrótem od Not a Number. Wartość NaN jest zwracana, gdy nie można przekonwertować wartości na liczbę.

console.log(1 + '1'); // '11'
console.log(parseInt('test')); // NaN

8. Wyjaśnij passed by value i passed by reference.

(ENG) Explain passed by value and passed by reference.

W JavaScript, w przypadku typów prymitywnych, wartość jest przekazywana do funkcji, a w przypadku typów nieprymitywnych, referencja jest przekazywana do funkcji.
Przez co przy typach prymitywnych przy przypisaniu wartości do zmiennej, mamy nową niezależną wartość, a przy typach nieprymitywnych mamy nową referencję do tego samego obiektu.
Co oznacza tyle, że nawet jeżeli przypiszemy objekt do nowej zmiennej to tak naprawdę przypiszemy adres w pamięci do tego obiektu co przy modyfikacji któregokolwiek z nich, zmieni oba.

let name = 'John';
function changeName(name) {
  name = 'Jane';
}
changeName(name);
console.log(name); // 'John'

let person = {
  name: 'John',
};
function changeName(person) {
  person.name = 'Jane';
}
changeName(person);
console.log(person.name); // 'Jane'

Klonowanie obiektu:

let John = {
  name: 'John',
};
 
let Peter = John;
Peter.name = 'Peter';
console.log(John.name); // 'Peter'

9. Co to jest natychmiastowo wywoływana funkcja w JavaScript?

(ENG) What is an Immediately Invoked Function in JavaScript?

Natychmiastowo wywoływana funkcja jest funkcją, która jest natychmiast wywoływana po jej deklaracji.

(function () {
  console.log('Hello World');
})();

10. Co oznacza strict-mode w javascript i cechy strict-mode javascript?

(ENG) What do you mean by strict-mode in javascript and characteristics of javascript strict-mode?

Strict-mode jest trybem, w którym JavaScript działa w bardziej skonfigurowanym i bezpieczniejszym środowisku. W trybie strict-mode, JavaScript nie dopuszcza do niektórych błędów, które są dopuszczalne w trybie normalnym.

x = 10; // brak błędu

'use strict';
x = 10; // ReferenceError: x is not defined

11. Wyjaśnij funkcje wyższego rzędu w javascript?

(ENG) Explain Higher Order Functions in javascript.

Funkcje wyższego rzędu są funkcjami, które przyjmują inną funkcję jako argument lub zwracają inną funkcję jako wynik.

function add(a, b) {
  return a + b;
}
 
function multiply(a, b) {
  return a * b;
}
 
function calculator(a, b, operator) {
  return operator(a, b);
}
 
console.log(calculator(2, 3, add)); // 5
console.log(calculator(2, 3, multiply)); // 6

12. Wyjaśnij słowo kluczowe „this”.

(ENG) Explain “this” keyword.

Słowo kluczowe this odnosi się do obiektu, w którym została użyta.

let person = {
  name: 'John',
  age: 30,
  greet: function () {
    console.log('Hello ' + this.name);
  },
};
person.greet(); // 'Hello John'

W funkcjach this odnosi się do globalnego obiektu. ( w przypadku przeglądarki jest to obiekt window)

function greet() {
  this.console.log('Hello'); // 'Hello'
}
greet();

const greet = () => {
  this.console.log('Hello'); // 'Hello'
};
greet();

I najbardziej klasyczne użycie this jest w klasach, gdzie odwołujemy się wtedy do instancji obiektu.

class Person {
  constructor(name) {
    this.name = name;
  }
  greet() {
    console.log('Hello ' + this.name);
  }
}
let person = new Person('John');
person.greet(); // 'Hello John'

13. Wyjaśnij metody call (), apply () i bind ().

(ENG) Explain call(), apply() and, bind() methods.

Metody call(), apply() i bind() są metodami funkcji, które pozwalają na wywołanie funkcji z innym kontekstem.

let person1 = {
  name: 'John',
  age: 30,
};
let person2 = {
  name: 'Jane',
  age: 25,
};
function greet() {
  console.log('Hello ' + this.name);
}
greet.call(person1); // 'Hello John'
greet.call(person2); // 'Hello Jane'

14. Co to jest różnica między metodami exec () i test () w javascript?

(ENG) What is the difference between exec () and test () methods in javascript?

Metoda exec() zwraca tablicę zawierającą dopasowane wartości lub wartość null, jeśli nie ma dopasowania.

let regex = /hello/;
let str = 'hello world';
console.log(regex.exec(str)); // ['hello']

Metoda test() zwraca wartość true lub false, w zależności od tego, czy dopasowanie zostało znalezione.

let regex = /hello/;
let str = 'hello world';
console.log(regex.test(str)); // true

15. Co to jest currying w JavaScript?

(ENG) What is currying in JavaScript?

Currying jest procesem konwertowania funkcji z funkcji z wieloma argumentami do funkcji z jednym argumentem.

function add(a, b) {
  return a + b;
}
function curriedAdd(a) {
  return function (b) {
    return a + b;
  };
}
console.log(add(1, 2)); // 3
console.log(curriedAdd(1)(2)); // 3

16. Wyjaśnij zakres i łańcuch zakresu w javascript?

(ENG) Explain Scope and Scope Chain in javascript.

Zakres jest zasięgiem, w którym zmienna jest dostępna. Zasięg może być globalny lub lokalny.

let a = 10; // global scope
function greet() {
  let b = 20; // local scope
}

Łańcuch zakresu jest kolekcją wszystkich obiektów zakresu, w których jest dostępna zmienna.

let a = 10; // global scope
function greet() {
  let b = 20; // local scope
  function sayHello() {
    let c = 30; // local scope
    console.log(a + b + c); // 60
  }
  sayHello();
}
 
greet();

17. Wyjaśnij Closures w JavaScript?

(ENG) Explain Closures in JavaScript.

Zamknięcie jest funkcją, która zapamiętuje swoje otoczenie i może uzyskać dostęp do tego otoczenia nawet po zakończeniu działania funkcji.

function greet() {
  let name = 'John';
  function sayHello() {
    console.log('Hello ' + name);
  }
  return sayHello;
}
let sayHello = greet();
sayHello(); // 'Hello John'

18. Co to są prototypy obiektów?

(ENG) What are object prototypes?

Każdy obiekt w javascript ma prototyp. Prototyp jest obiektem, z którego obiekt dziedziczy właściwości.
Taki prototyp możemy zobaczyć w taki sposób:

let person = {
  name: 'John',
  age: 30,
};
console.log(person.__proto__); // {}

19. Co to są callback’i?

(ENG) What are callbacks?

Callback jest funkcją, która jest przekazywana jako argument do innej funkcji i wywoływana wewnątrz tej funkcji.

function greet(callback) {
  console.log('Hello');
  let data = {
    name: 'John',
  };
  callback(data);
}
 
greet((data) => {
  console.log('The callback was invoked!');
  console.log(data);
});

Używane są na przykład w funkcjach asynchronicznych, takich jak setTimeout().

setTimeout(() => {
  console.log('Reading a user from a database...');
}, 2000);

Lub fetch

fetch('https://jsonplaceholder.typicode.com/users')
  .then((response) => response.json())
  .then((users) => console.log(users));

Lub forEach

let numbers = [1, 2, 3, 4, 5];
numbers.forEach((number) => console.log(number));

20. Jakie są typy błędów w javascript?

(ENG) What are the types of errors in javascript?

W javascript są dwa typy błędów:

• Błędy składniowe (Syntax Error)

Błędy składniowe są błędami, które są spowodowane przez niepoprawne użycie składni języka. Błędy składniowe są łatwe do rozpoznania, ponieważ przeglądarka zwraca informacje o błędzie.
Na przykład:

conts a = 10; // literówka

• Błędy logiczne

Błędy logiczne są błędami, które są spowodowane przez niepoprawne użycie logiki programu. Błędy logiczne są trudne do rozpoznania, ponieważ przeglądarka nie zwraca informacji o błędzie.
Na przykład:

let a = 10;
let b = 20;
if ((a = b)) {
  console.log('a is equal to b');
}

Wyświetla nam w konsoli a is equal to b, mimo że a nie jest równe b. Wynika to z tego, że w instrukcji warunkowej if przypisujemy wartość b do a, a nie porównujemy je ze sobą.

21. Co to jest memoization?

(ENG) What is memoization?

Memoization jest procesem zapisywania wyników funkcji, aby uniknąć ponownego obliczania tych samych wyników.

const memoize = (fn) => {
  let cache = {};
  return function (...args) {
    if (cache[args]) {
      return cache[args];
    }
    let result = fn.apply(this, args);
    cache[args] = result;
    return result;
  };
};
 
const add = (a, b) => a + b;
 
let memoizedAdd = memoize(add);
console.log(memoizedAdd(1, 2)); // 3
console.log(memoizedAdd(1, 2)); // 3

22. Co to jest rekurencja w języku programowania?

(ENG) What is recursion in a programming language?

Rekurencja jest procesem wywoływania funkcji przez samą siebie.

const factorial = (n) => {
  if (n === 1) {
    return 1;
  }
  return n * factorial(n - 1);
};
console.log(factorial(5)); // 120

Uwaga! Pamiętaj, aby przy wywoływaniu funkcji rekurencyjnej zawsze ustawić warunek zakończenia, aby zapobiec nieskończonej pętli.

23. Do czego służy funkcja konstruktora w javascript?

(ENG) What is the use of a constructor function in javascript?

Funkcja konstruktora jest funkcją, która jest używana do tworzenia obiektów.

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}
 
const person1 = new Person('John', 30);
const person2 = new Person('Mary', 25);

24. Jaka metoda jest używana do pobrania znaku z określonego indeksu?

(ENG) Which method is used to retrieve a character from a certain index?

Metoda charAt() jest używana do pobrania znaku z określonego indeksu.

const str = 'Hello World';
console.log(str.charAt(0)); // 'H'

25. Co to jest różnica między javascriptem po stronie klienta a po stronie serwera?

(ENG) What is the distinction between client-side and server-side JavaScript?

Javascript po stronie klienta jest używany do tworzenia interaktywnych stron internetowych.
W tym zadań takich jak:

• animacje
• walidacja formularzy
• pobieranie danych z serwera
• reakcja na zdarzenia użytkownika
• drop-down menu
• itp.

Javascript po stronie serwera jest używany do tworzenia aplikacji backendowych.
Tam możemy wykonywać takie zadania jak:

• obsługa żądań HTTP
• komunikacja z bazą danych
• komunikacja z third-party API
• autoryzacja użytkowników
• tworzenie plików
• tworzenie logów
• itp.

Zakończenie

To by było na tyle z pytań i odpowiedzi na rozmowę o javascript. Mam nadzieję, że pomogło Ci to przygotować się do rozmowy o javascript. Jeśli masz jakieś pytania lub sugestie, możesz je zostawić w komentarzu poniżej.
Pozdrawiam i życzę powodzenia w rozmowie o javascript!

PS: W tym artykule mogły pojawić się pewne uproszczenia. Były to dosyć proste przykłady odpowiedzi, warto jednak doczytać o danych tematach bardziej, aby je dobrze zrozumieć.