JavaScript — один из самых популярных языков программирования в мире, который широко используется для веб-разработки, серверного программирования и разработки мобильных приложений. Если вы готовитесь к собеседованию по JavaScript, важно знать, с какими вопросами вы можете столкнуться. Вот некоторые из последних вопросов на собеседовании по JavaScript, с которыми вы можете столкнуться:
1. Можете ли вы объяснить разницу между let, var и const?
var
относится к области действия функции,let
иconst
относится к области действия блока. Объявленияvar
поднимаются наверх своей области действия, а объявленияlet
иconst
не поднимаются.const
используется для значений, которые не следует переназначать, аlet
используется для значений, которые необходимо переназначить.
var x = 10; let y = 20; const z = 30; if (true) { var x = 100; let y = 200; const z = 300; console.log(x, y, z); // 100 200 300 } console.log(x, y, z); // 100 20 30
2. Что такое замыкание в JavaScript?
- Замыкание — это функция, которая имеет доступ к переменным в своей внешней области видимости даже после возврата внешней функции.
function outerFunction(x) { return function innerFunction(y) { return x + y; }; } const addBy5 = outerFunction(5); console.log(addBy5(3)); // 8
3. В чем разница между null и undefined?
undefined
означает, что переменная объявлена, но ей еще не присвоено значение.null
явно назначается без значения.
let x; console.log(x); // undefined let y = null; console.log(y); // null
4. Можете ли вы объяснить цикл обработки событий в JavaScript?
- Цикл событий — это механизм, который позволяет JavaScript выполнять неблокирующие операции, помещая выполнение кода в очередь и обрабатывая эту очередь по мере того, как стек становится пустым. Таким образом, он может обрабатывать несколько событий и манипулировать DOM, даже если JavaScript является однопоточным.
5. В чем разница между синхронным и асинхронным кодом в JavaScript?
- Синхронный код выполняется по порядку, одна строка за другой. Асинхронный код выполняется в фоновом режиме и не блокирует выполнение остального кода.
console.log('Start'); setTimeout(() => { console.log('Timeout'); }, 0); console.log('End'); // Output: // Start // End // Timeout
6. Можете ли вы объяснить наследование прототипов в JavaScript?
- Наследование прототипов — это механизм в JavaScript, при котором объект может наследовать свойства и методы от своего прототипа. Прототип — это объект, который служит образцом для создания других объектов. Код JavascriptCopy
function Animal(name) { this.name = name; } Animal.prototype.speak = function() { console.log(`${this.name} makes a sound.`); }; const dog = new Animal('Dog'); dog.speak(); // "Dog makes a sound."
7. Можете ли вы привести пример использования apply
и call
в JavaScript?
- И
apply
, иcall
— это методы, которые позволяют вызывать функцию с указаннымthis
значением и аргументами. Разница в том, чтоapply
принимает массив аргументов, аcall
принимает отдельные аргументы.
function greet(greeting) { return `${greeting}, ${this.name}`; } const person = { name: 'John' }; console.log(greet.call(person, 'Hello')); // "Hello, John" console.log(greet.apply(person, ['Hello'])); // "Hello, John"
8. Можете ли вы объяснить разницу между глубоким и поверхностным копированием в JavaScript?
- Неглубокая копия объекта копирует только первый уровень свойств, а глубокая копия копирует все уровни свойств и создает полностью независимый объект.
const originalObject = { a: 1, b: { c: 2 } }; const shallowCopy = { ...originalObject }; shallowCopy.a = 10; console.log(originalObject.a); // 1 console.log(shallowCopy.a); // 10 shallowCopy.b.c = 20; console.log(originalObject.b.c); // 20 console.log(shallowCopy.b.c); // 20 const deepCopy = JSON.parse(JSON.stringify(originalObject)); deepCopy.a = 100; console.log(originalObject.a); // 1 console.log(deepCopy.a); // 100 deepCopy.b.c = 200; console.log(originalObject.b.c); // 20 console.log(deepCopy.b.c); // 200
9. Можете ли вы привести пример использования оператора распространения в JavaScript?
- Оператор распространения позволяет вам распределить массив или объект на отдельные элементы или свойства соответственно.
const array1 = [1, 2, 3]; const array2 = [4, 5, 6]; const combinedArray = [...array1, ...array2]; console.log(combinedArray); // [1, 2, 3, 4, 5, 6] const object1 = { a: 1, b: 2 }; const object2 = { c: 3, d: 4 }; const combinedObject = { ...object1, ...object2 }; console.log(combinedObject); // { a: 1, b: 2, c: 3, d: 4 }
10. Можете ли вы объяснить разницу между ==
и ===
в JavaScript?
==
выполняет приведение типов, а===
— нет.==
преобразует операнды к одному типу перед сравнением, а===
сравнивает операнды без их преобразования.
console.log(1 == '1'); // true console.log(1 === '1'); // false
11. Можете ли вы объяснить разницу между промисом и обратным вызовом в JavaScript?
- Обещание — это шаблон для управления асинхронным кодом, который обеспечивает более чистый способ обработки случаев успеха и неудачи. Обратный вызов — это функция, которая передается в качестве аргумента другой функции, которая будет вызываться при наступлении определенного события. (Источник: https://www.geeksforgeeks.org/javascript-callbacks/)
const successCallback = data => { console.log(data); }; const errorCallback = error => { console.error(error); }; const doSomethingWithCallbacks = (success, error) => { const result = 'Success'; if (result === 'Success') { success(result); } else { error(new Error('Error')); } }; doSomethingWithCallbacks(successCallback, errorCallback); const doSomethingWithPromise = () => { return new Promise((resolve, reject) => { const result = 'Success'; if (result === 'Success') { resolve(result); } else { reject(new Error('Error')); } }); }; doSomethingWithPromise() .then(data => { console.log(data); }) .catch(error => { console.error(error); });
12. Можете ли вы объяснить, что такое цикл обработки событий в JavaScript?
- Цикл событий — это механизм в JavaScript, который обрабатывает выполнение асинхронного кода. Он постоянно проверяет очередь сообщений на наличие сообщений (событий), которые необходимо обработать, и выполняет связанные с ними функции обратного вызова.
console.log('Start'); setTimeout(() => { console.log('Timeout'); }, 0); console.log('End'); // Output: // Start // End // Timeout
13. Можете ли вы объяснить, что такое функция высшего порядка в JavaScript?
- Функция высшего порядка — это функция, которая либо принимает одну или несколько функций в качестве аргументов, либо возвращает функцию в качестве результата.
const map = (array, transform) => { const result = []; for (const item of array) { result.push(transform(item)); } return result; };
14. Можете ли вы объяснить, что такое подъем в JavaScript?
- Поднятие — это поведение в JavaScript, при котором объявления переменных и функций перемещаются в верхнюю часть соответствующих областей видимости. Это означает, что их можно использовать до того, как они будут объявлены в коде.
console.log(x); // undefined var x = 10; // is equivalent to: var x; console.log(x); // undefined x = 10;
15. Можете ли вы объяснить, что такое тернарный оператор в JavaScript?
- Тернарный оператор — это сокращенный способ написания оператора
if
, который возвращает значение. Он принимает три операнда: условие, возвращаемое значение, если условие истинно, и возвращаемое значение, если условие ложно.
const x = 5; const result = x > 10 ? 'x is greater than 10' : 'x is less than or equal to 10'; console.log(result); // x is less than or equal to 10
16. Как ключевое слово this
используется в JavaScript?
Ключевое слово this
относится к объекту, методом которого является текущая функция. Значение this
зависит от того, как вызывается функция, а не от того, где она объявлена.
const obj = { name: 'John Doe', greet: function() { console.log(`Hello, my name is ${this.name}`); }, }; obj.greet(); // Hello, my name is John Doe
17. Можете ли вы объяснить всплывающие и захватывающие события в JavaScript?
В JavaScript всплывающее окно и захват событий — это два способа распространения событий в DOM (объектная модель документа).
Всплывание событий — это поведение по умолчанию, когда событие распространяется от самого внутреннего элемента к самому внешнему элементу. Например, если у вас есть кнопка внутри div
, и вы нажимаете кнопку, событие щелчка сначала будет инициировано на кнопке, а затем на div
.
Захват событий противоположен пузырьковому движению, когда событие сначала захватывается самым внешним элементом и распространяется внутрь.
document.querySelector('#outer').addEventListener('click', (event) => { console.log('outer clicked'); }, true); document.querySelector('#inner').addEventListener('click', (event) => { console.log('inner clicked'); }, true);
18. Как бы вы реализовали функцию устранения дребезга в JavaScript?
Функция устранения дребезга — это метод, используемый для ограничения скорости вызова функции. Он позволяет указать минимальное количество времени, которое должно пройти между последовательными вызовами функции. Функция устранения дребезга может быть реализована в JavaScript с помощью метода setTimeout
.
function debounce(fn, wait) { let timeout; return function () { const context = this; const args = arguments; clearTimeout(timeout); timeout = setTimeout(function () { fn.apply(context, args); }, wait); }; } const myFunction = debounce(function () { console.log('Debounced function called!'); }, 500); myFunction(); // Debounced function called! (called after 500 milliseconds)
19. Каковы наиболее важные особенности JavaScript и как бы вы объяснили их тем, кто плохо знаком с этим языком?
Ответ: Некоторые из наиболее важных особенностей JavaScript включают его динамическую типизацию, возможности функционального программирования и поддержку программирования, управляемого событиями. Я бы объяснил это как язык, который позволяет создавать интерактивные и отзывчивые веб-страницы, с легкостью выполнять сложные операции и запускать код как на стороне клиента, так и на стороне сервера.
20. Последние функции JavaScript, над которыми вы работали.
- Необязательная цепочка (?.)
Необязательная цепочка — это функция, представленная в JavaScript, которая позволяет вам получать доступ к свойствам объекта, только если они существуют. Он представлен знаком «?» оператор. Например, если у нас есть такой объект:
cssCopy code let obj = { person: { name: "John", age: 30 } };
Обычно, если мы хотим получить доступ к свойству age, мы должны написать
let age = obj.person.age;
Однако если мы попытаемся получить доступ к несуществующему свойству, мы получим ошибку. С помощью необязательной цепочки мы можем проверить, существует ли свойство, прежде чем обращаться к нему, например
let age = obj?.person?.age;
В этом случае выражение obj?.person?.age
вернет undefined
, если свойство person
или свойство age
не существует.
2. Нулевой оператор объединения (??)
Нулевой оператор объединения (??
) является сокращением для проверки того, является ли значение null
или undefined
. Это более ограничительная версия логического оператора ИЛИ (||
).
Например, если у нас есть переменная a
и мы хотим установить для нее значение по умолчанию 10
, если это null
или undefined
, мы можем написать
let a = null; let b = a ?? 10; console.log(b); // 10
В этом примере значение b
равно 10
, поскольку a
равно null
. Если бы a
было 0
, выражение вернуло бы 0
, потому что нулевой оператор объединения возвращает значение по умолчанию, только если исходное значение равно null
или undefined
.
Это лишь некоторые из многих вопросов, которые могут возникнуть у вас на собеседовании по JavaScript. Ознакомившись с этими концепциями и попрактиковавшись в ответах, вы повысите свои шансы получить работу своей мечты в качестве разработчика JavaScript. Удачи!
Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord .
Заинтересованы в масштабировании запуска вашего программного обеспечения? Ознакомьтесь с разделом Схема.