Хороший, плохой, злой способ пройти задание от TJournal + АльфаБанк

Зашёл на TJournal и наткнулся на такой блок. Follow the white rabbit...

Конечно, мне стало интересно и я начал проходить тест по JavaScript.

Мне нравятся шифры, криптография, стенография и прочая подобная ересь (когда-то увлекался этим). Я не знаток JavaScript'a, но решил попробовать пройти тест. Скажу честно, в общей сумме, я потратил минут 20-30, чтобы выполнить эту задачу.

Определить шифр было легко. Кликаем правой кнопкой мыши на чувака из фотки (Блез де Виженер) и в поиске картинок Google, находим соответствующую инфу о шифре.

Шифр Виженера (фр. Chiffre de Vigenère) — метод полиалфавитного шифрования буквенного текста с использованием ключевого слова.

Чтобы понять эту таблицу, дальнейшие действия и как работает шифр, смотрте видео ниже (Влад вам все объяснит) и этот код

Теперь мы шарим в этой теме и расшифруем текст, который указан в задаче. Для этого, я использовал данную утилиту. Ключ для расшифровки/шифровки: ВЕЧЕРЯ

После расшифровки, получаем такой текст:

здесь могла быть красивая цитата из умной книги, но ты получишь только эти исходные данные: четыре,ноль,пять,один,два,три 28,14,19,173,44,57. поменяй их местами и вставь в код.

Далее, чтобы скопировать функцию, нам потребуется DevTools, а точней — Console (консоль). И скоро вы поймете, почему заголовок так называется.

# Хороший способ 💫

Я потратил минут 15 на то, чтобы догнать, что «четыре,ноль,пять,один,два,три», нужно писать цифрами...

Вручную код писать нету смысла, я решил прибегнуть к консоли и программно вытащил код:

[...document.querySelectorAll('.task__code.state--animated span')].map((s) => s.getAttribute('data-text')).join('');

Теперь разберем функцию:

function getSequence(str1, str2) {
    const arr1 = str1.split(',');
    const arr2 = str2.split(',');

    let i = 0;
    let arr3 = arr2.map(n => i = arr2[i]);

    let result = '%s-%s-%s-%s-%s-%s';

    arr3.forEach(n => {
        result = result.replace('%s', arr1[n]);
    });

    return result;
}

1. Функция получает 2 аргумента, строки с цифрами: 28,14,19,173,44,57 и 4,0,5,1,2,3.
2. Преобразует строки в массив чисел.
3. Получает верный порядок индексов.
4. Поочередно заменяет «%s» на число, соответствующее по индексу.

Верный ответ: 44-19-57-173-14-28

Тут можно проверить, как работает этот алгоритм — https://goo.gl/UtMWMm

# Плохой способ 😈

Так вот, зачем нам нужен DevTools? На самом деле, это крутая штука и сейчас вы поймете почему.

Открываем консоль и выбираем вкладку «Source». Далее, нам нужно поставить точку остановки — «breakpoint» на тот момент, когда проверяется введённое значение пользователем.

Теперь введите любое значение, например «hello» и браузер остановит действие на этой точке. Справа вы увидите переменную «t», если она false, то тест считается проваленным. Нам надо установить t = true. В итоге вас переведет на страницу с инфой, что вы успешно прошли тест.

Карл, а вот для тебя видео с инструкцией выше.