Frontend Interview - собеседования по Javanoscript / Html / Css – Telegram
Frontend Interview - собеседования по Javanoscript / Html / Css
11.4K subscribers
2.1K photos
118 videos
319 files
530 links
Канал для подготовки к собеседованиям по фронтенду

Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront

Купить рекламу: https://telega.in/c/frontendinterview

Канал в реестре РКН:
https://rknn.link/su
Download Telegram
Что такое ArrayBuffer? В чем разница между Uint32Array и Float32Array? Каким будет результат выполнения кода?
const uint32Array = new Uint32Array();
Array.isArray(uint32Array);

ArrayBuffer
- это объект в JavaScript, представляющий собой буфер памяти, который содержит определенное количество байтов. Он служит основой для создания "представлений" данных, таких как типизированные массивы в JavaScript.

Uint32Array и Float32Array являются различными типами типизированных массивов, которые предоставляют доступ и манипуляцию данными в ArrayBuffer. Главная разница между ними заключается в типе элементов, которые они содержат: Uint32Array содержит беззнаковые 32-битные целые числа (unsigned 32-bit integers), а Float32Array содержит 32-битные числа с плавающей запятой (floating-point numbers).

Теперь рассмотрим код:
 const uint32Array = new Uint32Array();
Array.isArray(uint32Array);

Результат выполнения данного кода будет false.

При вызове Array.isArray(uint32Array) мы проверяем, является ли uint32Array массивом. Однако, Uint32Array является типизированным массивом и не наследует стандартное поведение JavaScript-массивов. Он имеет свои особенности и методы специфичные для типизированных массивов.

Вместо использования Array.isArray, мы можем использовать uint32Array instanceof Uint32Array для проверки типа объекта uint32Array и узнать, что он является экземпляром Uint32Array.

👉 @frontendInterview
👍7🔥42
First Course in Algorithms Through Puzzles (2019)

Этот учебник знакомит с основными алгоритмами и объясняет их аналитические методы. Все алгоритмы и методы, представленные в этой книге, хорошо известны и часто используются в реальных программах. Книга начинается с базовых моделей, и никаких предварительных знаний не требует. Эта книга подходит для студентов старших курсов технических направлений, а также для самостоятельного изучения начинающими специалистами, интересующимися увлекательной областью алгоритмов.
Более 40 упражнений разного уровня сложности. Решения и комментарии ко всем упражнениям приводятся в последней главе.

👉 @frontendInterview
👍5
Split Strings

Создайте функцию, которая принимает строку и разбивает эту строку на массив пар символов. Если последнему символу не хватает пары, то к нему добавляется ('_').

Примеры:
'abc' => ['ab', 'c_']
'abcdef' => ['ab', 'cd', 'ef']


👉 @frontendInterview
Как определить, чему равен this в функции?

Задайте себе следующие вопросы в указанном порядке и остановитесь, когда найдете первое подходящее правило.

1. Функция вызвана с new (связывание new)? Если да, то this содержит новый сконструированный объект.
  var bar = new foo()

2. Функция вызвана с call или apply (явное связывание), даже скрытыми в жесткой привязке bind? Если да, то this содержит явно заданный объект.
var bar = foo.call( obj2 )

3. Функция вызвана с контекстом (неявное связывание), также называемым объектом-владельцем или содержащим объектом? Если да, то this содержит контекстный объект.
  var bar = obj1.foo()

4. В остальных случаях используется this по умолчанию (привязка по умолчанию). Если действует режим strict, выбирается undefined, а если нет — глобальный объект:
  var bar = foo()

Нормальные функции подчиняются четырем описанным правилам. Но в ES6 появилась особая разновидность функций, которая не использует эти правила: стрелочные функции. Стрелочные функции обозначаются не ключевым словом function, а так называемым оператором «толстой стрелки» =>. Вместо четырех стандартных правил this стрелочные функции принимают связывание this от внешней области видимости (функциональной или глобальной).

Вот и все. Вот и все, что необходимо для понимания правил связывания this для нормальных вызовов функций.

👉 @frontendInterview
👍15👎21
Каков результат выполнения этого кода?
Anonymous Quiz
16%
undefined
7%
Error
2%
null
74%
{ model: "Honda", country: "UK" }
🥰3
Как запретить браузеру отдавать кэш на HTTP-запрос?

Для запрета браузеру отдавать кэш на HTTP-запросы вы можете использовать заголовок Cache-Control с указанием значения no-cache.

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

Вот пример того, как добавить заголовок Cache-Control с помощью JavaScript:
 fetch(url, {
headers: {
'Cache-Control': 'no-cache'
}
})
.then(response => {
// Обработка ответа от сервера
})
.catch(error => {
// Обработка ошибок
});


Если вы используете серверный язык или фреймворк, такие как Node.js или Express, вы также можете добавить заголовок Cache-Control на стороне сервера. Вот пример использования Express:
 app.get('/', function(req, res) {
res.header('Cache-Control', 'no-cache');
// Отправка ответа клиенту
});


Обратите внимание, что помимо Cache-Control, также есть и другие заголовки, которые могут влиять на поведение кэширования, такие как Expires и Pragma.

👉 @frontendInterview
🧐Устали от ошибок? Позаботьтесь о чистоте архитектуры!

👉Узнайте как на бесплатном вебинаре онлайн-курса  «Clojure Developer» —  «Duct и Clean Architecture в Clojure»: регистрация

На уроке мы:
— попрактикуемся применять принципы чистой архитектуры с использованием языка программирования Clojure и фреймворка Duct. 

— познакомимся с его модульной системой, реализуем DI контейнер, подключим адаптеры во все порты и вообще сделаем все, как дедушка Боб нам завещал))

Экспертизой поделится руководитель программы и практик Сергей Ткаченко (Clojure Software developer / Team Lead).

🔥После вебинара вы сможете продолжить обучение на курсе по спеццене, в том числе, в рассрочку.

Реклама. ООО "ОТУС ОНЛАЙН-ОБРАЗОВАНИЕ". ИНН 9705100963. erid: LjN8KTbxG
👍2
Чему равен 'this' в функции-обработчике события?
Anonymous Quiz
10%
null
16%
e
34%
e.currentTarget
40%
window
👍10🤔71👏1
Что такое code coverage? Обязательно ли 100% покрытие кода тестами?

Это метрика, которая измеряет, насколько код программы был протестирован тестами. Она показывает, какая часть кода была выполнена (покрыта) в процессе выполнения тестов.

Code coverage измеряется в процентах и может включать различные типы покрытия, такие как покрытие строк кода, покрытие ветвей (условий), покрытие функций и т.д. Например, покрытие кода на уровне строк показывает, сколько процентов строк исходного кода было выполнено при запуске тестов.

Теперь к вопросу о 100% покрытии кода тестами. В идеале, 100% покрытие кода тестами будет означать, что каждая строка, ветвь или функция в вашем коде была выполнена хотя бы одним тестом. Такое покрытие может дать вам большую уверенность в том, что ваш код работает правильно и что вы не пропустили какие-либо участки кода, которые могут содержать ошибки.

Однако, обязательство иметь 100% покрытие кода тестами зависит от многих факторов, таких как сложность кода, время и ресурсы, доступные для написания и поддержки тестов, а также приоритеты проекта. В некоторых случаях, достижение 100% покрытия может быть сложно или нецелесообразно, особенно если это требует больших затрат на написание дополнительных тестов для ненадежных или малозначимых участков кода.

👉 @frontendInterview
1
Practical Next.js for E-Commerce: Create E-Commerce Sites with the Next.js Framework (2023)

Используйте возможности Next.js для быстрого создания эффективных сайтов электронной коммерции. Эта книга, ориентированная на конкретные проекты, упростит процесс создания начального сайта электронной коммерции с использованием Next.js от начала до конца, создавая удобное предложение электронной коммерции с использованием лишь текстового редактора или бесплатного программного обеспечения. Он даст вам начальный набор инструментов, который вы сможете использовать для разработки будущих проектов, включения в существующий рабочий процесс и поможет вывести ваши сайты на новый уровень, уменьшив зависимость от инструментов, которые раздуты, подвержены взлому и не являются самыми эффективными.

👉 @frontendInterview
More Zeros than Ones

Вам дана строка. Создайте функцию, которая переведет ASCII символы в их двоичное представление и вернет только те символы, в представлении которых нулей больше чем единиц.

Примеры:
'abcde' === ["1100001", "1100010", "1100011", "1100100", "1100101"]
True True False True False

--> ['a','b','d']

'DIGEST'--> ['D','I','E','T']


👉 @frontendInterview
Как установить язык сайта и его отдельных фрагментов, и почему это важно?

Как и пользователи сайта, скринридеры могут «разговаривать» на разных языках. Это возможно благодаря встроенному в скринридер синтезатору речи.

Чтобы скринридер определил язык и правильно произнёс текст, нужно указать основной язык сайта в атрибуте lang тега <html>. В качестве значения атрибута используется так называемый «языковой тег». Чаще всего это двухбуквенный или трёхбуквенный код. Например, для английского языка используется код en, для русского — ru.

Задать язык можно не только всему документу, но и фрагменту текста. Встретив такой фрагмент, скринридер переключит языковой профиль и прочитает текст с правильным акцентом.

Пример
Определяем основной язык веб-страницы:
<html lang="ru">

Задаём язык фрагмента. Теперь скринридер понимает, что «Lagom» надо читать на шведском, а не на русском:
<p>
<span lang="sv">Lagom</span> — не слишком много, не слишком мало,
а так, что в самый раз.
</p>

Определение языка важно не только для правильной работы скринридеров:
- браузер использует значение атрибута lang для выбора соответствующих языку шрифтов, формата даты и времени, разделителя десятичной части (точка или запятая);
- видеоплееры могут отображать субтитры на соответствующем языке;
- установленный язык используется программами автоматического перевода, такими как Google Translate, и программами для проверки орфографии.

👉 @frontendInterview
👍11
Присвоилось ли значение bark.animal? Если да, то какое?
Anonymous Quiz
26%
Возникла ошибка
56%
dog
17%
undefined
1%
""
👍122