Я считала, что неплохо знаю typescript, но смотря твои видео уже сделала пару открытий для себя! Я не знала про function type assertion. А в видео про дженерики я узнала, что функцию type guard можно использовать для сужения key (function hasOwn) Благодарю!
Забыл сказать, что на считаные каналы на кого я подписан у меня стоит колокольчик, но Аюб один из них. Жду всегда его видео! Подача улучшается с каждым видео. Растешь, Аюб, отлично! Миксы объяснения с примерами кода от "легких" до "сложных" очень гармонично + мини лайв кодинг.
Хороший урок. Нравится манера изложения материала. Все доходчиво. Если будешь записывать какой нибудь проект, обрати внимание на стек React/TS/mobX (MST)/React query/Storybook/Tests - не могу найти все в одном месте, а очень надо.
@@ayub_begimkulov Если это так, то вот и хотелось бы пояснения почему. То есть рассмотреть какой то простенький проект с применением этих технологий и пояснить, что лучше еще использовать, а что не использовать.
React query не в полной менее, но частично дублирует логику связанную с работой стейт менеджеров. У RQ на сайте есть таблица сравнения с другими популярными инструментами. В остальном всё нормально, на мой взгляд, но использование mobx зависит от проекта и команды
@@ayub_begimkulov не согласен, вот я тестирую сейчас: тип у переменной даже в видео показывает {} Если добавить типизацию результата функции, то TS нормально отреагирует только на возврат объекта, значит отсекаются все типы, у которых возможно falsy значение: string, number (и BigInt), null, undefined, boolean. Для меня только непонятно, почему Symbol тоже попадает под гильотину гарда, но я про него почти ничего и не знаю
Годный контент. Хочется в одном из следующих видосов разбор conditional types, особенно мне интересна проверка типов на идентичность. Почему чтобы точно гарантировать идентичность типов включая readonly нужно городить огород типа (() => T extends typeA ? 1 : 2) extends () => T extends typeB ? 1 : 2 ? true : false Мне кажется это очень некрасивым костылем) Или может я чего не знаю и в новых версиях есть более лаконичный способ на идентичность типов? Вроде [typeA] extends [typeB] ? [typeB] extends [typeA] ? true : false : false уже лучше читается и понимается, работает со всем, только не учитываает readonly если оно принципиально
Аюб, у меня впрос Type Assertions: ты говоришь про кейворд asserts, но чаще встречается someValue или someValue as string. Это все одно и тоже или есть коренные отличия?
Нет, `as` или `` говорит компилятору о том, что мы сами знаем лучше о том, какой тип у значения. А asserts-фукнция будет выбрасывать ошибку, если тип не соответствуем нашим ожиданиям.
Супер, больше TS пожалуйста. За такой контент грех не поддержать) Мб оставишь реквизиты в телеге? Думаю, многие бы хотели поддержать и больше мотивировать на крутой контент
Рад, что понравилось. Я на самом деле не сторонник деньги так собирать, но могу подумать. А так если хочешь поддержать - я думаю коучинг/консультации/менторинг запускать, так как просят часто. Можно таким образом поддержать ну и себе пользу получить)
я думаю zod и аналоги решают же похожую проблему, но в рантайме, так вот, было бы интересно узнать мнение, что лучше использовать, условный zod(имхо меньше кода) или тайп гарды и тайп ассершены?
6:08 вы представляете какой удар по производительности ф-ии такое число ретурнов? ретурн должен быть один чтоб при оптимизациях в хост среде можно было заинлайнить всю ф-ию. а это создаст дополнительный екзекюшн контекст
у тебя на 9:14 идет две проверки на null и undefined. Можно вместо `value !== undefined & value !== null` написать `value != null` и получить тот же результат
Аюб привет, а можешь пожалуйста вкратце сказать в чем разница в использовании типов object и Object? нашел инфу но не понял до конца что за тип такой Object с большой буквы который
Не могли бы сделать видео на тему монорепо. Второй день не могу настроить, стек react, nestjs. Хотелось бы папку workspace с 1. react, 2.nestjs, 3.shared-types (types, interface, enums для бека и фронта), 4, shared-components (компоненты для реакта). Если не по теме канала, можно наверно сделать тоже самое но без бекенда. Заранее спасибо.
Из того, с чем сталкивался. Важно определиться, хочешь ли ты оптимизировать хранение зависимостей (типа хранить общие зависимости в корне, остальное по workspace) или просто нужна возможность подключать "локальные библиотеки" типа shared. С первым можно хлебнуть по полной на тех же простых yarn workspaces. Хотя может я готовить их не умел. Если nest с react и ангуляром еще кое-как упихал с помощью занесения в "nohoist" кучи вспомогательных вещей (eslint, webpack, babel etc), то vue уже в это общежитие не вписался, что-то обязательно где-то ломалось. Но если не париться насчет оптимизации, а просто все занести в "nohoist" - то вполне прошло бы. Также есть такая вещь, как Nx. Вариант попроще - "Package-Based Repos" (похож на простые workspaces с полным разделением зависимостей, но добалены какие-то фишки по управлению этим хозяйством), и вариант посложнее - "Integrated Repos". Я выбрал ради интереса второй, причем в конфигураторе при установке в качестве сборщика выбрал Vite (он был на первой строчке, но по умолчанию почему-то предлагался webpack на второй, и я решил исправить несправедливость). Но видимо, Vite на первой строчке не был выбран по умолчанию неспроста, и пришлось на каком-то этапе переделать монорепо на webpack (были какие-то проблемы с переменными окружения). Ситуация может поменяться, естественно.
На самом деле опыт не большой у меня, я работал только с yarn workspaces. Мне их хватило вполне, хотя вот тут человек говорит, что были проблемы у него. Сейчас тулинг вокруг этого сильно улучшился (turborepo, nx и тд.), можно и другие варианты попробовать. В общем, я бы рекомендовал начать с workspaces, если просто шарить нужно типы. Касательно сетапа глянул бы в популярных либах как сделано (точно знаю, что mobx, react, vue юзают). По уроку, я запишу себе, да и так было в планах настроить для одного проекта, но вряд ли прямо в ближайшее время выйдет ролик.
ts с in оператором работает криво. ты в примере пишешь "key" но если использовать не конкретную строку, а переменную, и попытаться использовать ее в качестве ключа для объект будет выдаваться ошибка
К сложению нет, TS подсвечивает далеко не все ошибки. А иногда считают за ошибку то - что не является таковой. Type guards как раз могут с этим помочь компилятору.
Привет, урок хороший, полезный, но скучный. Лично я на 10 минутах уже заскучал и выключил ролик. Лично мне, приятно смотреть ролики до 10 минут, где все чётко и по факту без лишнего, тут ты очень много времени рассказываешь просыте вещи например как работает if и что вернется в итоге и т.д, я думаю человек посмотрит код, и сразу поймет что делает if и как будет выполнен код, твоя задача рассказать сам кейс когда это применять и показать, а остальное это уже другие темы, но это мое мнение кому-томожет нравитсч подобного рода ролики. Спасибо за труд
Я считала, что неплохо знаю typescript, но смотря твои видео уже сделала пару открытий для себя! Я не знала про function type assertion. А в видео про дженерики я узнала, что функцию type guard можно использовать для сужения key (function hasOwn)
Благодарю!
Парень, годно очень, помогаешь молодым джунам понимать тайпскрипт)
Спасибо за фидбэк!
Школьник учит джунов
@@sjdjjsjsjs3991 кринжа отвалил и сидишь довольный?
То что нужно, продвинутый TS контент
Спасибо за фидбэк!
какое же полезное видео, периодически пересматриваю)))) СПасибо! реально по ТС. лучший контент на руЮтубе!
Антон, спасибо больше за фидбэк!
Забыл сказать, что на считаные каналы на кого я подписан у меня стоит колокольчик, но Аюб один из них. Жду всегда его видео! Подача улучшается с каждым видео. Растешь, Аюб, отлично! Миксы объяснения с примерами кода от "легких" до "сложных" очень гармонично + мини лайв кодинг.
Спасибо большое!
главный фаворитов у кого нужно учиться TS по моему мнению !!! я не новичок в TS, то что показывает юзкейсы на TS пока не видел у других ютюб учителей
Спасибо большое!
Очень интересный контент и подача! Спасибо!
не за что!
Все круто.
Однозначно ждем больше TS.
Спасибо!
Спасибо, за хорошее объяснение важной темы)
Рад, что понравилось!
Отличное видео, спасибо Аюб!
Рад, что понравилось!
Спасибо тебе Аюб, великолепно объясняешь, открывай патрион, или что-нибудь подобное, с радостью оформлю подписку на регулярные ролики такого плана.
Спасибо! Если открою - дам знать обязательно.
Спасибо большое! Написал свой первый кастомный type guard!)
Поздравляю!
Большое спасибо за видео! Очень качественный контент и хорошая подача. Напоминаешь мне Тимура Ulbi. :)
Рад, что понравилось!
Видел твое интервью годичной давности, тайпскрипт ты подтянул, молодец
Если интервью на моем канале - то я был собеседующим) А так, спасибо за фидбэк!
Аюб, большое спасибо! Смотрю с удовольствием)
Рад помочь!
Spasibo za video!
Спасибо большое за урок. Мега полезный контент, подача стала огонь
Спасибо!
Крутой урок, жду следующего!)
Спасибо!
Лайк не глядя!! Продолжай больше ТСа! #Typescript #react #javascript #ts #js #it
Спасибо за поддержку!
Спасибо Аюб, как всегда крутое видео, продолжай 👍
Спасибо!
Крутой ролик !
Спасибо!
Очень полезно. Ждем следующий урок!
Спасибо, должен скоро выйти!
Супер, спасибо большое за видео!
Рад помочь!
Спасибо, видео оч.полезное!
Рад, что понравилось.
отличное видео
Спасибо!
Очень хороший урок, больше спасибо )
Рад, что было полезно!
Привет! Благодарю за видео!
а что за магия с "^?" ? )))
это какой-то плагин?
Да, vscode-twoslash-queries
@@ayub_begimkulov разве в этом есть какая то фишка по сравнению с тултипом от vscode при ховере по переменной?
👍👏
комментарий в поддержку канала
Спасибо!
Хороший урок. Нравится манера изложения материала. Все доходчиво.
Если будешь записывать какой нибудь проект, обрати внимание на стек React/TS/mobX (MST)/React query/Storybook/Tests - не могу найти все в одном месте, а очень надо.
Спасибо за фидбэк! По стеку - все норм, правда думаю оверкилл иметь mobx и react query в одном проекте. Но это все по ситуации.
@@ayub_begimkulov Если это так, то вот и хотелось бы пояснения почему.
То есть рассмотреть какой то простенький проект с применением этих технологий и пояснить, что лучше еще использовать, а что не использовать.
React query не в полной менее, но частично дублирует логику связанную с работой стейт менеджеров. У RQ на сайте есть таблица сравнения с другими популярными инструментами.
В остальном всё нормально, на мой взгляд, но использование mobx зависит от проекта и команды
8:35 if (value) отсекает не только null и undefined, а еще boolean, string, number
На уровне типизации уберутся только null и undefined. Ну и boolean превратится в true. А string и number так и останутся.
@@ayub_begimkulov не согласен, вот я тестирую сейчас: тип у переменной даже в видео показывает {}
Если добавить типизацию результата функции, то TS нормально отреагирует только на возврат объекта, значит отсекаются все типы, у которых возможно falsy значение: string, number (и BigInt), null, undefined, boolean.
Для меня только непонятно, почему Symbol тоже попадает под гильотину гарда, но я про него почти ничего и не знаю
function foo(value: unknown): object {
if (value) {
return value
}
return {}
}
контент по тайпскрипту у тебя не имеет равных помоему на руЮтубе)
Спасибо большое!
Больше тса!
Обязательно.
Годный контент. Хочется в одном из следующих видосов разбор conditional types, особенно мне интересна проверка типов на идентичность. Почему чтобы точно гарантировать идентичность типов включая readonly нужно городить огород типа (() => T extends typeA ? 1 : 2) extends () => T extends typeB ? 1 : 2 ? true : false Мне кажется это очень некрасивым костылем) Или может я чего не знаю и в новых версиях есть более лаконичный способ на идентичность типов?
Вроде
[typeA] extends [typeB]
? [typeB] extends [typeA]
? true
: false
: false
уже лучше читается и понимается, работает со всем, только не учитываает readonly если оно принципиально
На самом деле второй пример еще кейсы с any не учтет, это тоже пробелма. А так да, надо будет разобрать. Спасибо за фидбэк!
Hi, сто думаешь насчёт zustand и effector??
Аюб, у меня впрос Type Assertions: ты говоришь про кейворд asserts, но чаще встречается someValue или someValue as string. Это все одно и тоже или есть коренные отличия?
Нет, `as` или `` говорит компилятору о том, что мы сами знаем лучше о том, какой тип у значения. А asserts-фукнция будет выбрасывать ошибку, если тип не соответствуем нашим ожиданиям.
Супер, больше TS пожалуйста. За такой контент грех не поддержать) Мб оставишь реквизиты в телеге? Думаю, многие бы хотели поддержать и больше мотивировать на крутой контент
Рад, что понравилось. Я на самом деле не сторонник деньги так собирать, но могу подумать.
А так если хочешь поддержать - я думаю коучинг/консультации/менторинг запускать, так как просят часто. Можно таким образом поддержать ну и себе пользу получить)
Привет! подскажи, а что это за плагин или сеттинга? которая выводит тип, после // ^?
Спасибо, а про 'infer' долго ждать :)?
Зависит от того, что по твоему мнению «долго» ). Я думаю через где-то 2 недели примерно будет, но может и раньше.
@@ayub_begimkulov Спасибо. Ждём с нетерпением :)
я думаю zod и аналоги решают же похожую проблему, но в рантайме, так вот, было бы интересно узнать мнение, что лучше использовать, условный zod(имхо меньше кода) или тайп гарды и тайп ассершены?
6:08
вы представляете какой удар по производительности ф-ии такое число ретурнов?
ретурн должен быть один чтоб при оптимизациях в хост среде можно было заинлайнить всю ф-ию. а это создаст дополнительный екзекюшн контекст
у тебя на 9:14 идет две проверки на null и undefined. Можно вместо `value !== undefined & value !== null` написать `value != null` и получить тот же результат
Да, можно. Но кажется это будет более непонятный код.
Не нашел я в документации TS-а ключевое слово asserts. По теме type assertion там используется или дженерик или ключевое слово as. Можешь пояснить?
ключевое слово `asserts`, на доку вот ссылка - www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html#assertion-functions
Аюб привет, а можешь пожалуйста вкратце сказать в чем разница в использовании типов object и Object? нашел инфу но не понял до конца что за тип такой Object с большой буквы который
все нашел в видео у тебя на канале) спасибо)
Ага)
Не могли бы сделать видео на тему монорепо. Второй день не могу настроить, стек react, nestjs. Хотелось бы папку workspace с 1. react, 2.nestjs, 3.shared-types (types, interface, enums для бека и фронта), 4, shared-components (компоненты для реакта). Если не по теме канала, можно наверно сделать тоже самое но без бекенда. Заранее спасибо.
Из того, с чем сталкивался. Важно определиться, хочешь ли ты оптимизировать хранение зависимостей (типа хранить общие зависимости в корне, остальное по workspace) или просто нужна возможность подключать "локальные библиотеки" типа shared. С первым можно хлебнуть по полной на тех же простых yarn workspaces. Хотя может я готовить их не умел. Если nest с react и ангуляром еще кое-как упихал с помощью занесения в "nohoist" кучи вспомогательных вещей (eslint, webpack, babel etc), то vue уже в это общежитие не вписался, что-то обязательно где-то ломалось. Но если не париться насчет оптимизации, а просто все занести в "nohoist" - то вполне прошло бы.
Также есть такая вещь, как Nx. Вариант попроще - "Package-Based Repos" (похож на простые workspaces с полным разделением зависимостей, но добалены какие-то фишки по управлению этим хозяйством), и вариант посложнее - "Integrated Repos". Я выбрал ради интереса второй, причем в конфигураторе при установке в качестве сборщика выбрал Vite (он был на первой строчке, но по умолчанию почему-то предлагался webpack на второй, и я решил исправить несправедливость). Но видимо, Vite на первой строчке не был выбран по умолчанию неспроста, и пришлось на каком-то этапе переделать монорепо на webpack (были какие-то проблемы с переменными окружения). Ситуация может поменяться, естественно.
На самом деле опыт не большой у меня, я работал только с yarn workspaces. Мне их хватило вполне, хотя вот тут человек говорит, что были проблемы у него.
Сейчас тулинг вокруг этого сильно улучшился (turborepo, nx и тд.), можно и другие варианты попробовать.
В общем, я бы рекомендовал начать с workspaces, если просто шарить нужно типы. Касательно сетапа глянул бы в популярных либах как сделано (точно знаю, что mobx, react, vue юзают).
По уроку, я запишу себе, да и так было в планах настроить для одного проекта, но вряд ли прямо в ближайшее время выйдет ролик.
ts с in оператором работает криво. ты в примере пишешь "key" но если использовать не конкретную строку, а переменную, и попытаться использовать ее в качестве ключа для объект будет выдаваться ошибка
Сладкий
Посмотрел и ничего не полня, почему тайпоф в тс называется тайпгуардом?
typeof является тайпгардом, а не называется так. Тайпгард - проверка, которая дает гарантию компилятору, что значения является определенного типа.
пишу что-то...
Спасибо!
Ты делаешь всё не правильно. Нужно писать не что-то, а что-то для продвижения канала.
tipescript итак все ошибки подсвечивает нахрена столько городить?
К сложению нет, TS подсвечивает далеко не все ошибки. А иногда считают за ошибку то - что не является таковой. Type guards как раз могут с этим помочь компилятору.
Привет, урок хороший, полезный, но скучный. Лично я на 10 минутах уже заскучал и выключил ролик. Лично мне, приятно смотреть ролики до 10 минут, где все чётко и по факту без лишнего, тут ты очень много времени рассказываешь просыте вещи например как работает if и что вернется в итоге и т.д, я думаю человек посмотрит код, и сразу поймет что делает if и как будет выполнен код, твоя задача рассказать сам кейс когда это применять и показать, а остальное это уже другие темы, но это мое мнение кому-томожет нравитсч подобного рода ролики. Спасибо за труд
Привет. Да, доносить инфу в короткий срок - пока не мой стихия, но буду работать. Спасибо за фидбэк!
удали редактор кода и иди работать на завод
Удали ютуб и иди смотреть телевизор.
16:55 здесь можно просто не писать if else а сразу же вернуть результат проверки который находится внутри if😊
)))