#0 Cобеседование Junior Frontend разработчика

Подготовка к собеседованию на Frontend Developer

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

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

    00:00:03 - 00:01:13

  • сегодня будет еще влад всем привет да front-end разработчик из дели мобиль иметь это который будет собеседовать на junior фронтенд разработчика вот некит можешь у себя чем-то сказать вот что хочешь да ещё раз всем привет как уже сказали меня зовут и китая junior фронт-энд разработчика на n плеча не удавшееся занимался точнее работал системным администратором около двух лет потом параллельно или у сайтики на вордпрессе после я решил заняться небольшим бизнесам был интернет магазин и в конечном итоге решил заняться фронтэнда

    00:00:37 - 00:02:19

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

    00:01:29 - 00:03:17

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

    00:02:22 - 00:03:50

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

    00:03:11 - 00:04:57

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

    00:04:07 - 00:06:09

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

    00:05:08 - 00:06:50

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

    00:06:05 - 00:08:03

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

    00:07:08 - 00:08:37

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

    00:07:57 - 00:09:22

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

    00:08:39 - 00:10:09

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

    00:09:23 - 00:11:05

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

    00:10:20 - 00:11:36

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

    00:10:58 - 00:12:25

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

    00:11:47 - 00:13:05

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

    00:12:25 - 00:13:47

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

    00:13:06 - 00:14:34

  • совсем как вообще надо на русском у нас учит так каскадной таблицы стиля бриться стиле да да вот как ты понимаешь что такое каскад каскад вот раньше в windows xp едим когда у тебя будет много окон открыто можно было правда пока мы шли кликнуть и вы нажать кнопочку каскадом и они вот так вот все поочередно выстраиваются ну вот наверное если аналогии проводить с этим то вот примерно что то что то в этом есть что есть определенная эра иерархия в котором у тебя вместо быстро это 30 ну да салон ты всё правильно говоришь вот

    00:13:54 - 00:15:32

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

    00:14:43 - 00:16:23

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

    00:15:37 - 00:17:12

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

    00:16:24 - 00:18:16

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

    00:17:21 - 00:18:52

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

    00:18:05 - 00:19:34

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

    00:18:55 - 00:20:28

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

    00:19:42 - 00:21:15

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

    00:20:28 - 00:21:53

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

    00:21:14 - 00:23:09

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

    00:22:12 - 00:24:17

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

    00:23:30 - 00:25:02

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

    00:24:16 - 00:26:57

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

    00:25:36 - 00:27:02

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

    00:26:41 - 00:28:15

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

    00:27:32 - 00:29:15

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

    00:28:21 - 00:29:46

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

    00:29:06 - 00:30:52

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

    00:29:58 - 00:31:43

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

    00:30:59 - 00:32:30

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

    00:31:52 - 00:33:51

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

    00:32:53 - 00:34:33

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

    00:33:47 - 00:35:15

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

    00:34:31 - 00:36:35

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

    00:36:04 - 00:38:01

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

    00:37:10 - 00:38:57

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

    00:38:13 - 00:40:07

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

    00:39:12 - 00:41:25

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

    00:40:31 - 00:42:33

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

    00:41:33 - 00:43:00

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

    00:42:20 - 00:44:00

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

    00:43:13 - 00:44:57

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

    00:44:08 - 00:46:12

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

    00:45:18 - 00:46:50

  • но про это мы еще поговорим ну хорошо ну что ты наш любимый вопрос про замыканием про области видимости а может может немножко расскажешь про вот то как ты определяешь перемены какие вот виды таких определений есть или так сказать типа переменных вот я сейчас написал const какие то еще знаешь nubar что в это раньше не было ну вот лепты назвал бар и konce да да а в чем в различии вообще между ними различия в том что где бы мы не объявили war она всегда объявляет насколько я знаю точно но она определяется переменной это всегда

    00:46:05 - 00:47:54

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

    00:47:04 - 00:49:29

  • до получается здесь in the fame хороша если я убью перемещаю внутрь отлично рашадат другой вопрос а вот здесь то выведется здесь единица но мы же это у нас единица бар пусть у нас здесь будет 2 тысяч здесь два да почему так работает потому что мы использовали war но разве war внутри функции объявляет ее в другой функции возложены функции разве у нас могут переменной изложенной функция попасть в область видимости другой функция внешне оборачивайся вот не знаю на самом деле нет потому что у war у него область видимости

    00:48:32 - 00:51:12

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

    00:50:01 - 00:51:29

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

    00:50:43 - 00:52:43

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

    00:51:54 - 00:53:59

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

    00:53:41 - 00:55:30

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

    00:54:49 - 00:56:44

  • именно операция которая будет ждать целую одну секунду когда за назначение до повлияет на от выводиться значение с интервалом задержкой в одну секунду но то есть вот здесь будет одно и то же и здесь будет одно и то же то есть начало выведется вот здесь последовательно там 01 3457 на 10 и здесь через секунду вы видите тоже 0 1 2 3 4 5 и так далее не хорошо как будет так у нас получается у нас будет выводиться единичка через одну секунду выведется еще одна потом выведется двойка через секунду еще одна и так

    00:55:57 - 00:57:59

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

    00:56:59 - 00:58:52

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

    00:57:57 - 00:59:22

  • миллионы миллисекунд потом объявили бар и после этого сделали console.log так ну получается нет так не будет работать с разным консоль бог то есть мы не будем стопорить выполнение кода вот поэтому я и спрашиваю что в предыдущем for блокирует выполнение кода и блокирует ли как ты думаешь так нового не блокирует все он не брали рыбу он получается очередь выполнение сектой мол ну не в очередь в стык ну да сет поймал он добавляет стык вот эти функции они уже через какое-то время вызываться не раньше чем допустим через ноль

    00:58:45 - 01:00:32

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

    00:59:46 - 01:01:19

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

    01:00:32 - 01:01:56

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

    01:01:14 - 01:02:46

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

    01:02:04 - 01:03:38

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

    01:02:49 - 01:04:28

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

    01:03:44 - 01:05:19

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

    01:04:30 - 01:06:23

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

    01:05:31 - 01:07:17

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

    01:06:27 - 01:08:20

  • а карточка находится на странице вот мы повесили на страницу на карточку на кнопку [музыка] события клик получается один клик приведет к срабатыванию 3 call back of правильно deliver что тогда или нет и не может быть двух или только 1 ну если мыcли если мы крепим на конкретную папку событием то произойдет вызов функции которые бисером на этой кнопке и на этом вся история с кликам и функции закончится ну получать что тогда ну давай я попробую пример какой привести чтобы чтобы давай арбуз проще здесь я думаю на самом деле все уже

    01:07:24 - 01:09:16

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

    01:08:20 - 01:11:17

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

    01:10:03 - 01:11:34

  • до window то есть даже если мы повесим события на windows крик она тоже сработает для того чтобы у нас всплыть и не происходило может быть ты что-то использовал чтобы люди не происходило ну ты на ника слышал есть такой как стоп про pagination именно всплыть наверх этих событий чтобы ограничить вот событие в рамках своего блока я тебя было сразу поправлю ты говоришь про стоп про погибнешь да наш стоп и конечно просто есть две вещи тут тоже надо понимать посмотри да это сам кликом не получится давая сейчас

    01:10:59 - 01:13:12

  • я покажу так я немножечко не вижу код хорошо вот у нас здесь события да и смотрю что мы делаем 12 обработчика вот если мы здесь 800 про падеж сделаем за ними идет про погибшим вот в зависимости короче говоря от того как мы это объявили будет разный эффект то есть у тебя есть два вида жить вращения всплытия ты можешь превратить его на уже накинут их обработчиков то есть у тебя сейчас на пар 2 обработчика правильно 1 и 2 вот если ты видел вызовешь кто победит про погибшим 2 2 обработчику же вызван не будет если ты

    01:11:51 - 01:14:07

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

    01:13:17 - 01:14:36

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

    01:13:56 - 01:15:24

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

    01:14:40 - 01:16:21

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

    01:15:34 - 01:17:26

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

    01:16:27 - 01:17:57

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

    01:17:19 - 01:18:32

  • больше работаешь когда пишешь код на view когда я когда работаю с детьми хотели за теорию маму работу потому что совсем недавно я начал с этим делом заниматься благодаря работаю с джек вере я работаю непосредственно с javascript кода в юже мне предоставляет комплексное решение я работаю и системы из ямы с javascript том числе в плане у меня во вью доступны такие директивы directives ко мне сюда например вымотал ну это вы хорошо а вот можно ли на джиг вере я сделать то же самое то есть четыре каким-то образом реализовать

    01:18:08 - 01:20:01

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

    01:19:09 - 01:20:38

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

    01:20:00 - 01:21:44

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

    01:20:53 - 01:22:34

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

    01:21:46 - 01:23:09

  • то есть в одном родители два компонента два ребенка как между ними что-то передавать как заставить их общаться друг с другом но надо уточнить to wear что эти компоненты они лежат не в одном родители они любят просто в одном дереве то есть у тебя есть одна ветка дерева есть другая ветка дерева они там где то в глубине спрятана и они не могут просто так через родители что-то вот передать то есть мы их держим ни в одном прям компоненте рост в одном дереве вот то есть они очень глубоко куда-то улетели вниз мы хотим из одного

    01:22:34 - 01:23:40

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

    01:23:08 - 01:24:55

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

    01:24:12 - 01:26:10

  • и как как это работает через что то есть конкретно пример вот вымотал у него двустороннее связывание вот как она будет работать на примере компании но что угодно то есть вымотал мы допустим когда вешаем на компоненты ли вы моту когда мы вешаем на какой then put как он работает но как работает моду например на пути условно мы вешаем на ipad мимо толпы там присваиваем какую-либо переменную и когда страничка рендерится этот и этот присваивать значение данной переменной вот так вот тогда за механизм предполагается чтоб ты

    01:25:13 - 01:27:07

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

    01:26:10 - 01:27:47

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

    01:26:59 - 01:28:40

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

    01:27:56 - 01:29:21

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

    01:28:39 - 01:30:33

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

    01:29:32 - 01:31:21

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

    01:30:31 - 01:32:14

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

    01:31:28 - 01:33:33

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

    01:32:30 - 01:34:12

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

    01:33:22 - 01:34:58

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

    01:34:13 - 01:35:53

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

    01:35:08 - 01:36:34

  • разметкой вот то есть попадет у тебя вот это на клиент и вот эта функция уже вызовется самим view и она создает твой virtual дом вот этот вот это each peppers гипер скрипт он генерирует virtual дом вино ты мне тогда теперь такой вопрос по видам последний завершающий вот у нас есть дом вот у нас есть virtual дом как ты думаешь чтобы с требует дом а почему тогда наш потому что он уже готов там не нужно ничего говорить нет в контексте предположение имеется виду то есть вот ты строишь все приложений у

    01:35:52 - 01:37:37

  • тебя там но что асинхронных вызовов но что магический магических операций то есть вопрос что будет быстрее в рамках большого приложения понятно что когда ты отдаешь разметку сразу servers to browse нечего делать ему нужно просто отобразить и но если у вас приложение томаты magic вере она вынуждена там по иксу что-то запрашивает сервис то есть ощущать это манипуляции впрочем обеспечивать все что нужно приложение для того чтобы работать вопрос что будет в этом случае быстрее приложение на view или приложением на джиг вере и почему

    01:36:45 - 01:38:09

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

    01:37:25 - 01:39:02

  • правильно тут важно именно сказать что virtual дом позволяет все изменения провести в нем а уже от рендерит на странице за один проход все изменения то есть именно вот это важно и когда манипулируешь you swear to all down ты можешь делать множество операций с ним это но относительно дешевые операции а сам пачинко твоих но тут в доме произойдет за один проход итоговое состоянии а если ты когда 4 работы что ты вынужден каждый раз обращаться к этой объектной модели документа и каждый раз проводить эти

    01:38:15 - 01:39:38

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

    01:38:56 - 01:40:24

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

    01:39:41 - 01:40:51

  • со стандартными решениями когда мы заменяем всю разметку вот ну хорошо свою домом я думаю закончить это такая тема животрепещущие бы сказал да уж любят ее все на самом деле спрашивают ну теперь давай про житель на цикла компонента поговорим ну да вот я смотрю здесь сделал mounted это часть жизненного цикла какие ты вообще знаешь еще тоже это по жизненным циклом a view client и маунты before by human и дестрой а если такой хук жизнь его цикла когда у нас что-то обновилась не знаю но он есть называется апдейт от вот в

    01:40:16 - 01:41:55

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

    01:41:06 - 01:42:21

  • to create item ну да the monkey потом крик а когда вызывается mounted то есть какой этап рендер компонента отвечает когда у нас да но не совсем короче говоря у нас начало ну ты начал правильный дата сначала работает потом будет уже created не только после этого мама тут при чем тут работать только когда у тебя вот этот вот компонент от тренд длился самом дом то есть вот здесь mode ты можешь обратиться через доллар элемент и там уже будет твой действительно элемент то есть вот в кредит от если я вот это вызова завис .

    01:41:44 - 01:43:15

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

    01:42:28 - 01:43:55

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

    01:43:11 - 01:45:31

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

    01:44:25 - 01:46:02

  • случае он будет обновляться и когда но сначала нас был единичкой о том стал тройкой потом стал двойкой и в конце компьютер тройку снова но вот нас компьютер это сумма фу и kooks до внутри до трети то есть у нас будет что-то вот здесь меняться выводе когда сработает крепит когда сработает mounted да будет оба раза да у нас получается и держит 1 to to do i равняется единичке потому нет create их равняется трем потом двум и потом уже считается компьютер ну то есть если обратить я понял первый раз мы а

    01:45:14 - 01:47:01

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

    01:46:18 - 01:47:53

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

    01:47:16 - 01:48:46

  • никакого не было все вот смотри у нас работал с тобой mounted я сделал full равно 2у равно 3у равна 4у равно 5 сколько раз у меня будет от рендеринг компонент на момент timan но просто вот я запустил до mount компонента mode этот работал сколько раз у меня тренд длился компонент считать дату вместе с даты два раза хорошо почему два раза всего лишь от ндс хотя видишь те же но присвоил четыре раза до почему ну что он рендере один раз после того как все границы а может быть знаешь как это вообще механизм называется который

    01:48:04 - 01:49:49

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

    01:48:57 - 01:50:14

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

    01:49:35 - 01:51:07

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

    01:50:21 - 01:51:46

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

    01:51:03 - 01:52:28

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

    01:51:45 - 01:53:00

  • происходит не только самому jet скрипте ну его from веках до вот у тебя были проблемы совет лоб и были проблемы с замыканием вот это две такие два столпа такие которые обычно спрашивают на собеседовании всегда вот если ты это знаешь что ты себя гораздо увереннее чувствуют на каждом система нить еще до но синхронно стивен клуб это вот тебе точно будут везде спрашиваете поэтому предлагаю эти вот больше внимания этому уделить вот мне пора что-то очень много вообще все значимо спросили вот прочти мэл ты довольно таки подробно рассказал

    01:52:23 - 01:53:36

  • процесс с тоже тоже неплох там какие-то были такие небольшие пробелы но в целом картинка складывается что какое-то понимание есть то есть ты можешь уже прийти на проект уже не будешь давайте просто что такое css уже можешь с этим работать и какой-то писать продакшен код вот это очень хорошо по view надо конечно еще раз пройтись по доки потому что мы все что тут с тобой обсуждали на самом деле все в документации описано это не так сложно потратить там может быть несколько дней но зато в дальнейшем у тебя будет меньше

    01:53:00 - 01:54:22

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

    01:53:40 - 01:55:03

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

    01:54:22 - 01:55:39

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

    01:55:01 - 01:56:25

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

    01:55:43 - 01:57:05

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

    01:56:24 - 01:57:55

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

    01:57:10 - 01:58:22

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

    01:57:47 - 01:59:00

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

    01:58:24 - 01:59:52

  • до было приятно провести эти два часа спасибо вам не тоже всем спасибо всем пока всем пока

    01:59:08 - 01:59:21

Менторы

Специалисты своей области, которые смогут помочь вам

  • Нигма Нурия
    Нигма Нурия

    Middle .Net Developer

  • Сущенко Татьяна
    Сущенко Татьяна

    Senior Product Manager

  • Гудков Денис
    Гудков Денис

    Middle Python Developer

  • Курочкин Константин
    Курочкин Константин

    Ведущий программист

  • Гудман Макс
    Гудман Макс

    Backend Software Engineer (PHP)

  • Гребенкин Антон
    Гребенкин Антон

    Senior .NET/C# developer

  • Ахназаров Фёдор
    Ахназаров Фёдор

    Middle DevOps Engineer | Tbilisi, Georgia

  • Шорохов Дмитрий
    Шорохов Дмитрий

    Middle C# .NET

  • Жуков Александр
    Жуков Александр

    Senior PHP-разработчик

  • Мазикин Павел
    Мазикин Павел

    Middle python developer

© 2024 HireGuru. Сделано в Санкт-Петербурге с hireguru.ru