Fascinating video. I'm really looking forward to learning more.
@antonodman5709
3 ай бұрын
Great video! Short and interesting, very valuable knowledge. Subbed! :)
@TimaGixe
3 ай бұрын
Nice video with great explanations. By the way, what IDE do you use?
@Typed-Rocks
3 ай бұрын
@@TimaGixe Thank you, I use IntelliJ
@tngerik14
3 ай бұрын
Amazing content. I'd like to know how did you setup that " // ^? " functionality to see type information permanently in the editor. You used it in previous videos. Is it a plugin? I can't find out anything about it and it doesn't work in VSCode and IntelliJ
@Typed-Rocks
3 ай бұрын
@@tngerik14Thank you. I‘ve created a plugin called „WiTT“ and you can download it from the Marketplace in IntelliJ. plugins.jetbrains.com/plugin/23294-witt--typescript-type-hints-like-in-the-ts-playground For VSCode there is a plugin called „vscode-twoslash-queries“ 👍 marketplace.visualstudio.com/items?itemName=Orta.vscode-twoslash-queries
@tngerik14
3 ай бұрын
@@Typed-Rocks Thank you! But there is probably no way it can work within Vue's script section, right?
@Typed-Rocks
3 ай бұрын
@@tngerik14 Currently not. But I will check if I can support it. Great idea 👍
@Typed-Rocks
3 ай бұрын
@@tngerik14 Just a quick update. I've added the possibility to use it in Vue Scripts and sent it to Jetbrains for review. Will give an update as soon as it's available. Or just install the current version and get the update with vue support automatically. :)
@tngerik14
3 ай бұрын
@@Typed-Rocks Terrific! I looked into the repo for the vscode extension and there is an open issue to this topic too. But seems like there are some limitations and it can't be supported right now. Unfortunately I use vscode more often but your extension is even better. Less laggy, shows more characters...
@jishnuviswanath
2 ай бұрын
Nice video. First time watching you. Thank you algorithm. PS: what's the blue concentric circle with red up arrow in your editor?
@derciojds
2 ай бұрын
Replying just in case someone responds
@Typed-Rocks
2 ай бұрын
This points to the type where this property has its type origin. When I click on it it redirects me to the type.
@mrbelkabachi
3 ай бұрын
Amazing explanation.
@whotao6259
2 ай бұрын
The mapped type might be more succinct and useful if it didn’t have an “extends” in the keys and the original types were actually used. For example: type MyType = { [K in key of T as `on.${Capitalize}`]: (value: T[K]) => any } When you iterate over the keys of some generic object, TS assumes that it’s “symbol | string | number”. While these types aren’t strings, they’re still “string able”, i.e. you can use them in template strings like `prefix.${string | symbol}`. You could also “assert” that the key should be a string by using extract, e.g. Extract. This automatically “returns” never if the key isn’t a string. It’s just a bit neater than having a nested extends directive; those should probably be reserved for omitting keys based on the original value.
@Typed-Rocks
2 ай бұрын
Looks great
@malvoliosf
3 ай бұрын
Waiting on the definitive `never` video...
@Typed-Rocks
3 ай бұрын
Thank you 🙏 Working on it
@Typed-Rocks
3 ай бұрын
@@malvoliosf its there 👍. Thanks for the suggestion
@rea_kr
2 ай бұрын
와! 너무 재밌게 봤어요. 구독 완료하였습니다.
@nadavgover6017
2 ай бұрын
Cool! What if one of the properties Events are optional?
@Typed-Rocks
2 ай бұрын
Then your on type will also be optional 👍😎
@LePhenixGD
3 ай бұрын
Amazing!
@dennis_benjamin
2 ай бұрын
Great interesting video and really well explained. But also this is why I think typescript is awefull and can become extremely hard to read. In a fully typed language you would just have a class for every event inheriting from a common parent class. You would have a service which has an overloaded onEvent method for each Event and you are fine.
@Caldaron
2 ай бұрын
Extract does the same as the extends and doesnt need the ternary. Makes it a bit cleaner, credits go to ChatGPT ;-)
@VonCarlsson
2 ай бұрын
You can also do "K in keyof T & string".
@Typed-Rocks
2 ай бұрын
Interesting. Will check it out 👍
@krissh_the_dev
2 ай бұрын
Good video
@xyrn23
3 ай бұрын
nice, subbed.
@yt-sh
2 ай бұрын
DRY codes are awesome
@GreggBolinger
2 ай бұрын
Dear lord, just use an interface. This is why Typescript code bases become unreadable. It's good information, don't get me wrong. But it isn't a great example of how to apply this.
@Typed-Rocks
2 ай бұрын
Thanks for your comment. How would you do it? A type is basically the same as an interface. Could you provide me an example how you would do other? I would love to get ideas 😎. This is an example similar how typescript itself shows by the way. www.typescriptlang.org/docs/handbook/2/template-literal-types.html
@davidntumba2447
2 ай бұрын
Maybe it depends on the context 🤔. Based on the example, it seems that events is more of a collection that has operators. Each operator has a name "add", "remove" and a action "onAdd" etc. Maybe it's best to make an operator interface that has a name and action method and then inject or instantiate that into the events type/class. Then we need not worry about the names 🤔 Cool example tho.
@DemiGoodUA
2 ай бұрын
It looks like an anti-pattern in typing. You are writing code in types. Types should describe the data, not the process of acquiring it. Use “if” and generalization in code, not in types.
@Typed-Rocks
2 ай бұрын
But then we cant make our code typesafe that easy. We would need to check if every „on“ method exists and there would be no way in adding things like auto completion
@DemiGoodUA
2 ай бұрын
@@Typed-Rocks You just need to maintain the OnEvents type manually. This can be a bit annoying, but your types will be simple and clear. Also, in your case, adding a move property to the Event will force you to implement an onEvent method, but you may not need that
@Typed-Rocks
2 ай бұрын
If its optional then you could make the mapped typed with a „?“. For me personally I would rather have the type generated and dont have to change types everywhere when I change the basetype. But it depends on the taste :)
@pierwszywolnynick
Ай бұрын
Please don't ever do this in real code. You can add "satisfies" and this magic after but keep types simple, so no one needs to spend more than 5 seconds looking at them
Пікірлер: 41