+
+## Что это такое?
+
+В отличие от типичного собеседования с разработчиками ПО, на собеседованиях фронтенд-разработчиков меньше внимания уделяется алгоритмам. Большая часть вопросов касается специфичных знаний и компетенций в таких областях, как HTML, CSS, JavaScript.
+
+Несмотря на то, что существуют ресурсы, призванные помочь в подготовке к собеседованию, они сильно отличаются по полноте материалов от тех же ресурсов для разработчиков ПО. Среди того, что существует на сегодняшний день, наиболее полезным может быть сборник вопросов [Front-end Developer Interview Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions). К сожалению, на многие вопросы я не смог найти в сети полные и удовлетворяющие ответы. Поэтому в документе ниже я постарался самостоятельно ответить на них. Будучи открытым репозиторием, этот проект может жить и развиваться благодаря сообществу, поскольку интернет эволюционирует.
+
+## Нужна более общая подготовка?
+
+Вас может заинтересовать [Руководство для прохождения технического интервью](https://github.com/yangshun/tech-interview-handbook), в котором содержится информация для прохождения общих технических интервью, в частности описаны алгоритмы, даны ответы на вопросы по софт-скиллс. Также есть [шпаргалка для интервью](https://github.com/yangshun/tech-interview-handbook/blob/master/preparing/cheatsheet.md)!
+
+
+
+## Содержание
+
+1. [Вопросы по HTML](questions/html-questions.md)
+1. [Вопросы по CSS](questions/css-questions.md)
+1. [Вопросы по JavaScript](questions/javascript-questions.md)
+
+## Переводы
+
+- [English](/README.md)
+- [Simplified Chinese (简体中文)](/Translations/Chinese/README.md)
+- [Tagalog](/Translations/Tagalog/README.md)
+- [Japanese (日本語)](/Translations/Japanese/README.md)
+- [Korean (한국어))](/Translations/Korean/README.md)
+- [Russian (Русский)](/Translations/Russian/README.md)
+
+## Похожее
+
+Если вас интересует, как реализованы структуры данных, посмотрите [Lago](https://github.com/yangshun/lago), библиотеку структур данных и алгоритмов для JavaScript. По большому счету она до сих пор находится в разработке, но я намерен превратить ее в библиотеку, которая может быть использована в производстве, а также быть использована как справочный ресурс для повторения структур данных и алгоритмов.
+
+## Сотрудничество
+
+### Кодекс поведения
+
+Мы приняли тот же Кодекс поведения, что и Facebook, соблюдение которого мы ожидаем от участников проекта. Пожалуйста, прочитайте [полный текст](https://code.facebook.com/codeofconduct), чтобы вы могли понять, какие действия будут и не будут допускаться.
+
+### Руководство по вкладам
+
+Прочтите наше [руководство по вкладам](/CONTRIBUTING.md), чтобы узнать, как вы можете внести свой вклад, как предложить улучшения или если вы заинтересованы в переводе.
+
+### Поддержать
+
+Много часов упорной работы было потрачено на этот проект. Буду признателен за вашу поддержку!
+
+
+
+## Лицензия
+
+Все проекты и пакеты в этом репозитории находятся под [лицензией MIT](/LICENSE).
diff --git a/Translations/Russian/questions/html-questions.md b/Translations/Russian/questions/html-questions.md
new file mode 100644
index 000000000..229bc904e
--- /dev/null
+++ b/Translations/Russian/questions/html-questions.md
@@ -0,0 +1,208 @@
+# Вопросы по HTML
+
+Ответы на [Вопросы кандидату на должность фронтенд-разработчика - Вопросы по HTML](https://github.com/h5bp/Front-end-Developer-Interview-Questions/tree/master/src/translations/russian#html).
+
+* [Для чего нужен DOCTYPE?](#для-чего-нужен-doctype)
+* [Как следует оформлять страницу, содержимое которой может быть на разных языках?](#как-следует-оформлять-страницу-содержимое-которой-может-быть-на-разных-языках)
+* [На что необходимо обратить внимание при разработке мультиязычных сайтов?](#на-что-необходимо-обратить-внимание-при-разработке-мультиязычных-сайтов)
+* [Для чего нужны `data-` атрибуты?](#для-чего-нужны-data-атрибуты)
+* [Представьте HTML5 как открытую веб-платформу. Из каких блоков состоит HTML5?](#представьте-html5-как-открытую-веб-платформу-из-каких-блоков-состоит-html5)
+* [Объясните разницу между `cookie`, `sessionStorage` и `localStorage`.](#объясните-разницу-между-cookie-sessionstorage-и-localstorage)
+* [Объясните разницу между `
+
+
+```
+
+```js
+// Файл загружен с https://example.com?callback=printData
+printData({ name: 'Yang Shun' });
+```
+
+У клиента должна быть функция `printData` в своей глобальной области видимости, и эта функция будет выполнена клиентом, когда будет получен ответ с сервера из другого домена.
+
+JSONP может быть небезопасным и иметь повышенный риск. Поскольку JSONP - это действительно JavaScript, и он может делать все остальное, что может делать JavaScript, то вы должны быть уверены в надежности поставщика данных JSONP.
+
+В наши дни, [CORS](http://en.wikipedia.org/wiki/Cross-origin_resource_sharing) является рекомендуемым подходом и JSONP является способом для его обхода.
+
+###### Ссылки
+
+* https://stackoverflow.com/a/2067584/1751946
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Вы когда-нибудь использовали шаблонизацию на JavaScript? Если да, то какие библиотеки вы использовали?
+
+Да. Handlebars, Underscore, Lodash, AngularJS, и JSX. Мне не нравилась шаблонизация в AngularJS, потому что там активно использовались строки в директивах и легко допустить ошибку при опечатке. JSX - мой новый фаворит, так как он ближе к JavaScript и почти не имеет дополнительного синтаксиса. В настоящее время вы даже можете использовать строковые литералы шаблонов ES2015 в качестве быстрого способа создания шаблонов, не полагаясь на сторонний код.
+
+```js
+const template = `
My name is: ${name}
`;
+```
+
+Однако следует помнить о возможном XSS в вышеприведенном подходе, поскольку содержимое не экранируется, в отличие от библиотек шаблонизации.
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Расскажите, что такое поднятие (hoisting)
+
+Поднятие (hoisting) - это термин, используемый для объяснения поведения объявлений переменных в вашем коде. Переменные, объявленные или инициализированные при помощи ключевого слова `var`, будут перемещены в верхнюю часть текущей области, что мы называем "поднятием". Однако, "поднимается" только объявление переменной, присвоение значения (если оно имеется) останется на прежнем месте.
+
+Обратите внимание, что объявление фактически не перемещается - движок JavaScript анализирует объявления во время компиляции и узнает о объявлениях и их областях видимости. Просто легче понять подобное поведение, представляя объявления как перемещение наверх своей области видимости. Давайте рассмотрим несколько примеров.
+
+```js
+// объявления переменных через var поднимаются.
+console.log(foo); // undefined
+var foo = 1;
+console.log(foo); // 1
+
+// объявления переменных через let/const НЕ поднимаются.
+console.log(bar); // ReferenceError: bar is not defined
+let bar = 2;
+console.log(bar); // 2
+```
+
+При объявлении функции ее тело поднимается наверх, в то время как у функциональных выражений (когда переменной присваивается функция) поднимается только переменная.
+
+```js
+// Объявление функции
+console.log(foo); // [Function: foo]
+foo(); // 'FOOOOO'
+function foo() {
+ console.log('FOOOOO');
+}
+console.log(foo); // [Function: foo]
+
+// Функциональное выражение
+console.log(bar); // undefined
+bar(); // Uncaught TypeError: bar is not a function
+var bar = function() {
+ console.log('BARRRR');
+};
+console.log(bar); // [Function: bar]
+```
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Объясните, что такое всплытие событий (event bubbling)
+
+Когда событие срабатывает на элементе DOM, оно попытается обработать событие (если привязан обработчик), затем событие всплывет вверх к своему родителю и это повторится снова. Подобное всплытие проходит по всем предкам элемента вплоть до `document`. Всплытие событий является механизмом, на котором основано делегирование событий.
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### В чем разница между "атрибутом" (attribute) и "свойством" (property)?
+
+Атрибуты определены в разметке HTML, а свойства определены в DOM. Чтобы проиллюстрировать разницу, представьте, что у нас есть это текстовое поле в HTML: ``.
+
+```js
+const input = document.querySelector('input');
+console.log(input.getAttribute('value')); // Hello
+console.log(input.value); // Hello
+```
+
+Но после того, как вы измените значение текстового поля, добавив к нему "World!", будет:
+
+```js
+console.log(input.getAttribute('value')); // Hello
+console.log(input.value); // Hello World!
+```
+
+###### Ссылки
+
+* https://stackoverflow.com/questions/6003819/properties-and-attributes-in-html
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Почему не следует расширять нативные JavaScript-объекты?
+
+Расширение встроенного/нативног объекта JavaScript означает добавление свойств/функций к его прототипу. Хотя на первый взгляд это может показаться хорошей идеей, на практике это опасно. Представьте, что ваш код использует несколько библиотек, которые расширяют `Array.prototype`, добавляя один и тот же метод `contains`. В результате код будет работать неверно, если поведение этих двух методов не будет одинаковым.
+
+Единственный случай, при котором можно расширить нативный объект - это при создании полифила, создав собственную реализацию метода, который является частью спецификации JavaScript, но может отсутствовать в устаревших браузерах.
+
+###### Ссылки
+
+* http://lucybain.com/blog/2014/js-extending-built-in-objects/
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### В чем разница между событием `load` и событием `DOMContentLoaded`?
+
+Событие `DOMContentLoaded` вызывается, когда исходный HTML-документ полностью загружен и обработан, не дожидаясь окончания загрузки таблиц стилей, изображений и скриптов.
+
+Событие `load` происходит только после загрузки DOM и всех зависимых ресурсов.
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded
+* https://developer.mozilla.org/en-US/docs/Web/Events/load
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### В чем разница между `==` и `===`?
+
+`==` - это оператор абстрактного сравнения, а `===` - оператор строгого сравнения. Оператор `==` будет сравнивать на равенство после выполнения любых необходимых преобразований типов. Оператор `===` не будет выполнять преобразование типов, поэтому, если два значения не одного типа, `===` просто вернет `false`. При использовании `==` могут происходить такие странные вещи, как:
+
+```js
+1 == '1'; // true
+1 == [1]; // true
+1 == true; // true
+0 == ''; // true
+0 == '0'; // true
+0 == false; // true
+```
+
+Мой совет - никогда не используйте оператор `==`, за исключением удобного сравнения с `null` или` undefined`, где выражение `a == null` вернет` true`, если `a` принимает значение `null` или `undefined `.
+
+```js
+var a = null;
+console.log(a == null); // true
+console.log(a == undefined); // true
+```
+
+###### Ссылки
+
+* https://stackoverflow.com/questions/359494/which-equals-operator-vs-should-be-used-in-javascript-comparisons
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Объясните same-origin policy в контексте JavaScript
+
+Same-origin policy (принцип одинакового источника) не позволяет JavaScript выполнять запросы за границы домена. Источник определяется как комбинация схемы URI, имени хоста и номера порта. Этот принцип не позволяет вредоносному сценарию на одной странице получить доступ к конфиденциальным данным на другой через объектную модель документа этой страницы.
+
+###### Ссылки
+
+* https://en.wikipedia.org/wiki/Same-origin_policy
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Сделайте так, чтобы этот код работал:
+
+```js
+duplicate([1, 2, 3, 4, 5]); // [1,2,3,4,5,1,2,3,4,5]
+```
+
+```js
+function duplicate(arr) {
+ return arr.concat(arr);
+}
+
+duplicate([1, 2, 3, 4, 5]); // [1,2,3,4,5,1,2,3,4,5]
+```
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Почему тернарный оператор так называется?
+
+"Тернарный" означает три. Троичное выражение принимает три операнда: условие, выражение "then" и выражение "else". Тернарные операторы не являются исключительными для JavaScript, и я не знаю, почему подобный вопрос был добавлен в этот список.
+
+###### Ссылки
+
+* https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Conditional_Operator
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Что делает строчка "use strict";? Какие достоинства и недостатки от ее использования?
+
+'use strict' это директива, используемая для включения строгого режима во всем скрипте или отдельных функциях.
+
+Преимущества:
+
+* Не позволяет случайно создавать глобальные переменные.
+* Любое присваивание, которое в обычном режиме завершается неудачей, в строгом режиме выдаст исключение.
+* При попытке удалить неудаляемые свойства, выдаст исключение (в то время как в нестрогом режиме никакого действия бы не произошло).
+* Требует, чтобы имена параметров функции были уникальными.
+* `this` в глобальной области видимости равно undefined.
+* Перехватывает распространенные ошибки, выдавая исключения.
+* Исключает неочевидные особенности языка.
+
+Недостатки:
+
+* Нельзя использовать некоторые особенности языка, к которым привыкли некоторые разработчики.
+* Нет доступа к `function.caller` и `function.arguments`.
+* Объединение скриптов, написанных в строгом режиме может вызвать проблемы.
+
+В целом, я думаю, что преимущества перевешивают недостатки, и мне никогда не приходилось полагаться на функции, которые заблокированы в строгом режиме. Я бы порекомендовал использовать строгий режим.
+
+###### Ссылки
+
+* http://2ality.com/2011/10/strict-mode-hatred.html
+* http://lucybain.com/blog/2014/js-use-strict/
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Напишите цикл, который перебирает числа до `100`, возвращая **"fizz"** на числа кратные `3`, **"buzz"** на числа кратные `5` и **"fizzbuzz"** на числа кратные `3` и `5`.
+
+Взгляните на версию FizzBuzz от [Paul Irish](https://gist.github.com/jaysonrowe/1592432#gistcomment-790724).
+
+```js
+for (let i = 1; i <= 100; i++) {
+ let f = i % 3 == 0,
+ b = i % 5 == 0;
+ console.log(f ? (b ? 'FizzBuzz' : 'Fizz') : b ? 'Buzz' : i);
+}
+```
+
+Хотя я бы не советовал вам использовать этот код во время интервью. Просто придерживайтесь длинного, но ясного подхода. Также можете взглянуть на разные безумные реализации FizzBuzz, по ссылке ниже.
+
+###### Ссылки
+
+* https://gist.github.com/jaysonrowe/1592432
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Почему считается хорошим тоном оставить глобальную область видимости (global scope) в нетронутом состоянии?
+
+Каждый скрипт имеет доступ к глобальной области видимости, и если каждый будет использовать глобальное пространство имен для определения своих переменных, то могут возникнуть конфликты. Используйте модульный паттерн (используя IIFE) для инкапсуляции ваших переменных в локальное пространство имен.
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Для чего используют событие `load`? Есть ли у этого события недостатки? Знаете ли вы какие-либо альтернативы, и в каких случаях бы стали их использовать?
+
+Событие `load` происходит в конце процесса загрузки документа. На этом этапе все объекты в документе находятся в DOM, и все изображения, скрипты и ссылки загрузились.
+
+Событие DOM `DOMContentLoaded` будет запущено после создания DOM для страницы, но не будет ждать окончания загрузки других ресурсов. Оно предпочтительно в тех случаях, когда вам не нужно загружать страницу целиком перед инициализацией.
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Расскажите, что такое одностраничное приложение, и как сделать его SEO-оптимизированным.
+
+Текст ниже взят из замечательного [руководства по фронтенду от Grab](https://github.com/grab/front-end-guide), который по счастливой случайности тоже написан мной.
+
+В наши дни веб-разработчики называют свои продукты веб-приложениями, а не веб-сайтами. Хотя между этими двумя терминами нет строгой разницы, веб-приложения, как правило, очень интерактивны и динамичны, что позволяет пользователю выполнять действия и получать мгновенный ответ. Традиционно браузер получает HTML с сервера и отображает его. Когда пользователь переходит на другой URL-адрес, требуется полное обновление страницы, и сервер отправляет свежий HTML-код на новую страницу. Это называется рендерингом на стороне сервера.
+
+Однако в современных SPA вместо этого используется рендеринг на стороне клиента. Браузер загружает начальную страницу с сервера вместе со скриптами (фреймворками, библиотеками, кодом приложения) и таблицами стилей, необходимыми для всего приложения. Когда пользователь переходит на другие страницы, обновление страницы не происходит. URL-адрес страницы обновляется при помощи [HTML5 History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API). Новые данные, необходимые для страницы (обычно в формате JSON), извлекаются браузером посредством запросов [AJAX](https://developer.mozilla.org/en-US/docs/AJAX/Getting_Started) к серверу. Затем SPA динамически обновляет страницу данными через JavaScript, которые были получены при начальной загрузке страницы. Эта модель похожа на работу нативных мобильных приложений.
+
+Преимущества:
+
+* Приложение становится более отзывчивым, и пользователи не видят мерцание при навигации, т.к. страница не обновляется целиком.
+* На сервер поступает меньше HTTP-запросов, так как одни и те же ресурсы не нужно загружать снова для каждой загрузки страницы.
+* Четкое разделение на клиент и сервер. Вы можете легко создавать новые клиентские приложения для разных платформ (например, для мобильных устройств, чат-ботов, умных часов) без необходимости изменять код сервера. Вы также можете изменить технологический стек на клиенте и сервере независимо, пока между ними существует интерфейс.
+
+Недостатки:
+
+* Более тяжелая первоначальная загрузка страницы из-за загрузки кода фреймворка, самого приложения и ресурсов.
+* Ваш сервер должен быть сконфигурирован так, чтобы он направлял все запросы к единой точке входа, и переложил обязанности по навигации на сторону клиента.
+* Для отображения содержимого SPA полагается на JavaScript, но не все поисковые системы выполняют JavaScript во время индексации, и они могут не увидеть содержимое страницы. Это вредит поисковой оптимизации (SEO) вашего приложения. Тем не менее, в большинстве случаев, когда вы создаете приложения, SEO не является наиболее важным фактором, так как не весь контент должен индексироваться поисковыми системами. Чтобы преодолеть это, вы можете либо рендерить свое приложение на стороне сервера, либо использовать такие сервисы, как [Prerender](https://prerender.io/), чтобы "рендерить ваш javascript в браузере, сохранять статический HTML и передавать его поисковым роботам".
+
+###### Ссылки
+
+* https://github.com/grab/front-end-guide#single-page-apps-spas
+* http://stackoverflow.com/questions/21862054/single-page-app-advantages-and-disadvantages
+* http://blog.isquaredsoftware.com/presentations/2016-10-revolution-of-web-dev/
+* https://medium.freecodecamp.com/heres-why-client-side-rendering-won-46a349fadb52
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Насколько вы опытны в работе с промисами (promises) и/или их полифилами?
+
+Обладаю практическими знаниями о них. Промис - это объект, который может вернуть одно значение в будущем: либо выполненное значение, либо причина, по которой оно не было выполнено (например, произошла ошибка сети). Промис может находиться в одном из 3 возможных состояний: выполнено, отклонено или ожидает выполнения. При использовании промисов можно добавлять callback-функции для обработки выполненного значения или причины отказа.
+
+Некоторыми распространенными полифилами являются `$.deferred`, Q и Bluebird, но не все они соответствуют спецификации. ES2015 поддерживает промисы "из коробки", и в настоящее время полифилы обычно не нужны.
+
+###### Ссылки
+
+* https://medium.com/javascript-scene/master-the-javascript-interview-what-is-a-promise-27fc71e77261
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Какие преимущества и недостатки при использовании промисов вместо колбэков (callbacks)?
+
+**Преимущества**
+
+* Помогает избежать "callback hell", который может быть нечитаемым.
+* Упрощает написание последовательного удобочитаемого асинхронного кода с помощью `.then()`.
+* Упрощает написание параллельного асинхронного кода с помощью `Promise.all()`.
+* С использованием промисов можно избежать следующих проблем, которые возникают при использовании callback-функций:
+ * Колбэк-функция была вызвана слишком рано
+ * Колбэк-функция была вызвана слишком поздно (или вовсе не была вызвана)
+ * Колбэк-функция была вызвана слишком мало или слишком много раз
+ * Не удалось передать необходимую среду/параметры
+ * Были пропущены ошибки/исключения
+
+**Недостатки**
+
+* Чуть более сложный код (спорно).
+* В старых браузерах, где не поддерживается ES2015, вам нужно загрузить полифил, чтобы их использовать.
+
+###### Ссылки
+
+* https://github.com/getify/You-Dont-Know-JS/blob/master/async%20%26%20performance/ch3.md
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Каковы преимущества и недостатки написания JavaScript-кода на языке, который компилируется в JavaScript?
+
+Вот несколько языков, которые компилируются в JavaScript: CoffeeScript, Elm, ClojureScript, PureScript и TypeScript.
+
+Преимущества:
+
+* Исправляют некоторые давние проблемы в JavaScript и препятствует использованию анти-паттернов в JavaScript.
+* Позволяют писать более короткий код, предоставляя синтаксический сахар поверх JavaScript, которого, как мне кажется, не хватало в ES5, но с приходом ES2015 все изменилось.
+* Статическая типизация идеальна (в случае TypeScript) для больших проектов, которые необходимо поддерживать с течением времени.
+
+Недостатки:
+
+* Необходима сборка/компиляция кода, так как браузеры запускают только JavaScript, и ваш код должен быть скомпилирован в JavaScript перед тем, как он будет передан в браузеры.
+* Отладка может быть трудной, если карты кода (source maps) плохо сопоставляются с исходным кодом.
+* Большинство разработчиков не знакомы с этими языками и должны будут изучить их. Если ваша команда будет использовать их для своих проектов, это приведет к увеличению затрат.
+* Меньшее сообщество (зависит от языка), что означает, что будет труднее найти ресурсы, учебные пособия, библиотеки и инструменты.
+* Может отсутствовать поддержка в IDE/редакторе.
+* Эти языки всегда будут позади последнего стандарта JavaScript.
+* Разработчики должны знать, во что компилируется их код - потому что это то, что будет запускаться в браузере, и это наиболее важно.
+
+По большому счету, ES2015 значительно улучшил JavaScript и сделал разработку на нем намного удобнее. Я не вижу причин использовать CoffeeScript в наши дни.
+
+###### Ссылки
+
+* https://softwareengineering.stackexchange.com/questions/72569/what-are-the-pros-and-cons-of-coffeescript
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Какие инструменты и методы вы используете при отладке кода?
+
+* React и Redux
+ * [React Devtools](https://github.com/facebook/react-devtools)
+ * [Redux Devtools](https://github.com/gaearon/redux-devtools)
+* Vue
+ * [Vue Devtools](https://github.com/vuejs/vue-devtools)
+* JavaScript
+ * [Chrome Devtools](https://hackernoon.com/twelve-fancy-chrome-devtools-tips-dc1e39d10d9d)
+ * Выражение `debugger`
+ * Отладка при помощи старого доброго `console.log`
+
+###### Ссылки
+
+* https://hackernoon.com/twelve-fancy-chrome-devtools-tips-dc1e39d10d9d
+* https://raygun.com/blog/javascript-debugging/
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Какие языковые конструкции вы используете для итерации по свойствам объекта и элементам массива?
+
+Для объектов:
+
+* `for-in` циклы - `for (var property in obj) { console.log(property); }`. Тем не менее, он также будет перебирать его унаследованные свойства, и вам нужно добавить проверку `obj.hasOwnProperty(property)` перед его использованием.
+* `Object.keys()` - `Object.keys(obj).forEach(function (property) { ... })`. `Object.keys()`- это статический метод, который возвращает все перечисляемые свойства объекта.
+* `Object.getOwnPropertyNames()` - `Object.getOwnPropertyNames(obj).forEach(function (property) { ... })`. `Object.getOwnPropertyNames()` - это статический метод, который возвращает все перечисляемые и неперечисляемые свойства объекта.
+
+Для массивов:
+
+* Циклы `for` - `for (var i = 0; i < arr.length; i++)`. Распространенной ошибкой здесь является то, что `var` находится в области видимости функции, а не в блочной области видимости, и в большинстве случаев нам нужна переменная-итератор блочной области. ES2015 позволяет использовать `let`, который имеет блочную область видимости, и рекомендуется использовать его вместо `var`. В итоге: `for (let i = 0; i < arr.length; i++)`.
+* `forEach` - `arr.forEach(function (el, index) { ... })`. Эта конструкция иногда может быть более удобной, потому что вам не нужно использовать `index`, если все, что вам нужно, это элементы массива. Существуют также методы `every` и `some`, которые позволят вам досрочно завершить итерацию.
+* `for-of` циклы - `for (let elem of arr) { ... }`. ES6 представил новый цикл for-of, который позволяет перебирать объекты, которые соответствуют [итерируемому протоколу](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Iteration_protocols) такие как `String`, `Array`, `Map`, `Set`, и т.д. Он сочетает в себе преимущества цикла `for` и метода `forEach()`. Преимущество цикла `for` заключается в том, что его можно преждевременно завершить, а преимущество `forEach()` заключается в том, что он более лаконичен, чем цикл `for`, поскольку вам не нужна переменная счетчика. С циклом `for-of` вы получаете возможность выхода из цикла и более сжатый синтаксис.
+
+В большинстве случаев я бы предпочел метод `.forEach`, но он зависит от того, что вы пытаетесь сделать. До ES6 мы использовали циклы `for`, если нам нужно было преждевременно завершить цикл при помощи `break`. Но теперь с ES6 мы можем сделать это с помощью циклов `for-of`. Я использую циклы `for`, когда мне нужно еще больше гибкости, например, в случае увеличения итератора более одного раза за цикл.
+
+Кроме того, при использовании цикла `for-of`, если вам нужен доступ как к индексу, так и к значению каждого элемента массива, вы можете сделать это с помощью метода ES6 `entries()` и деструктуризации:
+
+```
+const arr = ['a', 'b', 'c'];
+
+for (let [index, elem] of arr.entries()) {
+ console.log(index, ': ', elem);
+}
+```
+
+###### Ссылки
+
+- http://2ality.com/2015/08/getting-started-es6.html#from-for-to-foreach-to-for-of
+- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/entries
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Объясните разницу между изменяемыми (mutable) и неизменяемыми (immutable) объектами
+
+* Приведите пример неизменяемого объекта в JavaScript
+* Какие преимущества и недостатки у неизменяемости?
+* Как вы можете достигнуть неизменяемости в вашем коде?
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Объясните разницу между синхронными и асинхронными функциями
+
+Синхронные функции являются блокирующими, а асинхронные - нет. В синхронных функциях одна операция должна завершиться, прежде чем будет запущена следующая операция. В этом случае скрипт выполняется строго по порядку операций, и выполнение скрипта приостанавливается, если одна из операций занимает очень много времени.
+
+Асинхронные функции обычно принимают callback-функцию в качестве параметра, и выполнение продолжается на следующей строке сразу после вызова асинхронной функции. Callback-функция вызывается только тогда, когда асинхронная операция завершена и стек вызовов пуст. Ресурсоемкие операции, такие как загрузка данных с веб-сервера или запросы к базе данных, должны выполняться асинхронно, чтобы основной поток мог продолжать выполнять другие операции вместо блокировки до завершения этой долгой операции (в случае браузеров пользовательский интерфейс будет зависать).
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Что такое цикл событий (event loop)? В чем разница между стеком вызовов (call stack) и очередью событий (task queue)?
+
+Цикл событий - это однопоточный цикл, который контролирует стек вызовов и проверяет, есть ли какая-либо работа, которую необходимо выполнить в очереди задач. Если стек вызовов пуст и в очереди задач есть callback-функции, то функция удаляется из очереди и помещается в стек вызовов для выполнения.
+
+Рекомендую ознакомиться с [докладом о цикле событий от Philip Robert](https://2014.jsconf.eu/speakers/philip-roberts-what-the-heck-is-the-event-loop-anyway.html). Это одно из самых популярных видео о JavaScript.
+
+###### Ссылки
+
+* https://2014.jsconf.eu/speakers/philip-roberts-what-the-heck-is-the-event-loop-anyway.html
+* http://theproactiveprogrammer.com/javascript/the-javascript-event-loop-a-stack-and-a-queue/
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Объясните разницу при использовании `foo` в `function foo() {}` и `var foo = function() {}`
+
+Первое - объявление функции, а второе - функциональное выражение. Ключевое отличие состоит в том, что тело функции при объявлении поднимается наверх, а тело функциональных выражений - нет (они имеют такое же поведение поднятия, что и переменные). Для получения более подробной информации, обратитесь к вопросу выше [о поднятии](#расскажите-что-такое-поднятие-hoisting). Если вы попытаетесь вызвать выражение функции до того, как оно будет определено, вы получите ошибку `Uncaught TypeError: XXX is not a function`.
+
+**Объявление функции**
+
+```js
+foo(); // 'FOOOOO'
+function foo() {
+ console.log('FOOOOO');
+}
+```
+
+**Функциональное выражение**
+
+```js
+foo(); // Uncaught TypeError: foo is not a function
+var foo = function() {
+ console.log('FOOOOO');
+};
+```
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### В чем различие между переменными, созданными при помощи `let`, `var` и `const`?
+
+Переменные, объявленные при помощи ключевого слова `var`, относятся к области видимости функции, в которой они созданы. Или, если они созданы вне какой-либо функции - к глобальному объекту. `let` и `const` относятся к блочной области видимости - это означает, что они доступны только в пределах ближайшего набора фигурных скобок (функция, блок if-else или цикл for).
+
+```js
+function foo() {
+ // Все переменные доступны внутри функции.
+ var bar = 'bar';
+ let baz = 'baz';
+ const qux = 'qux';
+
+ console.log(bar); // bar
+ console.log(baz); // baz
+ console.log(qux); // qux
+}
+
+console.log(bar); // ReferenceError: bar is not defined
+console.log(baz); // ReferenceError: baz is not defined
+console.log(qux); // ReferenceError: qux is not defined
+```
+
+```js
+if (true) {
+ var bar = 'bar';
+ let baz = 'baz';
+ const qux = 'qux';
+}
+
+// переменные, объявленные при помощи var, доступны в любом месте функции.
+console.log(bar); // bar
+// переменные, объявленные при помощи let и const не доступны вне блока, в котором были определены.
+console.log(baz); // ReferenceError: baz is not defined
+console.log(qux); // ReferenceError: qux is not defined
+```
+
+`var` позволяет поднимать переменные, что означает, что на них можно ссылаться в коде до их объявления. `let` и `const` не позволяют этого, и выдают ошибку.
+
+```js
+console.log(foo); // undefined
+
+var foo = 'foo';
+
+console.log(baz); // ReferenceError: can't access lexical declaration 'baz' before initialization
+
+let baz = 'baz';
+
+console.log(bar); // ReferenceError: can't access lexical declaration 'bar' before initialization
+
+const bar = 'bar';
+```
+
+Переопределение переменной с помощью `var` не вызовет ошибку, в отличие от `let` и `const`.
+
+```js
+var foo = 'foo';
+var foo = 'bar';
+console.log(foo); // "bar"
+
+let baz = 'baz';
+let baz = 'qux'; // Uncaught SyntaxError: Identifier 'baz' has already been declared
+```
+
+`let` отличается от `const` тем, что изменять значение `const` нельзя.
+
+```js
+// Это нормально.
+let foo = 'foo';
+foo = 'bar';
+
+// Это вызывает исключение.
+const baz = 'baz';
+baz = 'qux';
+```
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### В чем разница между классом в ES6 и функцией-конструктором в ES5?
+
+Для начала посмотрим на примеры:
+
+```js
+// ES5 функция-конструктор
+function Person(name) {
+ this.name = name;
+}
+
+// ES6 класс
+class Person {
+ constructor(name) {
+ this.name = name;
+ }
+}
+```
+
+Они выглядят довольно похоже, если рассматривать простые конструкторы.
+
+Основное отличие в конструкторе возникает при использовании наследования. Если мы хотим создать класс `Student` (который будет являться подклассом класса `Person`) и добавить поле `studentId`, то, в дополнение к вышеописанному, мы должны сделать следующее:
+
+```js
+// ES5 функция-конструктор
+function Student(name, studentId) {
+ // Вызов конструктора суперкласса для инициализации производных от суперкласса членов.
+ Person.call(this, name);
+
+ // Инициализация собственных членов подкласса.
+ this.studentId = studentId;
+}
+
+Student.prototype = Object.create(Person.prototype);
+Student.prototype.constructor = Student;
+
+// ES6 класс
+class Student extends Person {
+ constructor(name, studentId) {
+ super(name);
+ this.studentId = studentId;
+ }
+}
+```
+
+Наследование в синтаксисе ES5 является намного более многословным, а в ES6 более понятное и усваиваемое.
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Inheritance
+* https://eli.thegreenplace.net/2013/10/22/classical-inheritance-in-javascript-es5
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Можете ли вы привести пример использования стрелочных функции =>? Чем они отличаются от других функций?
+
+Одним очевидным преимуществом стрелочных функций является упрощение синтаксиса, необходимого для создания функций, без необходимости использования ключевого слова `function`. `This` внутри стрелочных функций также привязано к замыкающей области видимости, в отличие от обычных функций, где `this` определяется контекстом, в котором они вызываются. Лексически привязанное `this` полезно при вызове callback-функций, особенно в компонентах React.
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### В чем преимущество использования стрелочных функций для метода в конструкторе?
+
+Основным преимуществом использования стрелочной функции в качестве метода внутри конструктора является то, что значение `this` устанавливается во время создания функции и не может измениться после этого. Таким образом, когда конструктор используется для создания нового объекта, `this` всегда будет ссылаться на этот объект. Например, допустим, у нас есть конструктор Person, который принимает имя в качестве аргумента, имеет два метода для вывода в консоль этого имени, один в качестве обычной функции, а другой в качестве стрелочной:
+
+```js
+const Person = function(firstName) {
+ this.firstName = firstName;
+ this.sayName1 = function() { console.log(this.firstName); };
+ this.sayName2 = () => { console.log(this.firstName); };
+};
+
+const john = new Person('John');
+const dave = new Person('Dave');
+
+john.sayName1(); // John
+john.sayName2(); // John
+
+// У обычной функции значение `this` может быть изменено, но у стрелочной функции нет
+john.sayName1.call(dave); // Dave (потому что 'this' сейчас ссылается на объект dave)
+john.sayName2.call(dave); // John
+
+john.sayName1.apply(dave); // Dave (потому что 'this' сейчас ссылается на объект dave)
+john.sayName2.apply(dave); // John
+
+john.sayName1.bind(dave)(); // Dave (потому что 'this' сейчас ссылается на объект dave)
+john.sayName2.bind(dave)(); // John
+
+var sayNameFromWindow1 = john.sayName1;
+sayNameFromWindow1(); // undefined (потому что 'this' сейчас ссылается на объект window)
+
+var sayNameFromWindow2 = john.sayName2;
+sayNameFromWindow2(); // John
+```
+
+Смысл заключается в том, что `this` можно изменить для обычной функции, но для стрелочных функций контекст всегда остается неизменным. Поэтому, даже если вы передаете стрелочную функцию в разные части вашего приложения, вам не нужно беспокоиться об изменении контекста.
+
+Это может быть особенно полезно в классовых React-компонентах. Если вы определяете метод класса для чего-то такого, как обработчик клика, используя обычную функцию, а затем передаете этот обработчик в дочерний компонент в качестве `prop`, вам также необходимо привязать `this` в конструкторе родительского компонента , Если вместо этого вы используете стрелочную функцию, то нет необходимости привязывать "this", так как метод автоматически получит свое значение "this" из замыкающего лексического контекста. (Прочитайте эту статью о стрелочных функциях: https://medium.com/@machnicki/handle-events-in-react-with-arrow-functions-ede88184bbb)
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions
+* https://medium.com/@machnicki/handle-events-in-react-with-arrow-functions-ede88184bbb
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Дайте определение функции высшего порядка
+
+Функция высшего порядка - это любая функция, которая принимает одну или несколько функций в качестве аргументов, которые она использует для работы с данными и/или возвращает функцию в качестве результата. Функции высшего порядка предназначены для абстрагирования некоторой операции, которая выполняется повторно. Классическим примером является метод `map`, который принимает массив и функцию в качестве аргументов. Затем `map` использует эту функцию для преобразования каждого элемента в массиве, возвращая новый массив с преобразованными данными. Другими популярными примерами в JavaScript являются `forEach`, `filter` и `reduce`. Функции высшего порядка используют не только для манипуляций с массивами, но также и для возврата функции из другой функции, например при использовании `Function.prototype.bind`.
+
+**Map**
+
+Допустим, у нас есть массив с именами, которые нам нужны о преобразовать в верхний регистр.
+
+```js
+const names = ['irish', 'daisy', 'anna'];
+```
+
+Императивное решение будет выглядеть так:
+
+```js
+const transformNamesToUppercase = function(names) {
+ const results = [];
+ for (let i = 0; i < names.length; i++) {
+ results.push(names[i].toUpperCase());
+ }
+ return results;
+};
+transformNamesToUppercase(names); // ['IRISH', 'DAISY', 'ANNA']
+```
+
+Воспользууемся `.map(transformerFn)`, чтобы сделать код декларативным и более коротким:
+
+```js
+const transformNamesToUppercase = function(names) {
+ return names.map(name => name.toUpperCase());
+};
+transformNamesToUppercase(names); // ['IRISH', 'DAISY', 'ANNA']
+```
+
+###### Ссылки
+
+* https://medium.com/javascript-scene/higher-order-functions-composing-software-5365cf2cbe99
+* https://hackernoon.com/effective-functional-javascript-first-class-and-higher-order-functions-713fde8df50a
+* https://eloquentjavascript.net/05_higher_order.html
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Можете ли вы привести пример деструктуризации объекта или массива?
+
+Деструктуризация - это выражение, доступное в ES6, которое предоставляет краткий и удобный способ извлекать значения из объектов или массивов и помещать их в отдельные переменные.
+
+**Деструктуризация массива**
+
+```js
+// Присваивание переменной
+const foo = ['one', 'two', 'three'];
+
+const [one, two, three] = foo;
+console.log(one); // "one"
+console.log(two); // "two"
+console.log(three); // "three"
+```
+
+```js
+// Перестановка переменных местами
+let a = 1;
+let b = 3;
+
+[a, b] = [b, a];
+console.log(a); // 3
+console.log(b); // 1
+```
+
+**Деструктуризация объекта**
+
+```js
+// Присваивание переменной
+const o = { p: 42, q: true };
+const { p, q } = o;
+
+console.log(p); // 42
+console.log(q); // true
+```
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
+* https://ponyfoo.com/articles/es6-destructuring-in-depth
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Шаблонные строки в ES6 намного упрощают создание строк, можете ли вы привести пример их использования?
+
+Шаблонные строки помогают упростить строковую строк или включение переменных в строку. До ES2015 писали так:
+
+```js
+var person = { name: 'Tyler', age: 28 };
+console.log('Hi, my name is ' + person.name + ' and I am ' + person.age + ' years old!');
+// 'Hi, my name is Tyler and I am 28 years old!'
+```
+
+С приходом шаблонных строк в ES6 стало намного проще:
+
+```js
+const person = { name: 'Tyler', age: 28 };
+console.log(`Hi, my name is ${person.name} and I am ${person.age} years old!`);
+// 'Hi, my name is Tyler and I am 28 years old!'
+```
+
+Обратите внимание, что для шаблонных строк используются обратные кавычки, а не простые. Переменные добавляются в подстановки `${}`, обозначаемые знаком доллара и фигурными скобками.
+
+Второй пример использования заключается в создании многострочных литералов. До ES2015 перенос осуществлялся следующим образом:
+
+```js
+console.log('This is line one.\nThis is line two.');
+// This is line one.
+// This is line two.
+```
+
+Или же, чтобы не приходилось прокручивать длинную строку в текстовом редакторе, можно было разбить код на несколько строк в коде, таким образом:
+
+```js
+console.log('This is line one.\n' +
+ 'This is line two.');
+// This is line one.
+// This is line two.
+```
+
+Однако шаблонные строки сохраняют любой интервал, который вы добавляете к ним. Например, чтобы создать тот же многострочный литерал, который мы создали выше, вы можете просто написать:
+
+```js
+console.log(`This is line one.
+This is line two.`);
+// This is line one.
+// This is line two.
+```
+
+Еще одним вариантом использования шаблонных строк будет использование в качестве замены библиотек шаблонизации для интерполяции переменных:
+
+```js
+const person = { name: 'Tyler', age: 28 };
+document.body.innerHTML = `
+
+
Name: ${person.name}
+
Name: ${person.age}
+
+`
+```
+
+**Обратите внимание, что ваш код может быть восприимчив к XSS при использовании `.innerHTML`. Очищайте ваши данные перед отображением, если они получены от пользователя!**
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Можете ли вы привести пример каррированной функции (curry function) и в чем их преимущество?
+
+Каррирование - это паттерн, где функция с более чем одним параметром разбивается на несколько функций, которые при последовательном вызове будут накапливать все необходимые параметры по одному. Этот метод может быть полезен для облегчения чтения и написания кода, написанного в функциональном стиле. Важно отметить, что каррированная функция должна начинаться как одна функция, а затем разбиваться на последовательность функций, каждая из которых принимает один параметр.
+
+```js
+function curry(fn) {
+ if (fn.length === 0) {
+ return fn;
+ }
+
+ function _curried(depth, args) {
+ return function(newArgument) {
+ if (depth - 1 === 0) {
+ return fn(...args, newArgument);
+ }
+ return _curried(depth - 1, [...args, newArgument]);
+ };
+ }
+
+ return _curried(fn.length, []);
+}
+
+function add(a, b) {
+ return a + b;
+}
+
+var curriedAdd = curry(add);
+var addFive = curriedAdd(5);
+
+var result = [0, 1, 2, 3, 4, 5].map(addFive); // [5, 6, 7, 8, 9, 10]
+```
+
+###### Ссылки
+
+* https://hackernoon.com/currying-in-js-d9ddc64f162e
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### В чем преимущества использования spread оператора и чем он отличается от rest оператора?
+
+Spread оператор синтаксиса ES6 очень полезен при написании кода в функциональном стиле, поскольку мы можем легко создавать копии массивов или объектов, не прибегая к `Object.create`,` slice` или функции библиотеки. Эта языковая функция часто используется в проектах с Redux и rx.js.
+
+```js
+function putDookieInAnyArray(arr) {
+ return [...arr, 'dookie'];
+}
+
+const result = putDookieInAnyArray(['I', 'really', "don't", 'like']); // ["I", "really", "don't", "like", "dookie"]
+
+const person = {
+ name: 'Todd',
+ age: 29,
+};
+
+const copyOfTodd = { ...person };
+```
+
+В свою очередь, rest оператор синтаксиса ES6 позволяет в сокращенном виде указывать неопределенное количество аргументов, передаваемых в функцию. Можно сказать, что он противоположен spread оператору: собирает данные и добавляет их в массив, вместо разделения массива данных. Он используется в аргументах функций, а также при деструктуризации массивов и объектов.
+
+```js
+function addFiveToABunchOfNumbers(...numbers) {
+ return numbers.map(x => x + 5);
+}
+
+const result = addFiveToABunchOfNumbers(4, 5, 6, 7, 8, 9, 10); // [9, 10, 11, 12, 13, 14, 15]
+
+const [a, b, ...rest] = [1, 2, 3, 4]; // a: 1, b: 2, rest: [3, 4]
+
+const { e, f, ...others } = {
+ e: 1,
+ f: 2,
+ g: 3,
+ h: 4,
+}; // e: 1, f: 2, others: { g: 3, h: 4 }
+```
+
+###### Ссылки
+
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters
+* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Каким образом можно обмениваться кодом между файлами?
+
+Это зависит от среды выполнения JavaScript.
+
+На клиенте (в среде браузера), пока переменные/функции объявлены в глобальной области видимости (`window`), все скрипты могут на них ссылаться. В качестве альтернативы, используйте Asynchronous Module Definition (AMD) через RequireJS для модульного подхода.
+
+На сервере (Node.js) обычно используется CommonJS. Каждый файл считается модулем, и он может экспортировать переменные и функции, добавляя их к объекту `module.exports`.
+
+ES2015 позволяет использовать модульный синтаксис, который призван заменить как AMD, так и CommonJS. В конечном итоге он будет поддерживаться как в браузере, так и в Node.
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+###### Ссылки
+
+* http://requirejs.org/docs/whyamd.html
+* https://nodejs.org/docs/latest/api/modules.html
+* http://2ality.com/2014/09/es6-modules-final.html
+
+### Для чего используются статические члены класса?
+
+Члены статических классов (свойства/методы) не привязаны к конкретному экземпляру класса и имеют одинаковое значение вне зависимости от того, какой экземпляр ссылается на них. Статические свойства обычно являются конфигурационными переменными, а статические методы обычно являются чисто служебными функциями, которые не зависят от состояния экземпляра.
+
+###### Ссылки
+
+* https://stackoverflow.com/questions/21155438/when-to-use-static-variables-methods-and-when-to-use-instance-variables-methods
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Другие ответы
+
+* http://flowerszhong.github.io/2013/11/20/javascript-questions.html
+
+ 
+
+## Лицензия
+
+Все проекты и пакеты в этом репозитории находятся под [лицензией MIT](/LICENSE).
diff --git a/Translations/Russian/questions/html-questions.md b/Translations/Russian/questions/html-questions.md
new file mode 100644
index 000000000..229bc904e
--- /dev/null
+++ b/Translations/Russian/questions/html-questions.md
@@ -0,0 +1,208 @@
+# Вопросы по HTML
+
+Ответы на [Вопросы кандидату на должность фронтенд-разработчика - Вопросы по HTML](https://github.com/h5bp/Front-end-Developer-Interview-Questions/tree/master/src/translations/russian#html).
+
+* [Для чего нужен DOCTYPE?](#для-чего-нужен-doctype)
+* [Как следует оформлять страницу, содержимое которой может быть на разных языках?](#как-следует-оформлять-страницу-содержимое-которой-может-быть-на-разных-языках)
+* [На что необходимо обратить внимание при разработке мультиязычных сайтов?](#на-что-необходимо-обратить-внимание-при-разработке-мультиязычных-сайтов)
+* [Для чего нужны `data-` атрибуты?](#для-чего-нужны-data-атрибуты)
+* [Представьте HTML5 как открытую веб-платформу. Из каких блоков состоит HTML5?](#представьте-html5-как-открытую-веб-платформу-из-каких-блоков-состоит-html5)
+* [Объясните разницу между `cookie`, `sessionStorage` и `localStorage`.](#объясните-разницу-между-cookie-sessionstorage-и-localstorage)
+* [Объясните разницу между `
+
+
+```
+
+```js
+// Файл загружен с https://example.com?callback=printData
+printData({ name: 'Yang Shun' });
+```
+
+У клиента должна быть функция `printData` в своей глобальной области видимости, и эта функция будет выполнена клиентом, когда будет получен ответ с сервера из другого домена.
+
+JSONP может быть небезопасным и иметь повышенный риск. Поскольку JSONP - это действительно JavaScript, и он может делать все остальное, что может делать JavaScript, то вы должны быть уверены в надежности поставщика данных JSONP.
+
+В наши дни, [CORS](http://en.wikipedia.org/wiki/Cross-origin_resource_sharing) является рекомендуемым подходом и JSONP является способом для его обхода.
+
+###### Ссылки
+
+* https://stackoverflow.com/a/2067584/1751946
+
+[[↑] Наверх](#вопросы-по-javascript)
+
+### Вы когда-нибудь использовали шаблонизацию на JavaScript? Если да, то какие библиотеки вы использовали?
+
+Да. Handlebars, Underscore, Lodash, AngularJS, и JSX. Мне не нравилась шаблонизация в AngularJS, потому что там активно использовались строки в директивах и легко допустить ошибку при опечатке. JSX - мой новый фаворит, так как он ближе к JavaScript и почти не имеет дополнительного синтаксиса. В настоящее время вы даже можете использовать строковые литералы шаблонов ES2015 в качестве быстрого способа создания шаблонов, не полагаясь на сторонний код.
+
+```js
+const template = `
+