
Lesson Description
The "any Type & @ts-ignore" Lesson is part of the full, TypeScript: From First Steps to Professional course featured in this preview video. Here's what you'd learn in this lesson:
Anjana explains how to handle cases where TypeScript's type inference might not be helpful by using the 'any' type to allow any value, overriding type inference, and using '//@ts-ignore' comments to ignore type errors.
Transcript from the "any Type & @ts-ignore" Lesson
[00:00:00]
>> Anjana Vakil: The last thing I want to say about the compiler is that sometimes we need it to shush Sometimes, because we're humans and computers are not as smart as we are yet, sometimes TypeScript thinks it's helping, but it's just really not helping And so sometimes we want to tell TypeScript, oh my God, bro, can you just please stop helping And there are a few different ways we can do that
[00:00:35]
And one is this little fun little type that we probably have seen a lot in our type hints on our hovers, which is any, and the any type is exactly what it sounds like It is any type of value And so as far as TypeScript is concerned, we might as well not have declared a type, or actually, because TypeScript is going to use type inference, let's see what we get here
[00:01:13]
OK If I have a type called not helpful, and I initialize it with a value called whatever, or a value of string whatever, TypeScript is going to try to guess what the type was that I wanted this to be And it's saying, OK, well, you started out with a string value, so I'm going to infer that you want this variable to always hold strings But if I really want a truly JavaScript variable that can take any value that I want, I can override that by passing any
[00:01:55]
And now TypeScript's like, I don't know, so I'm not going to squiggle any time And that means that errors like this are now going to pop up in my runtime code because I told TypeScript not to stop me from doing them So what's happening here is I had not helpful with a string, and then it would make sense to call to uppercase on a string, but at some point, somewhere along the way, it became a number, and there is no such thing as number to uppercase, so we get runtime errors
[00:02:33]
And you might have noticed also that before we added types to our TypeScript file, when you're hovering over function variables, you'll see a lot of these any Let me see if I can find one here that's typed These are all typed Let's go back to something that's not So if I don't tell TypeScript anything about, let's say a function input, TypeScript doesn't know
[00:03:06]
It can't figure out what kind of thing this function might take yet And so it tells me, hey, for now, I really have no idea what type of thing you're working with, but maybe later if you use it in a more obvious way as a particular type of value, I'll be able to figure something out And so there's actually a compiler option that you might have seen that says no implicit any is an option that we can pass where we want TypeScript to complain if I don't declare a type on a function parameter or some other value where it's not sure what it's going to be
[00:03:56]
By default, the compiler is OK with that It's like, OK, you told me that this can just be whatever, so I'm just going to not care about it But we can tweak this setting to be like, hey TypeScript, I want you to tell me if I forgot to type my function declarations Do not allow these implicit any types which you are guessing through my code However, if you do want TypeScript to really shush about you trying to replace a string with a number or an object or whatever, you can use an explicit any
[00:04:35]
And just be like, you know what, TypeScript, I do not even care with all the type inference and the type hinting and the things that you're trying to do with this variable with me right now I just don't care And there's another way to tell TypeScript not to care, or that you don't care You can put a comment with this at ts-ignore And it's like a little directive that will tell TypeScript, hey, just don't worry about what's about to happen here
[00:05:07]
It's none of your business Just let it happen I truly do not care about the type errors on this line And so I am not going to say that we aspire to be using things like explicit any types or ts-ignore However, there may be times where you're like, I know that this JavaScript code is going to work TypeScript just, I can't figure out how to type this code properly so that you will let me compile it and let my build pass and blah blah blah
[00:05:46]
So can you just shush for this one And so that's kind of tantamount to turning off TypeScript and being like, I don't want any of your types around this JavaScript code Just forget about it for now So occasionally, we might find ourselves in a position where we're just trying to ship the code and we just need to put an any for now, and then we're definitely going to remember to go back and fix that in the future, for sure, right
[00:06:17]
Totally So again, just to know that these are out there, not to just use them to solve all of your TypeScript compiler errors OK, so with that, we are off and TypeScripting, perhaps as successfully as this kitten.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops