У нашій попередній статті ми розглянули різноманітні методи для роботи з масивами (arrays) у JavaScript. Проте масиви залишаються однією з найулюбленіших тем для інтерв’юерів — і це не просто так. Протягом багатьох років вони використовуються для оцінки навичок вирішення задач та глибини розуміння розробників.
Чому масиви такі популярні на співбесідах?
Відповідь полягає у їхній універсальності. Масиви разом з об’єктами (objects) є базовими структурами даних, з якими розробники працюють протягом всієї своєї кар’єри. Незважаючи на свою простоту, складність, яку вони можуть створити при вирішенні реальних задач, робить їх цікавою та складною темою.
Щоб допомогти вам підготуватися до таких викликів, я зібрав список найчастіших питань на тему масивів під час співбесід. Вирішення цих питань не лише зміцнить ваші навички вирішення задач, але й допоможе краще зрозуміти JavaScript.
У цій статті ми зосередимося на масивах, закладаючи основу для наступної теми: об’єкти в JavaScript. Спочатку опанувавши масиви, ви значно полегшите перехід до об’єктів.
Давайте розглянемо найпоширеніші питання щодо масивів і обговоримо, чому вони важливі, а також підходи до їх вирішення.
Питання 1
let arr = [1, 2, 3, 4, 5, -6, 7];
arr.length = 0;
console.log(arr); // Output : []
/*
Причина: Встановлення властивості length масиву на менше значення обрізає масив, видаляючи елементи за межами нової довжини.
Наприклад, arr.length = 2; зменшить масив до [1, 2], і arr.length стане рівним 2.
*/
Питання 2
const arr=[1,,2];
console.log(arr[1]);// undefined
console.log(arr); // [1, <1 empty item>, 2]
Питання 3
let arr = [10, 20, 30, 40, 50];
let removed = arr.splice(2, 2, 'a', 'b');
console.log(arr); // [10,20,a,b,50]
console.log(removed); // [30,40]
Питання 4
const arr = [10, 12, 15, 21];
for (var i = 0; i < arr.length; i++) {
setTimeout(function() {
console.log('Index: ' + i + ', element: ' + arr[i]);
}, 3000);
}
Результат
Index: 4, element: undefined
Index: 4, element: undefined
Index: 4, element: undefined
Index: 4, element: undefined
Функція setTimeout створює замикання (closure), яке захоплює змінну i. Оскільки var має функціональну область видимості, до моменту виконання колбеків після 3 секунд цикл вже завершився, і i дорівнює 4. Тому кожен колбек виводить Index: 4, element: undefined, оскільки arr[4] є undefined. Щоб це виправити, використовуйте let замість var для створення блочної області видимості для i, або застосовуйте IIFE (негайно виконувана функція) для захоплення поточного значення i.
Питання 5
console.log([] + []);
console.log([1, 2] + [3, 4]);
console.log([] == ![]);
""
"1,23,4"
true
[] + []дає порожній рядок, оскільки оператор+, застосований до масивів, конвертує їх у рядки, а два порожніх рядки утворюють"".[1, 2] + [3, 4]дає"1,23,4", тому що кожен масив перетворюється на свій рядковий вигляд ("1,2"і"3,4") і з’єднується.[] == ![]повертаєtrue, тому що![]дорівнюєfalse, а[]перетворюється наfalseу порівнянні за слабкою рівністю.
Таким чином,false == falseповертаєtrue.
Питання 6
x = 10;
console.log(x); // 10 оскільки змінна піднімається (hoisted) на початок області видимості
var x;
console.log({}+"1"+1); // [object object]11
console.log(typeof NaN) // number
Питання 7
const arr1 = [1,2,3];
const arr2 = [1,2,3];
const str = "1,2,3";
console.log(arr1 == str); // true
console.log(arr1 == arr2); // false
Питання 8
const arr = [11, 0, '', false, 2, 1];
const filtered = arr.filter(Boolean);
console.log(filtered); // [11,2,1] 0 є хибним значенням (falsy value)
Питання 9
const arr = ["A","B","C","D","E"]
console.log(Object.keys(arr)); // [0,1,2,3,4]
Висновок: Опанування масивів для успіху на співбесідах 🚀
Масиви – це більше, ніж просто базова структура даних у JavaScript; вони є основою вирішення задач на співбесідах. Завдяки розумінню їхніх особливостей, методів і взаємодії з особливостями JavaScript ви отримаєте значну перевагу у вирішенні реальних проблем.
Від розуміння того, як поводяться "дірки" в масивах, до ефективного використання методів масивів, таких як splice() та filter(), кожне питання в цій статті підкреслює універсальність і складність, які масиви додають до завдань. Важливість замикань (closures) у циклах, приведення типів під час операцій та поведінка властивостей масивів, таких як length, також показують, як масиви в JavaScript виходять за межі простого зберігання даних, створюючи складні логічні виклики.
Основні висновки:
- Особливості масивів: Зрозумійте, що концепції, як-от "дірки" в масивах (
[1, , 3]) і маніпуляції зarr.length, є унікальними для JavaScript і можуть призводити до неочікуваних результатів, якщо їх не розуміти. - Володіння методами: Методи, такі як
splice()іfilter(), є потужними інструментами для маніпулювання та вилучення даних, що важливо для вирішення практичних задач. - Поведінка під час операцій: Дізнайтеся, як JavaScript обробляє масиви в операціях (
[] + []або[] == ![]), щоб уникнути несподіванок під час приведення типів. - Замикання та область видимості: Пам’ятайте про важливість використання
letзамістьvarу циклах і замиканнях, що може вплинути на логіку асинхронних задач. - Готовність до співбесід: Навіть прості на перший погляд питання про масиви можуть перевірити ваші базові знання про основні механізми JavaScript, такі як приведення типів, підняття змінних (hoisting) або перетворення рядків.
Чому це важливо:
Опанування масивів не лише дозволяє вам розв’язувати задачі під час співбесід, а й поглиблює ваше розуміння JavaScript в цілому. Співбесіди спрямовані на те, щоб змусити вас критично мислити про інструменти, які ви використовуєте щодня, і масиви часто стають початковою точкою цього дослідження.
Якщо ви продовжуєте свій шлях у JavaScript, пам’ятайте: масиви – це не просто структури даних; це майданчик для дослідження алгоритмів, вирішення задач і концепцій програмування.
Далі ми перейдемо до об’єктів у JavaScript, відкриваючи їхні секрети та розширюючи ваш набір інструментів для успіху на співбесідах. Продовжуйте навчатися, кодуйте й опановуйте мистецтво JavaScript крок за кроком! 🚀
Перекладено з: [Day-8] Mastering Arrays: Essential Interview Questions Every Developer Should Know?