• Saturday , 30 May 2020

Pro tip: type-check your JavaScript the easy way!

Code Canyon



Sure, TypeScript isn’t for everyone. But sometimes you want types and type-checking… well, turns out you can use the TypeScript compiler to check the types on your JavaScript – let me show you how!

More info: https://www.typescriptlang.org/docs/handbook/type-checking-javascript-files.html

Original source

3d Ocean

Related Posts

21 Comments

  1. Thomas Allmer
    July 31, 2019 at 02:55

    That is exactly what I wrote a blog post about https://dev.to/dakmor/type-safe-web-components-with-jsdoc-4icf
    I really love it and it's quite powerful to "just" have JavaScript with type safety 🙂

    what I did not found out yet is how users could use those types I am providing.
    Generally, typescript only reads typescript definition files from the node_modules folder… is there a way to automatically generate those definition files from JavaScript?

  2. Alpha Bravo
    July 31, 2019 at 02:55

    JavaScript should have optional static typing

  3. Grant Glidewell
    July 31, 2019 at 02:55

    How do you only have 7.7k(currently) subs with this polished, concise and useful content?

  4. Mark Goho
    July 31, 2019 at 02:55

    So informative! Thanks Paul. You're a fantastic educator. I'm so glad you're spending some of your free time to give back to the community like this. It really helps!

  5. Georgi Minkov
    July 31, 2019 at 02:55

    How can you code on this ABYSMAL keyboard

  6. Niranjan Raju
    July 31, 2019 at 02:55

    This is good. Something new for the day. Thank you. This also makes complete sense for utilities as it also enforces the best practice is documenting the API. But I still would spend time to go to pure typescript and avoid any. Maybe because I am spoilt by Scala 😁

  7. Philip Mørch
    July 31, 2019 at 02:55

    Just use TypeScript

  8. Matan Kushner
    July 31, 2019 at 02:55

    Here's a small and easy tool to add static analysis to JavaScript projects as an alternative to using TS with flags: https://github.com/matchai/ts-quick

  9. maddada
    July 31, 2019 at 02:55

    That's helpful, however I was wondering if there was a way to set a type on variables and function parameters in the source files (like in your main.js file for example)

  10. Alberto Silva
    July 31, 2019 at 02:55

    these intro's are really why I'm here.

  11. Erwin Heitzman
    July 31, 2019 at 02:55

    Awesome comeback to the video from yesterday which I really enjoyed. Also your outro with the clap on the beat of the song was really awesome. Watched it twice haha, keep it up!

  12. Denis TRUFFAUT
    July 31, 2019 at 02:55

    background-color : france

  13. GodOfMacro
    July 31, 2019 at 02:55

    The lowered the volume on the music worked perfectly for me, thanks for that !

  14. Nicolás Parada
    July 31, 2019 at 02:55

    JavaScript type checking with VSCode is actually very nice.
    Here is another way a bet a lot of the people didn't know.
    You can define some custom types with jsdocs using @typedef then use it in other places. But you can also import these types from other files using a sort of dynamic-import like syntax, let say:
    /* @param {import("./otherfile.js").SomeType} param1
    For this to work, this "otherfile.js" needs to be a module. I do this thing where I create a types.js file with all my back-end data structures and a "export default undefined" at the bottom. This file is not going to be fetched from the network since it's only imported inside jsdocs.

  15. Yazeed Bzadough
    July 31, 2019 at 02:55

    Hi Paul, thank you! Have you tried Elm? Would love to hear your thoughts and see your fiddling with it!

  16. Samiullah Khan
    July 31, 2019 at 02:55

    I thought Paul gonna also mention that we can also just add type checking for just a specific file.
    Just add
    // @ts-check
    to the top of any javascript file
    Also tested with .vue file as well

  17. Andris Vilde
    July 31, 2019 at 02:55

    Nice tip, Paul ).
    A bit of off-topic question – Web Assembly (WASM). Will it take over Javascript someday? For example, .NET Blazor concept.

  18. suxo
    July 31, 2019 at 02:55

    Good growth Mr Lewis #OperationBeard

  19. Kayalka
    July 31, 2019 at 02:55

    Tank for the (detailled) tips Paul 🙂 !

  20. MaxArt
    July 31, 2019 at 02:55

    JSDoc is actually still the only way to add a description to your functions and variables, even TypeScript ones.
    You can actually use it in place of TypeScript types in .ts files. You can't do all the type manipulations that TypeScript allows of course, but in many cases it's enough.
    I think JSDoc is the unsung hero of all this. Not many really use it correctly, and the official docs are IMO quite lackluster…

Leave A Comment

You must be logged in to post a comment.