«Главные вопросы на собеседовании по внешнему интерфейсу: (Часть 1) — улучшите свои знания и пройдите собеседование на следующую работу!

Привет! Вы взволнованы предстоящим собеседованием в области фронтенд-разработки? и я тоже! И у меня для вас есть потрясающие новости — я тоже готовлюсь к интервью и буду делиться с вами всеми вопросами, которые я узнаю каждый день! Таким образом, мы можем учиться вместе и лучше подготовиться к интервью.

Теперь я знаю, что подготовка к интервью может быть немного сложной, но не волнуйтесь — мы упростим ее. Мы разобьем каждый вопрос на простые термины, которые сможет понять каждый, и нам это очень понравится. Итак, чего же мы ждем, приступим!

1. Что такое семантические элементы в HTML:

• Семантические элементы в HTML — это просто теги со значимыми именами, которые говорят о том, какой тип контента он хранит. Например, заголовок, нижний колонтитул, таблица, навигация и т. д. HTML5 вводит множество семантических элементов, которые упрощают написание и понимание кода для разработчика, а также инструктируют браузер, как с ними обращаться.

2. Разница между относительным положением и абсолютным положением:

• Относительное положение. Для элементов с относительным расположением источником является их исходное положение в обычном потоке документа. Если вы примените к нему top: 10px, он переместится на 10 пикселей вниз от исходного положения, не влияя на нормальный поток документа.
• Абсолютная позиция. Однако для элементов с абсолютным позиционированием источником является их первый родитель, который имеет относительное, абсолютное или фиксированное положение. Если вы примените к нему top: 10px, он переместится на 10 пикселей вниз от вершины своего родителя.
  Таким образом, он выходит за рамки обычного потока документа, влияя на расположение других элементов.
• Фиксированная позиция :position: fixed; свойство, примененное к элементу, заставит его всегда оставаться на одном и том же месте, даже если страница прокручивается. Для позиционирования элемента мы используем свойства top, right, bottom, left.

3. Что такое флексбокс:

• CSS Flexbox — это одномерный модуль компоновки CSS, который используется для размещения и организации элементов на веб-страницах в одном направлении, т. е. по горизонтали и вертикали (строка или столбец), а также для управления их растяжением, сжатием или переносом. Модуль Flexible Box Layout упрощает разработку гибкой адаптивной структуры макета без использования float или позиционирования.\

4. Что такое Box-модель в CSS:

• В CSS термин «блочная модель» используется, когда речь идет о дизайне и макете. Блочная модель CSS — это, по сути, блок, который окружает каждый элемент HTML. Он состоит из: полей, границ, отступов и фактического содержимого. Содержимое — это то, что находится внутри коробки, например текст или изображение. Отступ — это пространство между содержимым и границей. Граница — это линия, окружающая поле, а поле — это пространство между границей и другими элементами на странице.

5. Что такое цикл событий:

• Цикл событий — это ключевое понятие в JavaScript, помогающее обрабатывать асинхронный код. Проще говоря, это цикл, который постоянно проверяет, нужно ли выполнять какой-либо код, и если да, то выполняет этот код.
• Вот как это работает: когда вы запускаете фрагмент кода, выполнение которого занимает некоторое время, например получение данных с сервера или ожидание ввода данных пользователем, JavaScript не просто останавливается и ждет завершения этого кода. Вместо этого он переходит к следующей строке кода и позже проверяет, завершилось ли выполнение предыдущего кода.
• Этот процесс проверки выполняется циклом событий. Он постоянно проверяет очередь задач, которые необходимо выполнить, и когда находит одну, помещает ее в стек вызовов, представляющий собой структуру данных, которая отслеживает весь выполняемый код. Затем стек вызовов выполняет этот код, и как только это будет сделано, он удаляет его из стека и переходит к следующей задаче.
• Таким образом, цикл событий — это то, что позволяет JavaScript обрабатывать асинхронный код, постоянно проверяя задачи, которые необходимо выполнить, и выполняя их в правильном порядке.

• Теперь в цикле событий есть два типа задач — микрозадачи и макрозадачи. Микрозадачи – это небольшие высокоприоритетные задачи, которые необходимо выполнять немедленно. Примеры микрозадач включают обратные вызовы обещаний, наблюдатели мутаций и queueMicrotask(). Хотя макрозадачи являются более крупными, менее приоритетные задачи, которые можно выполнить позже. Эти задачи включают такие вещи, как setTimeout(), setInterval() и requestAnimationFrame(). Понимание разницы между этими двумя типами задач важно для написания эффективного и производительного кода JavaScript.

6. Что такое ДОМ:

• Объектная модель документа, или сокращенно DOM, похожа на древовидную структуру, которая представляет содержимое веб-страницы в коде. Эта структура включает в себя все элементы, такие как заголовки и абзацы, и позволяет разработчикам получать к ним доступ и изменять их с помощью JavaScript. DOM помогает создавать динамические и интерактивные веб-страницы без перезагрузки всей страницы. Думайте об этом как о способе для разработчиков общаться с веб-страницей и вносить в нее изменения в режиме реального времени.

7. Что такое подъем в JavaScript:

• Подъем — это концепция, которая позволяет нам извлекать значения переменных и функций еще до инициализации/присваивания значения без получения ошибки, и это происходит из-за 1-й фазы (фаза создания памяти) контекста выполнения.
• Контекст выполнения создается в два этапа, поэтому еще до выполнения кода создается память, поэтому в случае переменной она будет инициализирована как неопределенная, а в случае функции весь код функции помещается в память.

8. Что такое замыкания:

• Функция, связанная с ее лексической областью видимости, называется замыканием.
• JavaScript имеет лексическую среду видимости. Если функции требуется доступ к переменной, она сначала обращается к своей локальной памяти. Когда он не находит его там, он обращается к памяти своего лексического родителя. См. код ниже. Здесь функция y вместе с ее лексической областью действия, т. е. (функция x), будет называться замыканием.
• Замыкание — это функция, которая имеет доступ к своей внешней области действия даже после возврата функции. Это означает, что замыкание может запоминать и обращаться к ссылкам на переменные и аргументы своей внешней функции даже после возврата функции.
• См. код ниже. Здесь функция y вместе с ее лексической областью действия, т. е. (функция x), будет называться замыканием.

function x() {
  var a = 7;
  function y() {
    console.log(a);
  }
  return y;
}
var z = x();
console.log(z); // value of z is entire code of function y.

• В приведенном выше коде, когда возвращается y, возвращается не только функция, но и все закрытие (fun y + его лексическая область видимости) возвращается и помещается внутрь z. Поэтому, когда z используется где-то еще в программе, он все еще помнит var a внутри x().

9. Что такое Callback Hell:

• Callback Hell — это ситуация, которая может возникнуть в программировании на JavaScript, когда слишком много вложенных обратных вызовов. Это может произойти, когда вам нужно выполнить несколько асинхронных функций одну за другой, и каждая функция зависит от результата предыдущей функции.
• Чтобы избежать Callback Hell, мы можем использовать промисы, async/await или другие методы, чтобы сделать код более читабельным и управляемым.

10. Разница между картой, фильтром и уменьшением:

• Карта, фильтр и редуктор — это Функции высшего порядка.
• Карта. Функция карты берет массив и создает новый массив, в котором каждый элемент преобразуется на основе предоставленной функции. Например, если у вас есть массив чисел, вы можете использовать карту для создания нового массива, в котором каждое число умножается на 2.
• Фильтр. Функция фильтра берет массив и создает новый массив только из тех элементов, которые прошли проверку на основе предоставленной функции. Например, если у вас есть массив чисел, вы можете использовать фильтр для создания нового массива только с четными числами.
• Уменьшение. Функция уменьшения принимает массив и возвращает одно значение, выполняя указанную операцию над каждым элементом массива. Например, если у вас есть массив чисел, вы можете использовать сокращение, чтобы найти сумму всех чисел в массиве.

Ссылка :

• https://github.com/AshwiniParaye1/намасте-javascript-заметки
• https://www.geeksforgeeks.org/
• https://www.w3schools.com/

Я надеюсь, что вы нашли эту статью полезной. Спасибо за чтение! 😀

Удачного кодирования!