Decoding Perplexing TypeScript by Daria Caraway

Поділитися
Вставка
  • Опубліковано 6 вер 2024
  • Have you ever come across a TypeScript type that made you go “nope” and close the file? Have you ever seen a type definition that had so many generic letters and nested statements, it felt utterly incomprehensible? In this talk, I will break down and decode some of the most perplexing TypeScript type definitions I have found in real life. You will learn how to make sense of these complex types and the TypeScript building blocks that compose them.
    jsconfbp.com/s...
    Daria is a Speaker and Senior Software Engineer at Netflix where she builds web applications for Netflix Content Strategists. She has been an avid lover of TypeScript for the past 9 years and enjoys helping people level up their React and TypeScript skills. When not coding, Daria is often found traveling, eating good food, and traveling to eat good food.

КОМЕНТАРІ • 28

  • @fabiolean
    @fabiolean Місяць тому +3

    I'm mostly a python dev whose new job requires me to learn typescript for some of our internal tooling. This talk is absolutely phenomenal and a legit practical help for me.

  • @qodesmith520
    @qodesmith520 Місяць тому +4

    Fantastic talk. You have a gift teaching TypeScript! Learned so much even after years of using TS.

  • @Yoband706
    @Yoband706 Місяць тому +5

    Amazing slides 🤣 Great talk and a good reminder that I should probably make TypeScript do more work than I do now 😶

  • @xorlop
    @xorlop Місяць тому +3

    The theme was so cool! Great talk :)

  • @dmitrymakhnev
    @dmitrymakhnev 22 дні тому

    Amazing talk! Many thanks.

  • @bananasba
    @bananasba Місяць тому +4

    Types are language in the language but without option to debug and test.

    • @ryanbeatbox
      @ryanbeatbox Місяць тому

      You can test types with vitest

  • @abcq1
    @abcq1 Місяць тому +3

    That level 4 boss is exactly what I needed to properly type my Todolist app.

  • @browsermage
    @browsermage Місяць тому +14

    Great talk, but the reason TS is spawned from the depths of Hades

    • @trontrontrontron4
      @trontrontrontron4 Місяць тому

      if we could meet, i would fight you. and i would win, cause i got TS on my side you sinner.

  • @nicknelson1975
    @nicknelson1975 Місяць тому

    Seems like there are some really interesting functional programming capabilities with that type system. I wish it were a little easier to read, though.

  • @dkazmer2
    @dkazmer2 Місяць тому +1

    Nice!

  • @MrSprinkles1F369
    @MrSprinkles1F369 Місяць тому

    I lost at level 1. I dont know what I'm looking at. Why is there a ternary operator in there?

  • @douglasamoo-sargon5049
    @douglasamoo-sargon5049 Місяць тому

    Awesome talk..

  • @AbhishekVaid
    @AbhishekVaid Місяць тому +3

    Very confusing and not so useful talk. I understand lot of effort went behind it, but it wasn't pedagogically useful.

  •  Місяць тому +2

    I found the talk too confusing to follow. It's an attempt to explain some more difficult concepts of TS but I think it's trying to do too much in 20 min. Maybe if some real life examples were provided it would have made more sense.

  • @johannesloher2817
    @johannesloher2817 Місяць тому

    FYI: The type at 14:24 is incorrect (it doesn’t even compile). `infer` is needed before `U` (it’s correct in example 3).
    Aside from that: Decent talk for people who have not looked very deeply into TypeScript's type system so far, but if you already have some experience, it’s not that interesting. Most of the stuff is actually quite basic compared to some of the more nuanced intricacies of the type system.

    • @JonNordland
      @JonNordland Місяць тому +1

      Claiming we need "infer" before U in this TypeScript code is mistaken.
      The code aims to extract keys from an object type V where the corresponding values match a certain shape.
      The type uses a mapped type with a conditional type inside. It's checking if each property of V (excluding null) extends a shape with 'a' and 'b' properties of the same type U.
      The U in this context is already being inferred by TypeScript. When you use a type parameter in an extends clause like this, TypeScript automatically infers the type. The "infer" keyword is used in conditional types to introduce a new type variable to be inferred. It's typically used when you want to extract a type from another type in a condition. In this case, we're not trying to extract U from anywhere; we're using it as a comparison.
      This type is already valid and will work as intended. Adding "infer" before U would actually cause a syntax error.
      If you wanted to use "infer", you'd need to restructure the type significantly
      But this would change the meaning of the type, as it would no longer exclude null from V[K] before checking the shape.
      In conclusion, the original type is correct as it is, and doesn't need the "infer" keyword. You might have misunderstood the purpose of "infer" or confused it with a different scenario where "infer" would be necessary.
      More interestingly; why did you have to humble brag by claiming “this is easy”?

    • @johannesloher2817
      @johannesloher2817 Місяць тому +1

      @@JonNordland It's not mistaken. If you need proof, just try it out yourself. I cannot link to the TypeScript playground here, but you can just copy this over:
      type IsTruthy = T extends null | undefined | false | 0 | "" ? true : false;
      type ValidKeys = {
      [K in keyof V]-?: (Exclude) extends { a: U; b: U } ? IsTruthy extends true ? K : never : never; // Does not compile
      }[keyof V];
      I did not try to "humble brag". I just tried to let people know what they can expect from this talk. The topics covered are: Union types, conditional types, generic types, built-in utility types like Omit, Pick and Exclude, keyof, infer in conditional types, never, mapped types, mapping modifiers (technically, only -?), indexing of types. For anybody who has already worked a decent amount with TypeScript, all of this is pretty standard, in my opinion.
      The talk does not cover more complex concepts like key remapping in mapped types, distributing over union types in conditional types (and how to prevent it), variance, etc.
      But that's totally fine. It just means, this talk is not for experienced TypeScript users. It's still very useful for people who are only just starting to get to know the TypeScript type system in more detail.

  • @bananasba
    @bananasba Місяць тому +1

    TypeScript is going down, types are too complex for simple, trivial tasks.

    • @xorlop
      @xorlop Місяць тому

      Have you tried using `unknown` or `any`? All the javascript you write is Typescript. Typescript is there to add types when you are ready :). Starting with `unknown` or `any` types are a great way to start.
      The reason many people are passionate about Typescript is because well-typed programs do not go wrong. The better code is typed, the better your program is guaranteed to run correctly.
      It is a completely opt-in system! If you are writing JS, you are already writing typescript!

    • @AMar4enko
      @AMar4enko Місяць тому

      You wish buddy :D

    • @nicknelson1975
      @nicknelson1975 Місяць тому

      Yet strongly-typed languages are abundant and strong...It's not going anywhere.

  • @scattermc
    @scattermc Місяць тому

    Id rather do everything u wanna do in Typescript in C. That's just me tho. Typescript is boring and sucks. Literally typing so much for no reason.. nowadays its all about who has the best autocomplete so whatever, enjoy breaking your Tab key

    • @xorlop
      @xorlop Місяць тому

      How is Typescript boring? I find it very fascinating. Same with C.
      C has simple primitive types. That is cool. Typescript has primitives, generics, and has a structural typing system. That is awesome!
      What makes Typescript suck for you?

    • @scattermc
      @scattermc Місяць тому

      @@xorlop So many keywords and different ways to do things. Im not really a fan of OOP either. And tbh why so many different to make an object NULL? Theirs like three diff ways i think right? (undefined, never, and NULL). I just dont get it how anybody can sit here and listen to this crap

    • @neociber24
      @neociber24 26 днів тому

      Do you develop websites in C?

    • @scattermc
      @scattermc 26 днів тому

      @@neociber24 Obviously