Можете ли вы описать основное различие между циклом `.forEach` и циклом `.map()`?

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

forEach
- Перебирает элементы в массиве.
- Вызывает callback-функцию для каждого элемента.
- Не возвращает значение.

 const a = [1, 2, 3];
 const doubled = a.forEach((num, index) => {
   // Делаем что-либо с num и/или index.
 });
 // doubled = undefined

map
- Перебирает элементы в массиве.
- “Сопоставляет” каждый элемент с новым элементом, вызывая функцию для каждого элемента, создавая в результате новый массив.

 const a = [1, 2, 3];
 const doubled = a.map(num => {
   return num * 2;
 });
 // doubled = [2, 4, 6]

Основное различие между .forEach и .map() состоит в том, что .map() возвращает новый массив. Если вам нужен результат, но вы не хотите изменять исходный массив, .map() — очевидный выбор. Если вам просто нужно перебрать массив, то стоит воспользоваться forEach.

👉 @frontendInterview

👉 @frontendInterview

В каких случаях обычно используются анонимные функции?

Они могут использоваться в IIFE для инкапсуляции кода в локальную область видимости, чтобы объявленные в ней переменные не попадали в глобальную область видимости.

 (function() {
   // Здесь код функции.
 })();

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

 setTimeout(function() {
   console.log('Hello world!');
 }, 1000);

Аргументы в конструкциях функционального программирования или Lodash (аналогично callback-функциям).
const arr = [1, 2, 3];
const double = arr.map(function(el) {
return el * 2;
});
console.log(double); // [2, 4, 6]

👉 @frontendInterview

Не заставляйте меня думать. Веб-юзабилити и здравый смысл

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

👉 @frontendInterview

Не пейте воду

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

======================
| Density Chart |
======================
| Honey | H | 1.36 |
| Water | W | 1.00 |
| Alcohol | A | 0.87 |
| Oil | O | 0.80 |
----------------------

[ [
['H', 'H', 'W', 'O'], ['O','O','O','O']
['W', 'W', 'O', 'W'], => ['W','W','W','W']
['H', 'H', 'O', 'O'] ['H','H','H','H']
] ]

👉 @frontendInterview

В чем разница между `==` и `===`?

== — это оператор абстрактного сравнения, а === — оператор строгого сравнения. Оператор == будет сравнивать на равенство после выполнения любых необходимых преобразований типов. Оператор === не будет выполнять преобразование типов, поэтому, если два значения не одного типа, === просто вернет false. При использовании == могут происходить такие странные вещи, как:

 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 .
var a = null;
console.log(a == null); // true
console.log(a == undefined); // true

👉 @frontendInterview

👉 @frontendInterview

Почему не следует расширять нативные JavaScript-объекты?

Расширение встроенного/нативного объекта JavaScript означает добавление свойств/функций к его прототипу. Хотя на первый взгляд это может показаться хорошей идеей, на практике это опасно. Представьте, что ваш код использует несколько библиотек, которые расширяют Array.prototype, добавляя один и тот же метод contains. В результате код будет работать неверно, если поведение этих двух методов не будет одинаковым.

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

👉 @frontendInterview

👉 @frontendInterview

👉 @frontendInterview

👉 @frontendInterview

​Каковы преимущества и недостатки написания JavaScript-кода на языке, который компилируется в JavaScript?

Вот несколько языков, которые компилируются в JavaScript: CoffeeScript, Elm, ClojureScript, PureScript и TypeScript.

Преимущества:
- Исправляют некоторые давние проблемы в JavaScript и препятствует использованию анти-паттернов в JavaScript.
- Позволяют писать более короткий код, предоставляя синтаксический сахар поверх JavaScript, которого, как мне кажется, не хватало в ES5, но с приходом ES2015 все изменилось.
- Статическая типизация идеальна (в случае TypeScript) для больших проектов, которые необходимо поддерживать с течением времени.

Недостатки:
- Необходима сборка/компиляция кода, так как браузеры запускают только JavaScript, и ваш код должен быть скомпилирован в JavaScript перед тем, как он будет передан в браузеры.
- Отладка может быть трудной, если карты кода (source maps) плохо сопоставляются с исходным кодом.
- Большинство разработчиков не знакомы с этими языками и должны будут изучить их. Если ваша команда будет использовать их для своих проектов, это приведет к увеличению затрат.
- Меньшее сообщество (зависит от языка), что означает, что будет труднее найти ресурсы, учебные пособия, библиотеки и инструменты.
- Может отсутствовать поддержка в IDE/редакторе.
- Эти языки всегда будут позади последнего стандарта JavaScript.
- Разработчики должны знать, во что компилируется их код — потому что это то, что будет запускаться в браузере, и это наиболее важно.

По большому счету, ES2015 значительно улучшил JavaScript и сделал разработку на нем намного удобнее. Я не вижу причин использовать CoffeeScript в наши дни.

👉 @frontendInterview

Beginning React and Firebase: Create Four Beginner-Friendly Projects Using React and Firebase (2021)

Вы начнете с основ: научитесь развертывать приложение React на хостинге Firebase. Затем вы научитесь создавать полнофункциональное приложение "ToDo", которое будет использовать базу данных Firebase для хранения списка элементов действий. Также вы научитесь создавать приложение "Stories", в котором можно показывать короткие вертикальные видеоролики, и приложение для хранения документов.

👉 @frontendInterview