TypeScript 5.3 First Look

Поделиться
HTML-код
  • Опубликовано: 28 июн 2024
  • TypeScript 5.3 is coming, and today we got the first hints on what it might contain. Here's the full breakdown!
    00:00 Intro
    00:20 Import Attributes
    01:23 Throw Expressions
    02:13 Isolated Declarations
    03:39 Narrowing in Generic Functions
    04:33 Loose Autocomplete
    05:10 Fetch in Node
    05:38 Outro
    Full article: www.totaltypescript.com/types...
    Become a TypeScript Wizard with my free beginners TypeScript Course:
    www.totaltypescript.com/tutor...
    Follow Matt on Twitter
    / mattpocockuk
    Join the Discord:
    mattpocock.com/discord
  • НаукаНаука

Комментарии • 79

  • @keelangibb565
    @keelangibb565 2 месяца назад

    For anyone running into the @typescript-eslint/ban-types: Don't use `{}` as a type. `{}` actually means "any non-nullish value" problem.
    You can get around this error by doing this instead. type IconSize = "small" | "medium" | "large" | (string & NonNullable);
    This strips undefined and null from unknown which leaves you with {}, This is equivalent to the code in the video but you no longer have to disable the rule in your editor. Hope that helps :)

  • @CoentraDZ
    @CoentraDZ 9 месяцев назад

    “Type”Script taking types too seriously

  • @user-yz2mv8kn4x
    @user-yz2mv8kn4x 10 месяцев назад

    great informative video, looking forward to your TS book :)

  • @normanaranez323
    @normanaranez323 10 месяцев назад

    Hi Matt, can you also check prisma on how we can create props base on the prisma setup, that would be great too 😊

  • @MrGVSV
    @MrGVSV 10 месяцев назад +1

    Interesting to hear about that string union trick. Might be IDE specific, since I’ve just done `| string` before and WebStorm autocompletes just fine

    • @karamuto1565
      @karamuto1565 10 месяцев назад

      I guess that's because Webstorm adds some of their own stuff on top of the default language service.
      They just recently included their own version of the "pretty-ts-errors" lib into the thing and it's already pretty good.

  • @maxijonson
    @maxijonson 10 месяцев назад

    throw expression and (string & {}) 👌👌👌👌👌

  • @somegaydog
    @somegaydog 10 месяцев назад

    Needing to include the dom lib types just to use native fetch has always been really annoying

  • @emilbeothy5152
    @emilbeothy5152 10 месяцев назад

    Even cooler than throw expression would be return expression. The throw case can already kind of achieved by wrapping it in a function, but with return that is not possible.

  • @DarrylHebbes
    @DarrylHebbes 10 месяцев назад

    Typescript team are doing it for attention now…. Like IG influencers

  • @Mitsunee_
    @Mitsunee_ 10 месяцев назад

    Oh they are fixing the string autocomplete thing? I have a lint rule that disallows using {}, so I guess the eslint disable comment there is now officially temporary :)

  • @ThEldeRS
    @ThEldeRS 10 месяцев назад

    #NotSoHotTake:
    Errors as value > Throwing. The fact that you can't know if a function is going to throw or not and the inconsistency in the "standard" library are incredibly frustrating! Return an error type like Go and Rust, have strong prototypes like the Option or Result in Rust, either way would be 100 times better than throwing errors.

  • @cristobalcontrerasrubio4695
    @cristobalcontrerasrubio4695 10 месяцев назад +1

    I'm really glad to discover you. Thanks to you Matt I'm improving a lot 👍👍👍

  • @chstappert
    @chstappert 10 месяцев назад

    Thanks for this summary. Looking forward to work with 5.3

  • @developerpranav
    @developerpranav 10 месяцев назад

    autocomplete for "| string" lets go!!

  • @PaulSebastianM
    @PaulSebastianM 10 месяцев назад

    They need to simplify TS, not make it more complicated... unless it increases DX and developer ergonomics.

  • @a-yon_n
    @a-yon_n 10 месяцев назад

    I hope they allow import statements with extentions

  • @rnz2363
    @rnz2363 10 месяцев назад +1

    exceptions as an expression ? i hope this never happens.
    you either deal with exceptions, which is a side effect, or with errors as value, but why mix both ?
    i think this is really stupid and yet another pile of junk on top of javascript.

    • @user-fr2fm3ri3w
      @user-fr2fm3ri3w 10 месяцев назад

      Imagine thinking JavaScript of all things in the planet is perfect and needs no changed in top of it to make it bearable 🥶

  • @samarbid13
    @samarbid13 10 месяцев назад

    I think Next version should be: Integrating TypeScript with Copilot marks a new era where AI handles type management, freeing developers for more innovative tasks. Let's redefine our workflow, making types the domain of AI, and elevate creativity for developers!
    it's 2023!

    • @user-fr2fm3ri3w
      @user-fr2fm3ri3w 10 месяцев назад

      Actually the opposite if you don’t have an interface copilot has a stroke and even tried to divide by 0 and such

  • @karamuto1565
    @karamuto1565 10 месяцев назад +8

    I would like to have "throws" declarations in typescript. This way we could better describe functions that should have a try / catch block around their call.

    • @mattpocockuk
      @mattpocockuk  10 месяцев назад +12

      This won't be added, for many reasons - should record a video about this.

    • @barneylaurance1865
      @barneylaurance1865 10 месяцев назад

      Similar to checked exceptions in Java. Possibly one of the most complained about features of Java though. I remember Phpstan has an interesting approach to it.

    • @schwarkof
      @schwarkof 10 месяцев назад

      Doesn’t this kind of go against the pattern of functional programming? Not to say that’s really at play here, but feels like this new “throws” declaration leans back towards the classic try/catch style of code.

    • @karamuto1565
      @karamuto1565 10 месяцев назад +1

      @@mattpocockuk I will look forward to it. That there is currently no way of telling that a function can error is one of the biggest downfalls of JS and TS doesn't provide any improvement here.

    • @karamuto1565
      @karamuto1565 10 месяцев назад

      @@barneylaurance1865 I rather have some way of telling a function errors then none. Uncatched errors are a nightmare in JS/TS.

  • @danielschwartz516
    @danielschwartz516 10 месяцев назад

    string & {} 🤯

  • @SexyBeast4444
    @SexyBeast4444 10 месяцев назад +1

    Don't really get import attributes. If the argument is security, then you could have a compiler flag that checks if the extension that you are trying to import is actually what it claims to be.
    If the counter argument to this is that you want to do it selectively, then something like: import json from './foo.json' with check; would be more clear.
    But I guess this gives freedom to import any extension and check for any extension at the cost of boilerplate.

    • @SamualN
      @SamualN 10 месяцев назад +3

      import attributes are part of javascript not typescript so there's no compiler checks.
      and in web land, extensions don't determine types, mime types do so a foo.json could resolve to a javascript module with a javascript mime type

  • @sillvvasensei
    @sillvvasensei 10 месяцев назад +3

    Really excited about the narrowing

  • @s_gryt
    @s_gryt 10 месяцев назад

    Well, the autocomplete is indeed a cool feature. Linter has always been pissed about an intersection type with a {} 💩

  • @s_gryt
    @s_gryt 10 месяцев назад +2

    I’d rather have nullish coalescing throw. It is way obvious in null pointer context: (example): null ?? throw new Error(‘…’);

    • @mattpocockuk
      @mattpocockuk  10 месяцев назад +1

      Once this proposal lands, you can also have nullish coalescing throw, or throw in a ternary.

  • @maxilkiv
    @maxilkiv 10 месяцев назад

    can't stop the TS-train 🔥🔥🗣🗣🗣🗣

  • @jacoblockwood4034
    @jacoblockwood4034 10 месяцев назад +28

    Ideas for your TypeScript book:
    - Teach the TSConfig well with sensible defaults
    - Mention the annoying caveats with React, etc and how to deal with them.
    - Idea for a more advanced exercise, maybe for near the end of the book: "Try to implement a Repeat that outputs TString repeated TNum times."

    • @mattpocockuk
      @mattpocockuk  10 месяцев назад +5

      TSConfig is definitely in there. Caveats with React are in my React module on TT.

    • @joaofrancisco5781
      @joaofrancisco5781 10 месяцев назад

      ​@@mattpocockuk Thanks, I'll watch those modules, awesome

  • @shapelessed
    @shapelessed 10 месяцев назад

    Finally they fixed throwing errors in conditional statements...

  • @jacoblockwood4034
    @jacoblockwood4034 10 месяцев назад

    Well, the updates start shippin' and they don't stop shippin'…

  • @DisturbedNeo
    @DisturbedNeo 10 месяцев назад +4

    Not personally a fan of the proposal for imports. If you give developers the option, most won't use it and the rest will probably use it wrong. Since there's no reason I know of to ever import, for example, JSON with type Javascript, only ever with type JSON, just infer the "with" type based on the file extension and do the security check behind the scenes.
    And with that, you just automatically boosted the security of every Typescript application from 5.3 onwards without any developer needing to do anything different. _That_ would be a good change.

    • @LongNguyen-dh3bm
      @LongNguyen-dh3bm 10 месяцев назад +1

      This is not because people "make a JSON file that has JS in it", it's to ensure that the code will only accept JSON from the server, so a malicious actor can't swap out the content of a JSON file with something else.

  • @patfre
    @patfre 10 месяцев назад

    Nice but can browsers finally start allowing import json?

    • @patfre
      @patfre 10 месяцев назад +1

      @@codernerd7076 well Apple is one of the companies who already do support it. Firefox and Opera are the only ones that do not. Safari has done since IOS 15 or ALMOST 2 YEARS and you say they are fighting against it, brainwashed person

  • @pupfriend
    @pupfriend 10 месяцев назад +2

    this was worth the watch just to see some of those hacks!

  • @pairofrooks
    @pairofrooks 10 месяцев назад

    oh god dont call people "wizards"!!!
    (urbandictionary.com is your friend)

  • @markzuckerbread1865
    @markzuckerbread1865 10 месяцев назад +5

    Throw expressions are very weird, an expression whose value is never used and one that only exists for its side effects? weird imo.

    • @joshuakb2
      @joshuakb2 10 месяцев назад +1

      It's an expression whose type is never, which makes sense because the expression never evaluates to anything. It would be very handy to use a `throw` expression as the default at the end of a long chain of optionals, like this:
      type X = null | { y?: { z?: string } };
      const f = (x: X): string => x?.y?.z ?? throw new Error('Cannot get x.y.z');

    • @barneylaurance1865
      @barneylaurance1865 10 месяцев назад +1

      It was implemented in PHP 8.0, which came out in 2020. Maybe a little weird, but very useful and I can't see any reason not to have it.

  • @ColinRichardson
    @ColinRichardson 10 месяцев назад +31

    Think my fav with all this is the throw expression

    • @svenyboyyt2304
      @svenyboyyt2304 10 месяцев назад

      I hope you can also do return, yield, continue and break in the same way.

    • @emmanuelmahuni8163
      @emmanuelmahuni8163 10 месяцев назад

      I actually used this expression a lot in regualar js some time back before using ts. When moved code to ts, it gave me that exact error. I was perplexed and just thought maybe there's something i m not aware of that this messes up since I never saw it used anywhere and had to refactor code. 😅 happy to see ts catching up on this.

    • @ColinRichardson
      @ColinRichardson 10 месяцев назад

      @@emmanuelmahuni8163 it's not that TS is catching up.. It's NEVER been possible in JS (and currently still isn't)..
      You may have wrote the code, but trust me, it wasn't working..

  • @lil_peepka
    @lil_peepka 10 месяцев назад

    Let em ship

  • @glorrin
    @glorrin 10 месяцев назад +28

    The one thing I am realy excited about is fetch XD
    But one thing I would love typescript to add is strongly typed throw errors

  • @method_actor
    @method_actor 10 месяцев назад

    Didn't know about that | ( string & {}) trick! I've been looking for something like that the past couple weeks

  • @parlor3115
    @parlor3115 10 месяцев назад +2

    I don't understand the IconSize example. If you want other values, then why not include them in the union?

    • @mattpocockuk
      @mattpocockuk  10 месяцев назад +5

      You want _arbitrary_ values, like '10px' or something.

    • @karamuto1565
      @karamuto1565 10 месяцев назад

      It's kind of an auto complete for the members but you can still assign any other string. This is useful if you don't know all members or it's just not worth to have all of them.

    • @parlor3115
      @parlor3115 10 месяцев назад

      @@mattpocockuk I guess this is a old issue because now it's fixed with template literal types.

  • @BinaryReader
    @BinaryReader 10 месяцев назад +1

    Throw Expressions would be amazing...you can have them today with.....
    const X = Y || (() => { throw Error('nope') })()

    • @s_gryt
      @s_gryt 10 месяцев назад

      Posted a comment above about nullish coalescing throw (imo, would look more obvious) const { x } = obj ?? throw new Error() or const x = obj.x ?? throw new Error()

  • @devinsights8021
    @devinsights8021 10 месяцев назад +2

    Great work 🎉

  • @Dev-Siri
    @Dev-Siri 10 месяцев назад +1

    they substituted the previously deprecated with keyword for import-type-assertions???

    • @mattpocockuk
      @mattpocockuk  10 месяцев назад +1

      The proposal changed from assertions to attributes.

  • @codernerd7076
    @codernerd7076 10 месяцев назад +1

    Typescript moving too far ahead from Javascript the main function is types. But they now act like it's their language and trying to force Javascript features to be added.

    • @ColinRichardson
      @ColinRichardson 10 месяцев назад +3

      I can live with that. It acts like a polyfill until JS catches up. The fact that you can write obj.with?.optional.props and then tell TS to output valid es5 with a bunch of `(_a = obj.with) === null || _a === void 0 ? void 0 : _a.optional.props` to make it work.. LOVE IT..
      And TS being the forerunner means they can just polyfill until JS catches up in like ES2045 or what ever.

    • @PatricioHondagneuRoig
      @PatricioHondagneuRoig 10 месяцев назад

      And I wouldn't mind that one bit!

  • @brangtoggez6363
    @brangtoggez6363 10 месяцев назад +2

    Has anybody tried Matt's courses ? On Reddit people disliked his courses a lot since it's pricey and don't teach much, all he did was just giving problems that will never be appeared in real life or anything like that ? I am confused here. His content on youtube is too good to even believe that.

    • @mattpocockuk
      @mattpocockuk  10 месяцев назад +4

      The free tutorials should give you a taste!
      www.totaltypescript.com/tutorials

    • @brangtoggez6363
      @brangtoggez6363 10 месяцев назад

      @@mattpocockuk Thanks, I'll give it a try. Please excuse me if I say anything that can make you sad, it's just pretty pricey for asians like me so I have to consider. again thanks!

    • @mattpocockuk
      @mattpocockuk  10 месяцев назад +3

      @@brangtoggez6363 No worries pal, it's absolutely an investment. It's ideally designed for your work to pay with an education budget.

    • @QwDragon
      @QwDragon 10 месяцев назад +1

      Any problem sometime will ocur in real life.

    • @symix.
      @symix. 10 месяцев назад +2

      I feel like people who have hard time with "problems that will never appear in real life" just dont understand generalization / abstraction (or are not aware of it), like if you learn to solve problem X, and you need to solve Z, your mind could get to answer using parts of X (and you wont even necessarily know your brains did that, they can do lot of stuff on the background)