​Объясните, почему это не является IIFE: `function foo(){ }();`. Что необходимо изменить, чтобы это стало IIFE??

IIFE расшифровывается как Immediately Invoked Function Expression — немедленно вызываемое функциональное выражение. Синтаксический анализатор JavaScript читает function foo(){ } (); как function foo(){ } и ();, где первое выражение — это объявление функции, а второе (пара скобок) — попытка вызова функции, но так как имя не указано, он выдает ошибку Uncaught SyntaxError: Unexpected token.

Вот два способа исправить это, которые заключаются добавление дополнительных скобок: (function foo(){ })() и (function foo(){ }()). Выражения, начинающиеся с function, считаются объявлениями функций. Оборачивая эту функцию внутри (), она становится функциональным выражением, которое затем может быть выполнено с последующим (). Подобные функции не отображаются в глобальной области видимости, и вы можете даже не указывать им имя, если вы не будете на них ссылаться.

Вы также можете использовать оператор void — void function foo(){ }(). К сожалению, с таким подходом есть одна проблема. Выполнение данного выражения всегда возвращает undefined, поэтому, если ваше IIFE возвращает что-либо, вы не можете его использовать.
Пример:
const foo = void function bar() { return ‘foo’; }();
console.log(foo); // undefined

👉 @frontendInterview

Грокаем функциональное мышление

Кодовые базы разрастаются, становясь всё сложнее и запутаннее, что не может не пугать разработчиков. Как обнаружить код, изменяющий состояние вашей системы? Как сделать код таким, чтобы он не увеличивал сложность и запутанность кодовой базы?

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

👉 @frontendInterview

Разбить camelCase

Напишите функцию, которая будет разбивать строки в camelCase на отдельные слова.

Примеры:
"camelCasing" => "camel Casing"
"identifier" => "identifier"
"" => ""

👉 @frontendInterview

Что делает и для чего нужна функция `Function.prototype.bind`?

Метод bind() создаёт новую функцию, которая при вызове устанавливает в качестве контекста выполнения this предоставленное значение. В метод также передаётся набор аргументов, которые будут установлены перед переданными в привязанную функцию аргументами при её вызове.

👉 @frontendInterview

👉 @frontendInterview

Можете ли вы описать основное различие между циклом `.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