Расскажите про localStorage в браузере.

Локальное хранилище это одна из разновидностей Web Storage API, специального API для хранения данных в браузере в формате ключ-значение. Этот API был создан как решение для проблем с куки и является более интуитивным и безопасным способом хранения простых данных внутри браузера.

Хотя технически мы можем хранить в локальном хранилище только строки, это обходится за счет преобразования в JSON. Таким образом мы можем сохранять в локальном хранилище более сложные данные по сравнению с куки.

Мы можем создавать, читать и удалять данные в локальном хранилище, используя следующий синтаксис:

// Create
const user = { name: 'Ire Aderinokun', age: 25 }
localStorage.setItem('user', JSON.stringify(user));

// Read (Single)
console.log( JSON.parse(localStorage.getItem('user')) )

// Update
const updatedUser = { name: 'Ire Aderinokun', age: 24 }
localStorage.setItem('user', JSON.stringify(updatedUser));

// Delete
localStorage.removeItem('user');

👉 @frontendInterview

👉 @frontendInterview

Веб-компоненты в действии

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

👉 @frontendInterview

Практика каррирования.

Создайте функцию, которая выведет 'Hello World' в консоль, при этом эта функция должна быть вызвана таким образом:
say("Hello")("World")

👉 @frontendInterview

Что такое CORS (Cross-Origin Resource Sharing)?

Совместное использование ресурсов между источниками (CORS) - это механизм, который использует дополнительные заголовки HTTP, чтобы сообщить браузерам о необходимости предоставить веб-приложению, работающему в одном источнике, доступ к выбранным ресурсам из другого источника. Веб-приложение выполняет HTTP-запрос между источниками, когда оно запрашивает ресурс, который имеет другое происхождение (домен, протокол или порт) от его собственного.

👉 @frontendInterview

👉 @frontendInterview

Что такое функция curry?

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

Преобразование функций, которое переводит функцию из вызываемой как f(a, b, c) в вызываемую как f(a)(b)(c) позволяет легко получать частичные данные, избегая многократной передачи одной и той же переменной.

Каррирование создает вложенные функции в соответствии с количеством аргументов функции, поэтому каждая функция получает аргумент. Если аргумента нет, каррирование не выполняется.

👉 @frontendInterview

👉 @frontendInterview

В чем разница между host и native объектами?

Объекты можно разделить на эти две основные категории в зависимости от среды и языка.

1. объекты host: зависящие от среды - например браузер предоставляет определенные объекты, такие как window, node предоставляет NodeList и пр.;

2. собственные / встроенные объекты (native): стандартные объекты, предоставляемые JS, иногда называемые глобальными объектами; JS в основном создается с помощью этих категоризированных нативных объектов (String, Number и пр.).

👉 @frontendInterview

👉 @frontendInterview

React быстро

Как решить проблемы front-end-разработчиков и сделать их жизнь более счастливой? Нужно всего лишь познакомиться с возможностями React! Только так вы сможете быстро выйти на новый уровень и получить не только моральное, но и материальное удовлетворение от веб-разработки.
Успешные пользовательские интерфейсы должны быть визуально интересными, быстрыми и гибкими. React ускоряет тяжелые веб-приложения, улучшая поток данных между компонентами UI. Сайты начинают эффективно и плавно обновлять визуальные элементы, сводя к минимуму время на перезагрузку страниц.
Перед вами труд, над которым на протяжении полутора лет работало более дюжины человек. Тщательно отобранные примеры и подробные комментарии позволяют разработчикам перейти на React быстро, чтобы затем эффективно создавать веб-приложения, используя всю мощь JavaScript.

👉 @frontendInterview

Посчитать возраст

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

calculateAge(2012, 2016) => "You are 4 years old."
calculateAge(1989, 2016) => "You are 27 years old."

👉 @frontendInterview

Расскажите про типы сопоставления Partial и Required в TypeScript

Тип сопоставления Partial<T> помечает все члены сущности, как необязательные (? : ).
Чаще всего необходимость в сопоставимом типе Partial<T> возникает тогда, когда метод в качестве аргумента принимает только часть конкретного типа данных.
interface IAnimal {
readonly name: string;
}

let animal: Partial<IAnimal> = // { readonly name?: string }

Тип сопоставления Required<T> удаляет все необязательные модификаторы ? : приводя члены объекта к обязательным. Простыми словами, Required<T>, помечает модификатор ? : на удаление.
Required является полной противоположностью типу сопоставления Partial<T>.
let v0: Partial<IT>; // { a?: number; b?: string; }, необязательные члены
let v1: Required<IT>; // { a: number; b: string; }, обязательные члены

👉 @frontendInterview

👉 @frontendInterview