Задачка на JavaScript (ES6)

Привет обитателям DOU!

Я тут недавно по долгу службы перешёл на JavaScript и начал знакомство с ES6. В итоге сочинил небольшую задачку, которую и предлагаю порешать. Конструкции не совсем близкие к реальности, ES6 синтаксис вполне валидный. Это всё, конечно, не ново, но для разминки, думаю, будет интересно. Ниже код, который нужно прочитать и сказать, что будет на выходе. Ещё ниже пояснение. Для тех, кто не сильно знаком с ES6 — я буду давать краткие пояснения. Тут далеко не весь ES6, посему за самим стандартом можно пройти по ссылке es6katas.org )
Со всеми замечаниями и уточнениями милости прошу в комменты, не проходите мимо )

'Dangerous - ES6!';
`What's "console.log" gonna log?`;

let misteries = new Array(
    (number) => number,
    (number) => (number),
    (number) => {number},
    (number) => ({number}),
    (number) => {(number)}
);

(function (whatIsMistery = misteries[3](3)) {
    const {number} = whatIsMistery;
    misteries = [...misteries, number];
}());

let results = {};

[0,1,2,3,4].forEach(mistery => results[`mistery${mistery}`] = misteries[mistery](mistery));

results[`mistery${5}`] = misteries[5]

console.log(); // The main question: comment this entire line and tell why!?

(function (...somethingElse) {
    for (let something of somethingElse) console.log(results[`mistery${something}`]);
}(0, 1, 2, 3, 4, 5));

// Check yourself: https://repl.it/languages/javascript/

Итак, поехали разбираться. Что мы видим? Мы видим массив misteries, объявленный через ключевое слово new, хотя можно было воспользоваться литералом, и всё было бы также. Есть пустой объект results, пара ифи (Immediately Invoked Function Expression) и консоль логи.

В массиве misteries лежит 5 стрелочных функций.

Стрелочные функции уменьшают количество кода и сохраняют контекст

var func1 = function(a,b) {
	return a*b
};
var func2 = (a,b) => a*b;
var func3 = (a,b) => {
	return a*b
};
// все 3 функции одинаковые. Если стрелочную функцию можно записать в одну строчку, то ключевое слово return JS подставляет за вас втихую. 
// Если он видит фигурные скобки, то ждёт return.

var myVar = 'window';

var obj = {
 	myVar: 'objVar',
	one: function() {
		console.log(this.myVar) // objVar
	}
};

var obj2 = {
  	myVar: 'objVar',
	one: () => console.log(this.myVar) // window
};

obj.one();
obj2.one();

Вернёмся к функциям позже, т.к. их сейчас всё равно никто не вызывает.

(function (whatIsMistery = misteries[3](3)) {
    const {number} = whatIsMistery;
    misteries = [...misteries, number];
}());

whatIsMistery = misteries[3](3)

В функции мы видим литерал объекта.

Это просто синтаксический сахар, который эквивалентен

(3) => ({
	number: number
})

С дефолтным параметром и его результатом разобрались, теперь вернёмся к нашему ифи.

const {number} = whatIsMistery;

Строка 19

[0,1,2,3,4].forEach(mistery => results[`mistery${mistery}`] = misteries[mistery](mistery));

Теперь мы можем вернуться к массиву misteries. Благодаря форычу, в объект results он будет идти со следующими значениями:

let misteries = new Array(
    (0) => number,
    (1) => (number),
    (2) => {number},
    (3) => ({number}),
    (4) => {(number)}
);

(2) => {
	number
}

results[`mistery${5}`] = misteries[5]

Итого results — это объект

{ mistery0: 0,
  mistery1: 1,
  mistery2: undefined,
  mistery3: { number: 3 },
  mistery4: undefined,
  mistery5: 3 }

(function (...somethingElse) {
    for (let something of somethingElse) console.log(results[`mistery${something}`]);
}(0, 1, 2, 3, 4, 5));

Внутри функции есть конструкция for of

Конструкция применяется к итерируемым объектам и позволяет обращаться к ним без итератора.

let iterable = [10, 20, 30];
for (let value of iterable) {
    console.log(value);
}
// 10
// 20
// 30

На экран мы выводим results[`mistery${something}`]. Тут тоже шаблонная строка. Something — это наши 0,1,2,3,4,5 => `mistery${something}` = «mistery0» и так дальше, т.е. мы просто выводим всё содержимое объекта results:

0
1
undefined
{ number: 3 }
undefined
3

Основная задача решена, теперь на внимательность. Если убрать консоль лог со строчки 23, то результат получится:

0
1
undefined
{ number: 3 }
undefined
undefined
TypeError: misteries[5] is not a function
    at eval:25:1
    at eval

results[`mistery${5}`] = misteries[5]

Спасибо тем, кто дочитал до конца )

Підписуйтеся на Telegram-канал «DOU #tech», щоб не пропустити нові технічні статті