Какие бывают области видимости в JS?

Глобальная область видимости
Это самая внешняя коробка из всех. Когда мы «просто объявляем переменную», вне функций, вне модулей, то эта переменная попадает в глобальную область видимости.
Самый известный пример глобальной переменной — это console.
console.log(console)
// Console {debug: function, error: function,
// log: function, info: function, warn: function, …}

Блочная область видимости
Она ограничена программным блоком, обозначенным при помощи { и }. Простейший пример такой области — это выражение внутри скобок:

if (true) {
const a = 42
console.log(a)
// 42
}

console.log(a)
// ReferenceError: Can't find variable: a

Функциональная область видимости
Это область видимости в пределах тела функции. Можно сказать, что она ограничена { и } функции.

function scoped() {
const b = 43
}

console.log(b)
// Reference error.
К переменной b есть доступ только внутри функции scoped.

👉 @frontendInterview

Программируй & типизируй

Причиной многих программных ошибок становится несоответствие типов данных. Сильная система типов позволяет избежать целого класса ошибок и обеспечить целостность данных в рамках всего приложения. Разработчик, научившись мастерски использовать типы в повседневной практике, будет создавать более качественный код, а также сэкономит время, которое потребовалось бы для выискивания каверзных ошибок, связанных с данными

👉 @frontendInterview

Sum of Intervals

Создайте функцию, которая принимает несколько интервалов и возвращают сумму длин этих интервалов. Если интервалы пересекаются, то нужно объединить их и считать за один.

Примеры:
sumIntervals( [
[1,2],
[6, 10],
[11, 15]
] ); // => 9

sumIntervals( [
[1,4],
[7, 10],
[3, 5]
] ); // => 7

sumIntervals( [
[1,5],
[10, 20],
[1, 6],
[16, 19],
[5, 11]
] ); // => 19

👉 @frontendInterview

Как получить все формы на странице через JS?

forms — это поле объекта document. Оно хранит коллекцию всех элементов <form>, которые есть на текущей странице.
Коллекция доступна только для чтения.

Вызывается обращением к свойству объекта document. Так можно получить коллекцию всех форм:
const collection = document.forms

👉 @frontendInterview

👉 @frontendInterview

Как можно создать «красную строку» — добавить отступ для первой строки абзаца в CSS?

Свойство text-indent управляет отступом первой строки текста: либо вытягивает строку за пределы абзаца, либо утягивает её внутрь. Используется для выделения начала абзаца при плотном наборе без отступов между абзацами.

Строка смещается по горизонтали относительно начала строки.

Пример
div {
text-indent: 20px;
}

👉 @frontendInterview

Weekend Offer от Вконтакте для фронтенд-разработчиков стартует 19 марта несмотря ни на что

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

Уже 19 марта Вконтакте проведёт общую встречу с тимлидами и СТО, на которой они расскажут про задачи и продукты, чуть позже проведут технические собеседования. А 20 марта пройдёт финальное интервью со всеми, кто успешно пройдёт первый этап, чтобы обсудить условия работы.

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

Поспешите оставить заявку: https://tprg.ru/1kZ0

🎯 Хочешь овладеть Vue.js на продвинутом уровне?

Начни 23 марта на вебинаре «Организация кода и паттерны Vue» в OTUS.
Его проведет Юрий Тимофеев, Senior Software Engineer в EPAM Systems.

Разберем, как структурировать файлы и код в приложении по мере роста кодовой базы, а также паттерны service pattern, fabric pattern, библиотеку axios и provide/inject.

Участие бесплатное, но вебинар доступен только тем, кто знаком с JavaScript.

📚 Пройди тест и регистрируйся https://otus.pw/UP8B/

👉 @frontendInterview

​Какие бывают глобальные атрибуты в HTML?

Существует категория HTML-атрибутов, которые можно применить к любому или почти любому HTML-тегу.
Пример глобального атрибута, с которым вы точно работаете постоянно — class. Его можно задать абсолютно любому тегу.

Несколько глобальных атрибутов:

contenteditable
Делает любой элемент на странице редактируемым. В качестве значения для атрибута contenteditable используют true или false.

data-*
Это группа атрибутов, позволяющая перекидывать данные между HTML и DOM. Часто используется для взаимодействия с HTML при помощи JavaScript. Если не требуется менять внешний вид элемента, то это удобнее, чем передёргивать классы.

hidden
Не требует явного указания значения, наличие атрибута само по себе означает состояние true. Прячет со страницы любой HTML-элемент. Причём элемент невидим не только для глаз пользователя, но и для скринридеров.

spellcheck
С помощью этого атрибута мы указываем браузеру, что в элементе, которому он задан, нужно проверить правописание. Значение: true или false.

tabindex
Указывает браузеру, нужно ли видеть этот элемент при навигации по странице с помощью клавиатуры. Часто используется для неинтерактивных элементов.
Значение: отрицательное или положительное целое число.

👉 @frontendInterview

👉 @frontendInterview

👉 @frontendInterview

Высоконагруженные приложения

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

👉 @frontendInterview

Find the unique string

Вам дан массив, состоящий из строк. При этом только одна строка уникальна. Создайте функцию, которая найдет и вернет эту уникальную строку.

Примеры:
findUniq([ 'Aa', 'aaa', 'aaaaa', 'BbBb', 'Aaaa', 'AaAaAa', 'a' ]) === 'BbBb'
findUniq([ 'abc', 'acb', 'bac', 'foo', 'bca', 'cab', 'cba' ]) === 'foo'

👉 @frontendInterview