Крушитель алгоритмов? Собеседование frontend разработчика#4

Транскрипция видео:

• данном случае давай начинать Привет вообще как тебя зовут Расскажи себе Привет Меня зовут Гриша Мне 22 года но с программирование познакомился нормально языках В восемнадцатом году То есть на первом курсе института нормально после Паскаля вот система есть с уже в девятнадцатом Но первый вот проект приложение делает Спаси нулевыми знаниями и по джессу поэтому я совершенно почти не разбирался в них вот глубже изучать желез начал в 21 году и как раз уже дисциплинарные проекты в ВУЗе разрабатывала спермы и 22 году на

  00:00:00 - 00:01:35

• всякий реакции использовал то есть условно некоммерческий она бы кэнде с чем было чаще использовал Экспресс данных там вот так а что за проекты были можешь поподробнее о каком-нибудь таком самом сложном функциональном Расскажи ну даже не знаю Ну например поликлиника просто довольно объемный проект круто обычный вот с возможностью записи на прием к врачу который работает в общем не ко времени к определенному Дню поэтому я посложнее даже не подумал а там получается чтобы вот у получается врач какой-то Да у него

  00:00:51 - 00:02:34

• какая-то админка или что или проект разработался месяц админкой и у врача можно было редактировать его расписание то есть каким дням работает допустим понедельник среда пятницы и время кстати было фиксировано [музыка] а вот именно сама заявка в админку врачу как прилетала нужно было обновлять страницу или ты использовал на почту его Да и ты получается сейчас работаешь уже или нет Да работаю с декабря 22 года то есть пять месяцев чистых 6 Пока нет вот разработчикам стек у нас typescript react редакс

  00:01:57 - 00:03:26

• talkit используем query докер материал редак стуке расскажи поподробнее может быть про задачи на работе чем сталкиваешься и трудности появляются трудности довольно много всегда но все равно как-то решаются но в целом задача такие довольно объемные то есть исправление богов почти нет обычно задача допустим реализовать раздел Мы работаем над erp системой это условный сервер только для сотрудников и бизнес-процессов компании то есть создаем новые страницы первое время сейчас уже как бы допиливаем функционал какой-то в данный

  00:02:52 - 00:04:14

• момент я работаю аутентификации и ролевой системой вот делаю страницу для редактирования мобилок то есть возможности пользователя для каждой секции для доступа вот но проблема чаще возникают из-за незнания допустим того же библиотеки юсформ То есть как правильно сделать чтобы понять чекались в случае если это Форма ты имеешь ввиду до условно форме только мы Юз формы реакцию можно сказать небольшие поэтому они особо и в памяти как-то не откладываются пока наверное не было я понял а какова архитектура на проекте именно по

  00:03:47 - 00:05:15

• структуре папок и по отделению там есть какое-то отделение на бизнес свой как такового удивление на бизнесе у нас нет как везде наверное есть папка сексом надо наверное даже не стоит упоминать а в целом если допустим зайти в какой-нибудь компоненту мы стараемся просто отделять логику в кастомные хуки Вот и как бы уже использовать Ну компоненты Да и кастомные хуки такой подход Я понял хорошо получается сколько ты давно знаком Ну я знаком можно сказать шесть месяцев потому что в общем использовал тестом задании

  00:04:41 - 00:06:22

• только его и на работе усердно начал использовать Саша с тобой пообщается будут какие-то вопросы там небольшие скрипту и потом посмотрим если останется время пообщаемся еще немножко так архитектуре немножко порядка может быть на Привет Смотри а чего вообще Вот решил даже прийти может быть собеседование сейчас будешь работу искать или что Или просто тебя попробовать на самом деле да Просто попробовать хотелось потому что месяц назад как сгорелся походить и пока означал Вот и но хотелось бы посмотреть на

  00:05:39 - 00:07:16

• знание свои со стороны я понял А как ты готовишься сюда или пока просто вместе после работы скорее алгоритм решаю готовится я начал Ну месяца два назад неделю может повторял чтобы не забывать [музыка] [музыка] особо не спрашивали люди совершенно базовые там задача скорее название Давайте посмотрим сейчас Может тебе дадим алгоритмическую потому что у меня была задача чисто по джессу я думаю ну посмотрим быстро справишься это может быть еще что-то с тобой разберем Потому что сейчас если ты хочешь какую-то там

  00:06:36 - 00:08:03

• более-менее такой большой компанию собеседовать кто-нибудь алгоритм давать я понимаю давай тогда с тобой по джессу немножко пробежимся вообще Может рассказать что мы про контекст вообще как мы можем привязать для чего [музыка] Ну контекст Мы можем с помощью трех функций это коллед и Play Bent отличается тем что он просто привязывает контекст и не вызывает функцию вкул сначала контекст наш словно и далее Мы через запятую должны в колл через запятую должны уже перечислять наши аргументы Вот то же самое только в качестве второго

  00:07:43 - 00:09:22

• аргумент уже будет массив с нашими с нашими передаваемыми значениями Да вот какую Для чего общем нужно контекст можно без него Ну в целом Да просто не знаю если у нас допустим какой-то адаптер хотим использовать и Хотя нет наверное такой вариант допустим у нас есть универсальная функция и мы хотим чтобы она работала с разными контекстами когда мы теряем [музыка] в том числе [музыка] вообще Давай начнем наверное стандартного такого просто хотелось максимально подробно рассказ про него как-то это понимаешь для чего это нам

  00:08:35 - 00:10:27

• нужно Можем ли мы без него такое потом может быть Так ну имидлуб это такой не знаю программа интерфейс бесконечный цикл который постоянно крутится и выполняет задачи уже после их выполнения он ожидает новые Он работает в паре с со стеком вызовом Cold Stack то есть в случае если допустим наша программа проходит и находит асинхронный код ой точнее синхронный код то он попадается так вызов и сразу же выполняется и выполняется и удаляется из этого холстека вот случае если встречается синхронный код то он попадает в стык

  00:09:35 - 00:11:07

• вызовов Однако удалиться полностью уже перемещается и перемещается он либо в API либо сразу очередь микрозадач попадают макро доски то есть с этой маут интервал и прочее проще перечислить наверное микрозадача вот случае если встречаются микрозадача То есть это у промисов зенкович фэнли также микро tasq и вроде бы интерсекшена так нет В общем браузерные всякие методы для получения элементов и прочее это выполняется выполняется попадает сразу в очередь микрозадач и у нас получилось так что если пустой и

  00:10:24 - 00:12:07

• при этом у нас есть задача в очередь микро то всегда в приоритете будут микро тоски то есть микро тоски точнее макро- тоска не выполняется до тех пор пока не будет выполнены все микро таски и как раз при выполнении микроавтосок блокируется рендер страницы а между макро досками страница может обновляться рендериться да Хорошо давай подробнее может и на замену чего они пришли проблемы насколько понимаю ранее использовалась использовались callback вызовы голубых функции для работы и тогда была проблема

  00:11:20 - 00:12:52

• вроде бы называлась и промс-6 у нас появились и нужны для работы с синхронным кодом как и Осинка говорит и получается задача если успешно завершился через И если мы вызвали Да класс смотри статические методы Расскажешь про них Какие знаешь классические методы промеса когда мы пишем через точку то есть оценкой условно Ну они в том числе [музыка] немного уже забыл разницу между ними точнее разницу помню не помню именно идентифицировать вроде бы он ждет ожидания выполнения всех задач до того момента

  00:12:15 - 00:14:06

• пока хотя бы один не заряжать птица либо все не выполнится как раз выполнение всех Даже случае Если произойдет Ну вот даже вот если кейс такой вот делаем внутри вот у меня есть четыре запроса в массиве Да И вот я считаю чтобы ты использовал например мне как бы все равно там да что один из них 12 из них может упасть например он ждет выполнение первого вроде бы нормальные непонятное поле Да я хочу проверить поэтому можно вызвать метод таракан так смотри вот у меня есть класс Да я хочу узнать что там какой-то другой был класс

  00:13:46 - 00:15:20

• его там как бы является дочерним под классом каким вообще это проверить через instance of Да правильно задачи потом что-то алгоритм пробежимся хорошо вот использовали ты вообще в работе или просто использовал такие коллекции ничего не нам нужны довольно часто используют Ну они написаны вроде бы на всех нужны для того чтобы В общем они ускоряют довольно в случае если например нужно взять только уникальное значение также в них можно в качестве ключей можно хранить функции насколько я помню числа потому что обычно объекте так делать

  00:15:19 - 00:17:05

• нельзя не получится может еще что-то там отличия между объектом знаешь так нужно такого Ну наверное не очевидно Может просто быстрее будет работать кстати вот некоторые тесты проводил и не всегда даже быстрее какие-то вообще хранилище может браузере знаешь Кто использовал вообще Ну мы используем Local Source также есть еще возможно куки И милость Да вообще вот Может чем отличие мы можем даже больше данных точно меньше всего потому что через протокол все это общается думаю что локоть тот же самый большой А

  00:16:33 - 00:18:08

• дальше идет посередине где-то кстати слышал Да но никогда не читал о нем работает ничего [музыка] честно говоря не сталкивался Ну можно сказать что это такое работает примерно так же сейчас нужно просто будет реализовать куда можно положить колбек туда найден ивент потом создать второй винт тоже в него положить колбек потом имитить это грубо говоря мы вызываем его достаем и на Off мы отписываемся тебе нужно будет три метода у класса создать там он имеет и рисовать них логику тогда и хранить как бы

  00:18:16 - 00:19:44

• вообще может пока прочитать да знакомиться или Прости задать какие-то вопросы что-то непонятно хорошо получается у нас ну допустим напишу Он и у нас разные винты есть и ты можешь начинать накидывать и в ноги вроде есть свой встроенный эндометрий честно не помню но скорее всего есть значит но он вы регистрируем выше клуба для события Винт просто его думаю получилось нужно Switch кейсом прогоняться по ивенту или же и смотреть не делал наверное Хотя Ну наверное можно с тобой говорили про объект например

  00:19:29 - 00:20:46

• хранить колбакта поэтому Так ну сейчас Надеюсь что правильно принимаю задачу То есть накидывать просто с тобой Да чтобы мы не моцали разбирать потихоньку вообще правильно сторону Ну ты получился думаю в объекте хранить наши ивенты и для каждого ивента свой массив с клубниками получается [музыка] Короче ладно сейчас посмотрю А вот все Все я вижу я смотрю если наши винт еще не было никогда зарегистрирован то я добавляю обычный массив И потом пушу наш клуб [музыка] другой по честному Нужно вернуть

  00:21:33 - 00:23:08

• [музыка] хорошо получается мы должны Удалить весь массив Или же просто нет но если мы удаляем обработчик то мы просто грубо говоря весь вент дата мира Просто если весь ивентус можно просто Удалить Давай поменяем на просто Все просто Наверно так в одну крышку затем читаем Как смотрится тяжеловато немножко хорошо данные редких регистрации мы кушали Поэтому до порядок будет например и а мы пошли сразу клубники но можно тогда вызвать наш клуб давит будет с данными и также получается вернуть Да давай попробуем

  00:23:28 - 00:25:22

• Извините что написали обработка Нет я просто вообще методы [музыка] только проверять на ивент что мне волосы значения не знаю велик а так тогда здесь посмотри а я здесь никак не проверяю что callback вообще что кубок всю функцию или же Ну да думаю Правда не знаю как эта функция тебя еще [музыка] не хочет иметь работать Внутри что-то там не так у нас подъем там лежит массив при котором мы берем callback а если у нас нет так если у нас что получается вынести вот так наши колбакислого наверное если мы не существующий вен передали

  00:26:53 - 00:29:01

• если то сразу вернулся из Да я про это не подумал сейчас [музыка] не удаляется скорее всего Да не удаляется мне отрабатывает [музыка] Так ну можно а можно можно массив обычно добавить и не удалять получается но когда я весь ивент наверное я вообще не хочу [музыка] но это ничего страшного можно пройти по ивентам если тогда мы должно удалить его Так сейчас мы можем тогда так сейчас если не равно если не равно ивенту мы добавляем в наши новые ивенты такие кий в таком случае мы уберем их и далее нам надо сделать

  00:30:08 - 00:32:01

• здесь по поводу копирования я здесь с тобой тогда можно пока поговорить просто эти задачу про сложности алгоритмов Чем можешь рассказать скорость по памяти что вообще какие подходы прослушать если базовая максимальная просто сначала если мы допустим нашему входному силу проходим только один раз вот если же проходимся как сказать вложено два раза то наша сложность умножается на себя то есть в квадрат возводится если три раза то в куб вот если же мы как бы сначала один раз проходимся а потом уже второй раз то сложность от 2n

  00:33:11 - 00:34:55

• равняется также от N так сказать сложность это возникает когда мы допустим Обращаемся к ключом объекта либо же по индексу массивов Вот и поэтому допустим объекты бывают полезные использовать для решения каких-то алгоритмических задач для того чтобы понять сложности и собрал Новый объект если мы проходим по времени это как считается что мы вот грубо говоря Новый объект собрались Поэтому вот они получаются такой же объект и столько же элементов если объект не собирал просто вот пробежался по массиву и ритуал какое-то

  00:35:30 - 00:37:09

• значение из него по скорости что-то по скорости по памяти я думаю константное будет [музыка] уберем с тобой должна быть у каждой скобочки закрывающая пара если у него не закрывать что-то ты сразу если все прошло то все сравнил все хорошо здесь решал сначала нужно перемены который будет как бы хранить количество открывающихся скобок но [музыка] открывшийся открывающий скобка то мы инкрементируем ее в случае если закрывающиеся то если у нас получается так что отрицательное значение У нашего аккаунта

  00:36:54 - 00:38:40

• сразу Зачем после всего прогона по нашим скобочкам мы возвращаем трубу то есть этим минусом значение спасаешься вот от такого случая Когда у нас вроде подвеску есть но не в правильном порядке соответственно сразу реперный холод сахар давай начинать реализацию так не завидую переменную допустим 0 так на ход мы получаем строку здесь можно либо строку разбить чтобы на чтобы нам превратилась идти поручу но чтобы этого не делать это случай если надо уже проверить потому что у нас не только скобки могут быть а еще и

  00:38:47 - 00:40:17

• различные Угу [музыка] все правильно хорошо что расскажешь через плотность за память так вот по поводу памяти кстати интересно я думаю что здесь А здесь память будет Как раз вот не знаю просто считается наверное вот единицы не объект не мотив [музыка] так короче времени много нам нужно 45 минут уложиться Думаю минут 5-7 еще у нас есть Давай вообще поговорим про архитектуру немножко Представь себе что верх компании приходят и говорят что тебе нужно реализовать приложение это приложение для продажи каких-то обучающих курсов

  00:39:54 - 00:41:42

• вот оно должно быть на трех языках и все эти три языка должны регулироваться через админку то есть какие-то динамические страницы эти все динамические страницы создаются через админку и они должны быть с возможностью трех языков вот вообще Расскажи чтобы ты использовал как бы ты реализовывал именно вот мультиязычность для динамических страниц которые создаются через админку вот какой стек на данный момент [музыка] У нас должна быть админка какая-то то есть мне заходит админ и создает границу сразу на трех языках

  00:41:54 - 00:43:23

• это ну давай вначале поговорим в общем чтобы ты использовал Какие технологии и почему а потом уже более плавно перейдем к технической реализации так Ну вот и знаю что для JS есть фреймворк вроде бы называется Электрон который позволяет использовать программу написано на другом языке Но наверное я все-таки копаю уже не туда Ну да тут вполне будет достаточно реакта то есть основа у нас ряд Ну либо любой другой что ты можешь тебе нужно тут смотреть со стороны тоже рынка это приложение должно быть сделано

  00:42:57 - 00:44:12

• быстро поддержки чтобы не было проблем вот так что это такое не супер популярная вот я бы не рассматривал вот эту сторону смотри тебе должно быть выгодно со стороны бизнеса это реализовать и со стороны разработки чтобы это было максимально быстро Вот у тебя есть получается клиент и админка Давай начнем с клиента на клиенте у тебя там есть кастомный какой-то макет вот в админке или без разницы то есть Так мы эту Как наше приложение условно какую-то делаем запрос на Back который уже написано на другом языке

  00:43:44 - 00:45:22

• тут обычный краб будет Ну во-первых наверное про микросервис архитектуру кто-то здесь нет никакого подвох Просто мне приходит бизнес говорит нужно какое-то приложение если бы использовал ряд Так ну я поэтапно попробуй проговорить получается у меня есть несколько сервисов небольших на разных языках с фронтовой части Я бы обращался к бэкенду блин так но Давайте немножко подскажу смотри у нас получается есть админка да админки мы можем дополнять сделать короче одно большую форму которую мы будем вводить

  00:44:35 - 00:46:23

• на трех языках соответственно могут быть какие-то табы на либо какие-то шаги то есть при создании какой-то первой динамической страницы вы вначале заполняем на русском английском Потом еще на каком-то языке вот на третьем и этот весь Большой объект у нас летит в базу и потом уже делается с клиента без запросы и отображается Вот вот так для языков можно там Ай 18 использовать и подгружать для этой страницы именно из объекта брать по ключу Ну по ключу Это имеется ввиду по языку который сейчас выбранную юзера Вот и по такой вариант

  00:46:06 - 00:47:45

• а мы такой простой в лоб Да правда я про 18 NEX вообще ну только слышал и не читал и получается позволяет реализовывать подобные приложения Ну как бы да ну обычно ты можешь какие-то статические переводы закладывать у себя предложение вот ясности именно она для статических переводов А вот именно динамические тоже будут грузиться если у тебя короче есть требования такое что именно все страницы будут полностью кастомные динамические такое что вряд ли будет но у тебя в любом случае будут какие-то блоки статичные которые у тебя

  00:46:56 - 00:48:26

• не видоизменяется через админку в этом случае тебе нужно 18 объекты с переводами у тебя там в джасоне и переводить их в зависимости от того какой пользователь язык выбран [музыка] интересно но а динамического же ты будешь по там в условно там будет лежать строка типа там ru или N ты будешь доставать эту строку и проверять уже Какой тебе перевод нужно грузить вот ну давай в целом Вернемся еще к вопросу по технологии чтобы ты использовал на данный момент и почему уже знаю вот это вот более так низкой стороны что тебе нужно сделать

  00:47:41 - 00:49:21

• библиотеке стилей это уже наверное опускается но почему нужно говорить вообще такой плюс-минус весь так который ты боится так Ну не знаю можно рассмотреть сам дизайн или материал UI Допустим вот для админки Можно попробовать фреймворк использовать знаю Слышал просто вот Можно наверное его для управления данными настроить прав доступа ролевой системы [музыка] у вас на работе админка как реализована у нас как сказать У нас в целом как будто как CRM то есть грубо говоря это большая админка Вот и мы используем также

  00:49:03 - 00:50:59

• и как бы у нас нет дополнительного url-а на котором мы можем зайти прямо в админку то есть в каждом приложении у нас Ой на каждой странице ВКонтакте у вас внутри вашего приложения функционал какой-то делится по ролям Да и в зависимости от роли мы можем рисовать кнопку Edit если мы хотим измениться и долить и прочее вот так понял окно Окей давай тогда будем заканчиваться время подошло концу вот в целом по задачам Саша скажет но мне понравилось Понятно рассказал сборщики [музыка] [музыка] Такие моменты так в принципе все хорошо

  00:50:13 - 00:51:40

• отлично то есть по алгоритмам тоже понимаешь о чем говоришь как бы по задачам по джессу разобрался мне работать поэтому неудачи пока все давай пока

  00:51:53 - 00:52:21