Or maybe you’ve had a quick dip into it, but the merit isn’t immediately obvious.
Or perhaps your colleague hasn’t stopped talking about it for the past two years, and you’re keen to hear what all the hype’s about.
Personally speaking, I’ve experienced all three of the above — and when I was first digging in to TypeScript, I found it quite difficult to find all the answers I needed as a beginner/hobbyist in one place.
I’m hoping that this article can:
- Explain why you should bother learning TypeScript
- Show you the advantages of why I think TypeScript’s fantastic
Why bother with TypeScript?
Did you spot it? It’s a fairly common mistake — our function multiply multiplies a passed number by two…but we’ve gone and passed it a string.
We can’t multiply a string!
Now, imagine if we passed myNumber to another function, with the intention of it to be used as a number. In the best case scenario, we’ll be backtracking to find this not-so-obvious bug, and in the worst, our code is pushed live, and causes unexpected behaviour to our users!
And this right here is one of the main reasons TypeScript was created. TypeScript catches these problems before they reach runtime, and instead, are caught at compile time (I’ll get into what that means in just a minute…)
Okay, I’m intrigued. Show me some examples!
Example 1: Adding two numbers together
Example 2: Getting the first letter of a word
I’ll explain in a bit more detail in just a minute, but first, here’s a more complex example:
Example 3: Create a new object, then access a value on it
It’s what you already know, just with some extra bits and pieces that will make your development life so much easier in the long run.
I have a free Introduction to TypeScript video course available over on my YouTube channel!
Alright, back to the article…
The thing is, we could write TypeScript files to our heart’s content; but not a single web browser out there could understand it right now.
This is where the TypeScript compiler comes in.
Once we’re ready to ship our TypeScript code, we can run the TypeScript compiler on our .ts file(s), with a command like so:
tsc -w ./index.ts — outFile ./index.js
What’s more, the compiler has another feature. It’ll also tell us when we write bugs in our code, and even let us know how to fix it…
Uncovering bugs early
…and let’s write out what it would look like in TypeScript…
Now, let’s see what happens when we try to compile our TypeScript code above with the TypeScript compiler, as we learned in the previous section…
tsc ./index.ts — outFile ./index.js
TypeScript created our index.js file, but it tells us there’s something wrong with our code. It’s explicitly telling us that we can’t pass a string to a function which requires our value argument to be a number…so let’s fix that bug!
Now, when we run it once again…
Hey, look! No errors!
We can now deploy our index.js file to wherever we want with the confidence that we don’t have any type errors in our codebase.
This is the tip of the iceberg. Not even the tip — it’s almost like an ice-cube balanced on top of an iceberg. If you’re excited by this, then I promise you that there’s much more to be excited by with TypeScript. It’s insanely convenient and helpful, but also ridiculously powerful.
That’s all for this introduction — but I’ll be posting more articles about TypeScript in the coming weeks.
In the meantime, if you’re interested in learning more TypeScript — my Introduction to TypeScript video course is being uploaded to my YouTube channel over the next few months (new parts every Wednesday!). It’s got basically everything I’ve mentioned here stuffed into the first two videos — and there’s sixteen videos in the entire course.
Thanks so much for reading — happy TypeScript’ing!