Фишки TypeScript о которых ТЫ НЕ ЗНАЛ!
Ғылым және технология
В этом ролике мы разберем интересные моменты в TypeScript, которые можно будет применять на практике. Поговорим про Union типы, подсветку ошибок, тайпгуарды, утилитарные типы, generic компоненты, условные типы и кортежи, разница между enum vs as const object
Мой курс "Продвинутый Frontend. В production на React" - ulbitv.ru/frontend
Ссылка на мой телеграм канал - t.me/ulbi_tv
Таймкоды:
00:00 ➝ Введение
00:50 ➝ 1 лайфхак. Exhaustive check
03:50 ➝ 2 лайфак. Typeguard is
06:20 ➝ 3 лайфхак. Enums vs const enum vs as const object
14:00 ➝ 4 лайфхак. ReturnType, Parameters
16:20 ➝ 5 лайфхак. Conditional types. Условные типы
18:45 ➝ 6 лайфхак. Кортежи (tuple)
20:00 ➝ 7 лайфхак. Immutable, readonly
21:20 ➝ 8 лайфхак. Utility types
26:10 ➝ 9 лайфхак. Generic component React
27:50 ➝ Наглядный пример работы Event loop в коде
30:10 ➝ Не забудь поставить лайк и написать комментарий для
продвижения видео, всем спасибо за поддержку!)
Поддержать меня и мой канал вы можете по ссылкам ниже.
Ссылка на мой телеграм канал - t.me/ulbi_tv
Patreon/boosty (доступ к бонусам) - boosty.to/ulbitv
Qiwi кошелек - qiwi.com/n/BODYE821
Яндекс деньги - yoomoney.ru/to/4100116193037469
Пікірлер: 262
Ulbi, красавчик! Можно вот этого вот побольше?
@MrTruth-rc2fr
Жыл бұрын
Хахах, знакомые слова)
@user-wk5ij2je3z
Жыл бұрын
Контент в кайф!
@VasjaG
Жыл бұрын
@@MrTruth-rc2fr Это ЧатГПТ (подмигивает)
@anatoliiilescu839
Жыл бұрын
чтобы вы еще хотели ? думаю ради вас все будет!!!
@VasjaG
Жыл бұрын
@@anatoliiilescu839 Порядочные люди знают, что здесь не стол заказов. Но ради продвижения ролика было бы хорошо устроить срач в комментах.
Пили ещё. Не затянуто, познавательно, хотелось бы увидеть, весь список подобных лайфхаков которые ты перечислил в видосе.
27:43 Если нужно добавить один дженерик в функцию и нет необходимости экстендить его от чего-то, то можно просто добавить запятую: В таком виде это уже не будет JSX, а будет именно дженерик. И это актуально только для .tsx файлов, в .ts файлах с этим проблем нет.
На 24 минуте (Utility Types) при объявлении типа с таким же набором полей как у одного из полей интерфейса, как альернативный вариант записи можно просто записать type Birthday = User['birthday'], тогда конструкция valueOf не потребуется и читабельность будет чуть проще. Спасибо за видео!
@ixplo
Жыл бұрын
это проблема TS. почти любой тип можно описать почти бесконечным количеством вариантов. И никто не знает всех лучших вариантов ) я не знаю ни одного настоящего синьора в TS. Все постоянно в поиске. И это дико. Дико, что TS втыкается в 90% проектов, но никто не умеет в него нормально )
Братан, хорош, давай, давай, вперёд! Контент в кайф, можно ещё? Вообще красавчик! Можно вот этого вот почаще?
Да, это здоровский формат! Быстрая иньекция новой информации, каждый день по 30 мин и уже будешь знать больше чем многие колеги!
По поводу enum: они бывают не только строковые, ещё и числовые - хотя в рантайме это просто число, но на этапе разработки ты можешь писать не === 1, а что-нибудь имеющее смысл. И зачем они нужны: 1. Чтобы не использовать строки в коде, и чтобы не было соблазна их повторять 2. Чтобы обрабатывать входящие данные: у меня на проекте есть типы газоанализаторов, и приходят они как число 0-255, а на фронт нужно отдать название. Здесь помогли 2 enum - числовой и строковый
Узнал новое, не смотря на то, что с ТС давно на ты Спасибо!
Очень интересно, большую часть знал, но пара пригодится точно. Очень интересно о каких ещё приёмах ты бы мог рассказать
Братан, хорош, давай, вперёд! Контент в кайф, можно ещё? Вообще красавчик! Можно вот этого вот почаще?
Спасибо огромное! Действительно, без всякой воды. Сразу видно технический подход и понятный даже для гуманитария
В примере где с помощью ValueOf берём тип birthday можно просто взять TypeNameWithBirthday['birthday']
@UlbiTV
Жыл бұрын
Справедливо, если нужно одно поле, пиком можно несколько цепануть
@BOCbMOU
Жыл бұрын
@@UlbiTV если надо достать тип значений из нескольких полей, то как раз пик тут лишний, по прежнему можно несколько ключей перечислить: TypeNameWithBirthday['id' | 'age' | 'birthday'] Пик всё же как раз для создания нового объекта с некоторыми старыми ключами и изначальными типами ключей. Доставать через него значение нелогично.
Было бы круто посмотреть видео про микрофронтенд. Условно - есть базовый Шелл, в котором есть базовый роутинг. И каждый роут это отдельный сервис, который прописан в ремоутс
@ixplo
Жыл бұрын
как меня триггерят такие темы :) микрофронты -- это решение, когда полный бардак в конторе надо как-то спасать. Микрофронты -- это приговор, когда всё просрали имхо
@parabellum577
Жыл бұрын
@@ixplo ну да, не могу представить кейс, когда такое говно реально нужно применять
@ixplo
Жыл бұрын
@@parabellum577 кейсы есть, но почти всегда за сопоставимое вложение ресурсов можно сделать что-то другое, что не повлияет на качество продукта
Какой же офигенный видос. Спасибо большое за материал
Лаконично и ёмко, хорош, давай еще)
Супер видео! буду ждать продолжения и по тайпскрипту и по другим темам! отличный формат!
Ещё офигенная вещь это inner. Для динамических типов это просто незаменимая вещь.
12:50 если надо, чтобы функция принимала стоки, которые относятся к enum, нужно в качестве аргумента функции указать ‘${UserRole}‘. Функция пропустит и enum значения как UserRole.Admin, так и "admin"
На 23:50 можно вытянуть тип Birthday гораздо проще. У TS есть синтаксис доступа к типу по индексу, и выглядит это так: type BirthDay = User['birthDay'] И не нужны ни Pick, ни ValueOf.
@maximkarpov4405
Жыл бұрын
так его valueOf по сути тоже самое
Очень полезно! Хочется еще подобный контент с фишками💥
Супер! Давай больше о TS, backend, web3!
Спасибо тебе большое за такие познавательные видео!!!!!!! Как всегда по полочкам
Как всегда коротко и по делу, очень полезное видео!
Спасибо за видео, очень полезно. Хотелось бы видеть больше таких видео
Про тайпгарды понравилось. Хороший пример
Очень круто и полезно! Не знал про Exclude)
круто, нужны еще такого плана видосы!
Как всегда годный контент. React, Typescript форева😂
это какой то п**дец. Я еле еле что то вкурил. И я понял что надо учиться и учиться. Тимур ты реально крут. Спасибо тебе❤❤
@dmitrykabanov9458
Жыл бұрын
По сути, все что показано в данном видео это вспомогательные инструменты ТС. Это не обязательно использовать но надо знать, по тому что эти инструменты помогают писать код таким образом, чтобы предотвращать не корректный код. Если интересно, почитай про тайп гарды, анкноун и Невер. Всякие енамы, как по мне, не нужны. Они просто побыстрее работают
@holfizz7868
Жыл бұрын
@@dmitrykabanov9458 Я обязательно займусь этим но позже. Мне очень сложно это воспринимать так рано:)
Интересные нюансы, благодарю!
Всё, что нужно, в одном месте, быстро и понятно 💣💥
Ещё не досмотрел, но уже заходит, крутой ролик
Спасибо за твой труд! ❤ Твои видео очень полезные 👍
Нижайший поклон добрый человек! Очень понравилось! knowledge sharing в массы
Быстрые гайды офигенно заходят!) Правда слушаю на 1.75, поэтому они прям супер быстрые)) Материал полезный, даже если все знаешь, лишний раз повторишь. Спасибо за труды!
Пару новых штуковин узнал. Спасибо
Круто, спасибо. Можно вот этого вот почаще
Тимур, спасибо большое. Очень полезное видево!)
Реакт и js такого формата очень жду
Бро давай побольше TS, он сейчас везде просто нужен )) Ну и фишки ванильного JS тоже хотелось бы узнать))
очень интересный обзор! спасибо большое!
Просто супер! Полезного было достаточно, что приятно Спасибо за ролик!
Суперр! Огромное спасибо!
Круто, очень много нового узнал.
Вперёд братан, контент в кайф! 👍👏🔥
Очень круто!!! Спасибо
Классное видео.Очень зашёл такой контент
Супер, спасибо. Очень интересно и полезно!
Спасибо! Круто! Норм формат!
Коммент в поддержку) как всегда все круто!
Крутые ролики у тебя, смотрю и практикуюсь) !спасибо!
Больше такого контента!!!! Пожалуйста!!!
Тимур это прям очень полезное видео)) спасибо
Действительно интересные приемы которые хотелось бы попробовать в деле.
1 кейс что пришел на ум, когда ты используешь не константный объект а через ValueOf получаешь типы и потом используешь строки или что там в readonly то если надо заменить значение ты будешь бегать по проекту и менять занчения везде, если же использоать константный объект (импортировать его да) то значение нужно заменять в одном месте
Спасибо за полезное видео
strapi сделай бро! :)
Интересная тема по поводу типизированых переиспользуемых компонентов. Наткнулся на много проблем типизации от создании темы до типизации пропсов.
очень полезно, спасибо
Тимур, спасибо! 👍
крутяк! Заскринил некоторые моменты, записал в "заметки"
Спасибо, довольно полезный контент
Топ, испытываю проблемы с тс постоянно, с подобным контентом становится проще!
Круто, продолжай)
Очень круто, но надеюсь ты сделаешь всё-таки видео по react query.
Супер!
По поводу первого случая, не нужно делать функцию, это лишнее. Можно просто написать const _: never = car.brand, и TS будет ругаться, если мы попадет в дефолт.
@BOCbMOU
Жыл бұрын
Есть ещё проще вариант на 4.9+ версии: car.brand satisfies never;
@user-im3nr6he9m
Жыл бұрын
@@BOCbMOU Огонь! Не знал что такое есть
Привет! в первом примере надо возвращать результат функции never чтобы вычисляемый тип значения был правильный (а то иначе туда добавится undefined)
Видос просто 🔥. Можно такого больше? ☺️ В конце про дженерики - это прям топ, как раз на днях увидел это в курсе и сразу понял тут, как это фиксить. А еще функцию онЧенч внутри селекта можно переписать через опшионал ченинг, что сделает ее чуточку короче.
Очень заходит! Понравится всем, спасибо большое!
Больше таких роликов !
Спасибо, на 1.25 смотрится отлично)
Оч интересно, контент топ, идея топ
Интересные фишки, спасибо) 20:40 пример не совсем корректный, когда мы делаем объект константой _obj as const_ , то мы его поля не сможем изменить, а в функцию мы передаем аргументом объект с похожим типом и он никак не связан с obj. То есть ТС только проверяет на соответствие типов параметра и аргумента, а не логику внутри функции. 23:30 пример для Extract лучше с доки _type T0 = Extract;_ по простому это как пересечение. В твоём примере непонятно зачем указывать union, который и получаем.
хочу собеседования ! но любой контент твой хорош
Круть. А о декораторах можешь рассказать?
контент топ, продолжай
Думаю, можешь добавить Module Augmentation, помогает когда нужно расширить тип из либы, чтобы, например подмешать свое данные в аргументы какого-то метода из либы
круто!!
Супер, надеялся еще на MappedTypes посмотреть, по ним видосик будет?)
супер! спасибо)
Полезно, рубрика классная
Зашло, спасибо
Привет, я давно смотрю твои видео, очень интересный контент, нравится твоя манера говорить и способность вести диалоги. Ты в каком-то видео говорил, что для начинающих программистов крайне важно попасть на хорошую работу, с хорошим начальником и коллективом, и я хотел бы узнать твое мнение, я очень начинаешь бэкэндер и фронтэндер, учился по разным курсам в интернете и твоим видео, подтянул JS, HTML и CSS, наконец-то подвернулся вариант с работой, которую долго искал, и согласился на первый же вариант, и тут началось: рамках обучения мне дали задание сделать фулстек проект, разработать приложение для ведения реестра, с базой данных на 10 таблиц, с 15000 строк, осуществить все в laravel при помощи php, сказали: ну делай, а теперь спустя небольшое время, начинается возмущение, что я медленно делаю и ничего не успеваю, сижу просто учусь. И я не знаю, так и должно быть, и это я правда медленно развиваюсь или все же должна быть какая-то помощь? Очень интересно твое мнение, буду рад, если ты ответишь, заранее больше спасибо P.s. я тоже закончил РТУ МИРЭА в 2021)
Добрый день. Спасибо Вам огромное. А существует курс по TS для новичков в Вашем формате? Вы просто идеально информацию преподносите.
формат огонь. можно ли погрузиться глубже в дженерики с след видео ?
Вот это супер было !!!!
Больше type script & react & redux, please! Я знаю что есть много на канале про это но еще хочется
Круто! давай еще
стильно, модно, молодёжно. Давай ещё.
Было бы хорошо если сделал видосики как Michigan TypeScript по ts
@abdurazzoxabdullayev3705
Жыл бұрын
Атак все твои видео прям топпп!!!
Контент зашёл, даю знать
Видео о том, как обойти грабли TS.
@dontcode
Жыл бұрын
Тс и есть грабля, поверх джаваскрипта)
@macmasek
Жыл бұрын
Шаг 1: перестаньте использовать Typescript
Спасибо
Как обычно контент в кайф
спасибо!
Годнота!🎉
да/ интересно конечно)
Батя, контент топчик, наваливай ещё! 1.5 года работаю с TS. Дофига нового)
Спасибо большое! Боже я только что узнал то что я зря мучился целый день