Transcript:
So what is TypeScript?
At a super high level TypeScript is JavaScript with static type checking. What that really means is that you no longer have to write JavaScript code purely based on faith and good guesses that the variables and objects you’re using are what you think they are.
TypeScript is going to come along side you and enforce that “hey this is a string this is a number this is you know some object with a certain felds” TypeScript is going to add those guarantees so that you can code with more confidence.
In practice you’ll find that you’ll have fewer dumb errors; If you’re working on a team, it becomes vastly easier to communicate what certain code does because they can see right there what the types are and when they go to use them TypeScript is going to tell them if they’re using them erroneously.
It is easier to communicate with your future self so that when you come back to your code it’s easier to tell how things work. You can just look and see what the types of various objects are without having to go back and actually run the program to see if the guesses you’re making about the program are actually true.
In short, the code has become much more self-documenting
If you go to the TypeScript website you’ll see Microsoft describes TypeScript as “JavaScript that scales”. What does that really mean?
What it has meant in my experience is that you can bring a team of people together or you can work on something yourself and you can build programs and applications that very large and complex and you’ll going to have much more confidence in what your building and in and how you’re managing the complexity then you would be if it was just plain JavaScript.
I can recall numerous times on plain JavaScript projects before we started using TypeScript that I would go to refactor something or move some code around or change some logic or whatever and I could never be entirely sure that I hadn’t broken something. Even if my tests pass even if in my manual testing everything was working right, I was never able to be fully confident in the changes I had made. It seems like there would always be something flew under the radar that got missed.With TypeScript that happens far far less often, in fact I’d say almost never.
TypeScript is a strict superset of JavaScript. What that means is that anything you know about JavaScript you can transfer into your knowledge of TypeScript. There are definitely new things to learn, but it’s not a whole new world that you’ll be completely lost and confused in. If you already know JavaScript, you’ll be good to go.
In a lot of cases you can take code that you’ve already written in JavaScript change the file extension from .js to .ts and everything will work, or most of it will work with maybe a few extra type annotations that you need to add in. So it’s very straightforward to get started and to jump in.
Another great thing about TypeScript is that it compiles directly to JavaScript. In practice that means that you don’t have to install any extra runtime or ship any additional library to your users in order to start using TypeScript in your application. In development, you’ll just run the TypeScript compiler and then away you go.
Since it’s just plain JavaScript you can use the same debugging tools that you’re already used to. You can also graudually introduce TypeScript into an existing JavaScript project, slowly converting files to TypeScript bit by bit as you go along.
If you’ve used other languages that compile to JavaScript, you might be used to the compiled code looking unintelligible, very much like a machine wrote it. In most caess, TypeScript is merely erasing your type annotations, so your original code remains. In cases where it does have to manipulate things, I’ve found it makes very readable choices about the code it produces.
Anothing great thing about TypeScript too is that it supports many of the new features that have been added to JavaScript in ES6 and other newer JavaScript versions. Not only that, but you can have TypeScript compile to older JavaScript versions so that you can use the latest features in TypeScript, but still support older browsers.
One thing I wanted to mention as well is that the types are in a lot of cases optional, or what you might call a gradual, or can be inferred by TypeScript. That means there’s a lot of cases where you don’t really need to tell it what the type of something is, it’ll see “hey I’m setting this variable to a string so that must be a string”, and you don’t have to do the redundant typings that you might have gotten used to if you came from a C# for a Java background, and that’s really nice.
Also, depending on the configuration flags you set and how much you use the catch-all “any” type, you can use the type checking as much or as little as you want. If you want it to be super strict and have types everywhere, you can, or if you want to write JavaScript in the more dynamic untyped way that you’re used to, you totally can.
I think TypeScript helps enforce some good habits in a few different ways. First, once you get used to the typings, it becomes very natural when writing new code to sketch out the interfaces and relationships between data before you start writing code, because you can use those right away when you start actually implementing your program, rather than just leaving them as inert comments or notes or thoughts in your head.
Second, depending on how you configure TypeScript you can make it so it’s much more strict about checking for null and undefined, which is a really good habit to get into.I’ve been guilty myself of getting lazy and thinking “well this could fail as null or undefined, but I’m just going to ignore it because it makes my code a lot simpler.” But if TypeScript is yelling at me I’m much more likely to do the proper thing and that’s really good.
Third, if you’re defining a type and it becomes hard to think about or it hard to describe a lot of times that’s been an indication to me that “hey I’m making this more complicated than it needs to be” or I’m I’m trying to do this in a way that might be clever now but it isn’t going to stand up to the test of time. I’m going to come back to this later be super confused or I’m going to have to hand this off to a co-worker and they’re going to be super confused.
Better IDE support is one thing that’s great is if you’re using something like Visual Studio Code or JetBrains WebStorm or any other IDE or Smart Text Editor with TypeScript. You get way better auto completion so you can access things or call functions and it’s going to tell you “hey this is how you call this thing” or “hey that’s an error you missed a parameter here” and that kind of thing.
If you’ve used just plain JavaScript in the past, you’ll know that IDEs can be pretty good about guessing what things might be, but there’s a lot of times where you’ll start typing a piece of code and it does the auto-completion and gives you every possible field name that I’ve defined in my project as an option. Which is massively unhelpful. With TypeScript you avoid that issue entirely, since it knows what the types of things are, you get vastly better auto completion support. Which makes you a much happier and more productive programmer.
So that’s a general overview of what TypeScript is. I hope that was helpful to you! I’ve got other videos out there on TypeScript, so if you want to learn more, please check them out!
If you visit https://typescriptbyexample.com you’ll see some info on a course that I’m building for TypeScript. You can put your email address in at the bottom of the page and you’ll be notified when that’s ready. I’d love to hear from you, and I’d love to have you be a part of the course. Thank you so much for watching! Goodbye!
Announcing: Learn TypeScript By Example