Stump’d Gameshow! Answering Coding Interview Questions from AI

Welcome to Syntax. We've got us Stumped for you today. This is the Show where Scott and I ask each other interview questions on coding. So JavaScript, CSS, Node, TypeScript, you name it. In the past, we've done this where we find a list of interview questions and we ask each other, and we've sort of used them all. That's why we haven't done a stump in a while. However, our Lord and savior AI, Chat GPT, is here with unlimited questions To ask us, which is really cool. So we're going to ask ChatGpT to give us questions based on difficulty,

And, we'll see if the robots are going to beat us or not. Yeah. And and and to do this, I think we're We're gonna be trying to I I was saying we're gonna season chat GPT a little bit to to let it make sure that it's giving us the the right type of questions for the types of things that we're gonna be, wanting to have in this. And so I think that, like, a good way to start this episode would be even, like, talking about The seasoning that we're using to prime the pump so that Chegg Epti's questions are are good enough. So I I've been thinking a little bit about this where I think I wanted to, like I wanted to know that we're playing a game show, and I wanted to know that it's based on interview questions. So I just said we're playing we'll be playing a game show asking JavaScript, HTML, CSS, and TypeScript interview questions.

I'd like you to give A unique question for us to answer along with an answer.

So are you looking at the prompt I wrote? No. I was just coming up with that in my head. Okay. So,

yeah, that's pretty much exactly not exactly, but pretty close to what I had asked it. So this morning I was going back and forth and looking at the questions, and initially the questions were very good, and then the questions were too easy.

So I wrote this prompt and I think it works pretty well. I said, you are a game show host that ask web development interview style questions in order to try and Stump the hosts.

That is always a good thing to do in AI world is you tell it what it is. That's the system input that we talked about on the last one. This is you will ask questions on difficulty levels, intermediate expert in obtuse knowledge. So I had to leave off the beginner ones because they were They were so simple, you know, like it's not. So obtuse knowledge, yeah.

I think obtuse knowledge would be fun. We'll see. We'll see if they're good or not. You will ask questions on the topic HTML, CSS, JavaScript, TypeScript, Node. Js, Deno, React, Svelte, and GraphQL. You'll also ask questions on the categories, Syntax data types, functions, arrays, loops, conditionals, and more. Each time give us the difficulty level. This is also saying I've learned from this prompt. Yeah. Is you you have to tell it what the output looks like. Totally. Each time give us a difficulty level, the category, the question and the answer. Give us 1 question at a time. That's another thing I've learned is that it will just dump a whole bunch of data at you.

I was trying to I was trying to make it make me a workout Plan for lifting weights. Oh, that's cool. Yeah. I said, you're a personal trainer.

You are going to ask me questions about my goals, equipment available, time And, etc. Ask me 1 question at a time because it was just giving me a list of 40 questions.

So it's kind of like it goes back and forth. Okay, What are your goals? And then Mhmm. What do you have available to it? And it's like a conversation. Right? Like, I get it. It's chat. But Yeah. If you ask it to do 1 at a Time. It's much more manageable. Yeah. It's so funny. We were just using it to do, like, a couple things. We were we were asking it about, like, Vacations and in,

itineraries for those vacations. We're saying, here's the hotel we're staying at. Here's how many days. Here's the things that we would like to do. We would like a Yeah. 6 day itinerary, but we want this many days of beach days and this and you do have to, like, really work that out. But I always love to tell it to cite its sources, Oh. Doing, like, can you please cite, you know, what your where where you've pulled this from? So, yeah, it's It's really interesting.

Courtney and I Courtney never used it. And I was like, hey. Did you know you can use this for trip planning or House planning or different types of things, and here's how we can we can work with it. So we were just doing a little bit of joint exploration. That's a great way to explain it because my wife Was I've been trying to explain it all to her, and she's like, what

is AI? Like and, like, what does it where does it come? And I was just like, I can't explain.

Like, obviously, I can't explain it to you, but it's easier if I just show you. So for another example she had was we have our daughter's birthday, and she wrote an email to all the parents about the thing. And, she has a problem not necessarily a problem, but you know how Sometimes you'll ask me to proofread an email to make it Oh, yeah. Nice Oh, yeah. Or, like, fun.

So Courtney has a she she's a technical writer. Right? So Yeah. She's extremely talented at writing, but sometimes I read her emails, and I'm just like, Corey, you gotta, like, you gotta make this flowery. You gotta, like, put some niceties in here. People are gonna read this and think you're, like, really impressive towards it. This is, like, perfect for her to to say, hey. Make this, like, 2 degrees nicer, please. Exactly. That's what I did. I said I took my wife's email and I pasted it, and I said, make this more exciting.

And they did it, and I said, that's too exciting. Tone it down a little bit. And it popped out another one, and I copy paste it. Sent it to my wife. She's like, man, you're good. And I said that was done with AI. I did not do that. I understand

what this can do, and I showed her exactly what I did. So kind of fun. Yeah. That is fun. Yeah. Alright. Totally unrelated, but I had a kind of an interesting story about my weekend if you wanted to hear it. I wanna hear it. Yes.

I I was on the mountain. I was snowboarding. I took the kids up to go snowboarding because this is their spring break, and they they were they were doing ski lessons. And I I was boarding all and I I usually have my pods in my pocket.

And I I have them in this front breast pocket, and they I've always skied with them in there, snowboarded in them, and I was Throw in some some big time spins this weekend. I I discovered that I can throw a 540 and not get hurt. Once I discovered I could do it, I was okay. So to put this into context, I'm not a pro boarder. I landed my 1st 3 60 clean After boarding since I was 16 I've been born since I was 16. I'm 37. I landed my 1st three sixty a couple of weeks ago, and I landed it clean. Very first one I ever threw. I landed it clean and rode away. So I was like, oh, I can just do this? And then so I I started saying, like, well, what if I just throw a little bit harder? And the first one was really close. So then I spent, like, the whole day just throwing 5 forties, and I landed a bunch of them. And I I couldn't believe it. I was like, I somebody should have told me this was not this scary. I I should have been doing this a long time ago.

But I I get to the bottom of the hill on my last run. We're about to pick Landon up. We got 15 minutes till his lesson's done, and I noticed on my phone that my AirPods case is listed as being on the mount. Oh, man. And this is Keystone, man. It's a it's not like the biggest mountain in Colorado, but it's a it's a big rocky mountain. It's it's huge mountain. The runs are several miles long. That's how, you know, big this mountain is. So I'm like, I'm a I'd already taken off all my gear. I I have no snow pants on. I I'm just, like, wearing shoes, and I'm like, I have 15 minutes. Can I go look for these things? I have find my my my AirPods in.

So wearing sweatpants, I just threw my boots back on, and I'm, like, not dry. It's it's it's, like, 8 degrees out. I'm wearing sweatpants on the mountain, and I took the chairlift up. I'm freezing.

And I get within 14 feet.

Okay. I I I use find my my my AirPods And I get to the little arrow, the spinning arrow, and it says 14 feet this direction. I start walking towards it. Battery on my phone dies.

And guess what? White AirPods in the snow, I looked for 10 minutes. I'm freezing my butt off because it just wearing sweatpants out there. I had to give up, man. I had to give up. I was so close.

Oodle.

A few people on Instagram saw my Photo of the thing, and they're like, you gotta tell the story about how you lost this. So Oh. They are gone forever. They're on the mountain, and I feel really bad about it because I I was so close. If I think if I would not have gotten that close, I wouldn't have felt bad about it. It would just be like, oh, well. But, like, the fact that I was 14 feet away and I knew the direction that I should have been going, Like, how could I not find them? I looked everywhere.

So I'm curious if when all the snow melts Like I've seen TikToks of people who run hills and they go pick up all the like vapes and like rum bottles that people drop off the lifts.

I guess it's it wasn't under the lifts, though. I'm curious No. If It was on to anyone to try to find them. That was a whole another I'm I'm standing on top of a big jump that people are wanting to go off of, so it's like I can't stand up here for too long because everyone's gonna be like, get off the jump, man. Yeah.

I took my board off. I'm walking around. So are you gonna get a are you gonna buy a new case? I know that the exact same day this happened to you, I also Bought a third party case for a set of AirPods that I had that didn't have a case.

I went to Apple, and, they told me it'd be $90, and I coughed up $90 to the beneficial case.

Yeah. Just bite and chew. Bite and chew. I was so I was so grumpy about it. That sucks.

Alright. Let's get into the 1st question here.

I got this one from you. By the way, I am using Raycast AI beta, which is using chat gpt 3 point whatever turbo, 3.5 turbo, I believe. And Scott is using the paid version of chat gpt, which is 4. So I'm curious if your your questions will be any different. Yeah. Yeah.

So first question from the robot overlords, difficulty level intermediate category, loops.

Question, what is the difference Between a for loop and a while loop in JavaScript.

Oh, okay. A a well, a for loop is is going to go essentially from, Like, from 1, starting point to an ending point. And without you breaking out of that, it's just going to completely it's going to complete. It's gonna run till completion, where a while loop is going to run until a specific case has been hit. And when that case has been hit, Then it will break out and end the loop. So while loop is a little bit less determinant about how long it's going to run. Now granted you can do a while loop where it's like While x is greater than 5 and then x plus plus but at that point, you might as well be using a for loop. While loops are really easy to end up in an infinite loop scenario as well. So, I I usually opt for a for loop,

mostly when I'm doing determined amount of loops. You did it, like, exactly How it says, like, the word like, the known number of iterations Yeah. Herman. Good. Nailed it. Look at me. Alright.

Spot 1, robots 0. Yeah.

Okay. Difficulty level intermediate category, CSS.

Topic, syntax.

Question.

What is the difference between m and rem units in CSS? When would you use each of them? Oh,

that's a pretty good one. Alright. So, M's and REM's are based Are a multiplier value that is based on a value that has been set elsewhere.

So A a 2 m based on 10 pixels would be 20 pixels calculated out and a 2 rem based on 10 pixels would also be 20 pixels.

The difference is, is that, REMS are based on the root of your document, whereas M's are based on the parent size. So if you were, you can get into trouble with M's.

Em's are really nice when you want everything to scale up proportionately to the component. So you could put a font size on your component And everything in that component will be relational to that font size. That's really nice. However, REMS, if you want the whole thing to be document wide or route wide, Then you can scale it based on that. So most people now use REMS, but Ems definitely still have their use case as well. However, If you do use m's, probably

should reach for a CSS variable and calc instead. Yeah. Be careful with them. So do you think that I mean, you're obviously, your answer is correct because, Yeah. We're we're very good at this. Hey. GPT says the m unit is relative to the font size of its closest or nearest parent element With a set font size while RemUnit is relative to the root elements font size, usually the HTML element. I'm wondering, Does r does the r in REM stand for root or does it stand for okay. I didn't know that. Root. That's something I never I never thought about. I don't know why. It would be perfect. Relative. Well, maybe it's relative. Relative to the document? I I I don't know. Yeah. I've never ever been like, oh, I wonder what the r in REM stands for, which I guess I should have. Yeah. Yeah. Root m. Sure. Here's an expert level question on the topic of Node. Js and asynchronous programming

Difficulty level expert category functions.

What is the difference between a callback function and a Promise in Node. Js. Oh, that's not expert. Yeah. That's not expert, but I'll answer it anyways because I'm a gentleman here. Okay. So,

a callback Function is simply just a function that is run inside of another function when that function's tasks have been complete. At the end of the function, that function is run, and then you can pass in your own function as a parameter into that callback. So, therefore, your function is run at the end of the function that's been called. And, usually, within a callback, parameters within that function have been passed into the callback function.

A promise is like you're resolving a promise to, do something when something has been complete. So instead of the callback function running when the function is complete, we're waiting for the results of the function to be complete and then accepting the results as they're returned from the function. So, basically, instead Instead of calling a function when that function has completed to get the results, what we're doing is we're saying, hey, when this function has completed, Then do this thing, whether it is the using a dot then to do the promise or using a single wait to wait For the function to have completed. Beautiful.

Yeah. Should I should I tell chat gpt that that one wasn't expert? I think you should. That question was not expert.

Yeah. That was not expert.

I I I told Chat g p t. Perfect. May I have another? And it did.

This one is also, x difficulty level expert.

So we're gonna see if this one is an expert level as category of JavaScript, and the topic is also functions.

In JavaScript, What's the difference between a function declaration, a function expression, and an arrow function, and how Do they affect the concept of hoisting? Which is I think this is kind of an expert because the the initial part might not be expert, but The hoisting part seems like it's a it's a little spicy.

Oh, that I like this is a great question. Okay. So function definition or a function declaration,

Expression, arrow function.

So we have 3 different types of functions and how they set Function expression And an arrow function. Also, post the question into the show notes too without the answer. A function definition or a function declaration,

is when you use the keyword function and you give it a name, open, close your parenthesis, any arguments, and then open and close the the block.

A function expression is when you stick a you can still declare a function like I just said. However, you stick it into a variable So that you can it is a bit portable and you can do that in JavaScript because of this thing called Java functions are first class citizens, meaning that functions can be Stored and passed around just like any other piece of any other piece of data or variable in the programming language.

The third one is an arrow function which must be stuck in a variable or directly passed Has it? And that is often referred to as an anonymous function. That's not the question. I'll stay out of that. Yeah. So the question was, how does it affect hoisting? Function definitions are hoisted to the top of your document, Meaning that you're able to call a function before it is defined. And it's kind of That's called hoisted. It hoist them up to the top of the document before JavaScript runs it. And that's kind of nice because sometimes you like to write some code Where if you open up the file, you see what it does, like how you're using it and then below how it how it does it Is below the the function definitions are below it. So and then

the other 2, arrow functions and function expressions, are not hoisted. Yeah. I think that is a lovely explanation. There there was some, nuance in there where it talked about arrow functions, that you didn't hit, but, you know, I think you you answered the question perfectly where it was just the only thing that it didn't say oh, this is actually kind of a funny thing too. 1, it had a the very first, code example that it gave, it was just a straight up function definition, but it said it was c sharp for some reason. I couldn't tell you why. C sharp copy code. Yeah. I don't I don't know why every the other 2 came out as JavaScript, so, a fail there, robots. But it did say about the fat arrow that, some points that you left out that you know, that's fine. You had a big answer. It did. You you asked about hoisting. It didn't ask about scope or anything. Truth. I hear you. Yeah. We're just saying, the fat arrow does not have its own this Arguments, super, or new target bindings. That's the only little bit, but, again, I I didn't explicitly ask for that. The question didn't explicitly ask for that as well. Alright. I said, Give me another one that is obtuse.

Sure. Here's an obtuse level question on the topic of GraphQL category, Syntax.

Okay.

Okay.

Oh, man. I don't think I would be able to get this one. Question. How do you define a scalar type in GraphQL?

Oh, it's it's a scalar type.

Oh, For a scalar type, you first need to define the type in a GraphQL file. So you define a a scalar.

You give it a name. What maybe can you describe what is a scalar type first?

Yeah. For some reason, my brain first went to fragments, but a scalar InGraphQL is basically a nonstandard type in GraphQL.

GraphQL, at its core, can validate types as the API, right, when the data's coming back and forth.

And it has a set of built in types to it, but there's a Whole subset of other types that aren't built into GraphQL, things like date. Believe it or not, there's no date type that's into, GraphQL by default. So, you would need to define your own scalar, and you could define your own scalar as being a date type.

And so you would first need to Declare scalar date to say, hey. Here's a scalar and its name is date, usually with a capital letter, capital d, date. This is the type. Then you can then use that type within your API type definitions to say, current date is equal to type of date, The same way you would string or whatever in GraphQL.

However, you also need in your It's not your resolvers. It might be in your resolvers.

I've only read the you you're hearing me say date because it's the only type I've ever written by hand. In fact, Usually, when I use scalars, there's a guild plug in that just imports all of the non typical scalars that you might have, like an email or whatever type.

So I don't write these by hand very often.

And I'm going to fur I'm going to blank on the functions. But, basically, you have, like, an input in an output type of function that parse the value so that way that You know, it's coming in as a string and exiting as a string.

That way, you can can transform that value into a date the way through. But I don't know what those those names of those functions are Parse values

Parse value, parse literal, and serialize?

Yes. Those are the ones. I can picture them. I can see all 3 of them in my code base, but I cannot Read them. They're just blurry. You know,

you said pretty much everything in the GPT response. And then I pulled up the docs for scalars and you were just, like,

Saying it as I was reading through the doc. It's amazing. Oh, cool. You nailed that one. I mean, I taught a I taught a course on GraphQL. So I feel like I know this stuff pretty well. But, you know, again, With that syntaxes is not something you write a whole lot. No.

No. That's good. Especially for like even something like GATE. There's often

Like a plug in for it or someone's written. I I replied to chat g p t, and I said, give me something obscure.

And this says difficulty level obtuse Topic or category Deno.

Topic flags.

You know what I like about this, Wes, is that we're getting GraphQL.

We're getting Deno. We're getting, like, Not just straight up JavaScript and CSS questions. So this question is about Deno, and it says, in Deno, the hyphen hyphen unstable flag is often used to enable access to the experimental APIs or features. Can you provide an example of an experimental API that requires the They will flag and explain its purpose.

Oh. So this will be interesting. Although because Deno or this has an answer to it, and it very well might not be your actual answer. So I'll have to pop open the Dino docs for this one.

Unstable.

Okay.

Well, for a while, it was npm, imports, but that now is no longer stable. I'm curious if ChatGPT

knows that. I know. I'm I'm thousand one. That as well. There there's a lot of unstable ones, so I'm like, I have the docs up, and there's a ton of them. Oh my god.

I'm trying to think if there's any of them that will be,

oh, there's there's one that, Yeah. There's one that's obvious. Oh, what's the new data API? What's that new data API that's gonna replace it? The, not I. Starts with the I.

Not intl.

Temporal API. I was gonna say it does not start with a lot. Is it temporal API? Okay. I I am stumped. I was gonna either say Web Workers. Mhmm.

Something with WASM or the temporal API. Okay. Well, temporal doesn't pop up in their docs. So, You know, there is a lot of WebAssembly ones. So Deno Cast, Deo Const, Native Struct, Pointer, Deno Deno brand, those are all WebAssembly APIs. They're all unstable.

So that's a that's a good guess. Fetch is unstable in Deno.

What? The whole thing is built on fetch. Yeah. That that actually doesn't make any sense. It says okay.

Okay. So maybe not fetch as a whole. Let's see.

DOM APIs, console and debugging. Where is Oh, DOM APIs is a good one. Yeah. But that those aren't unstable.

The fetch API has several unstable parts of it. Basic auth, create HTTP, HTTP client, proxy.

It does say fetch As a whole is unstable, but I don't that doesn't make any sense to me because, like you said, the whole thing is based on fetch. But this is I'm I'm looking at the Deno docs themselves, So I I don't necessarily know it's unstable about it. Probably just that not every single aspect of it is stable. Right? Where where are you seeing the the list of unstable ones? Do they have a letter beside them? They they have it says yeah. So you have to make sure that the show unstable API box is checked, And then it says unstable as a label next to any of them. So if you check that checkbox and then open up the fetch API, little accordion, you'll see that there's, like, several several functions or methods inside of here are listed as unstable.

Any of the FFI stuff is All of FFI is unstable.

Oh, foreign function interface? Yeah. That's their answer to running like Rust Base stuff? Mhmm.

Yeah. This is a hard one. There's a lot of unstable APIs, but you really have to know Deno to get them. Wow. So that was a good one. That was Yeah. That's a good question because we honestly made us look into it, but I'm stumped. The robot overlords

caught me on that one. Here's Here's a good interesting thing. The, the Deno or the, the chat GPT says Resolve DNS is unstable. So I'm interested. Is Resolve DNS unstable currently. Let's find Resolve DNS.

You know, I used that API In Node. Js the other day. No way. Yeah. I so we I have this list of of burner email, domain names, which is like, I use them to filter out like single use emails from my email list.

And I've been maintaining the list for Like 6 or 7 years now, and it's at 60,000 domain names. It's massive.

So I wrote a node script to loop over every domain name, Look up the DNS and see, is it registered? If so, does it have MX records? Like, can it receive email? And if a lot of them were unregistered and a lot of them still had like like dead MX records. So I pruned all of those out of it, and I used I figured out there's a node API for making DNS requests.

Interesting.

So I I, I tried to chastise chat GPT, and I said, resolved DNS is not currently unstable.

And it responded with, I apologize for the outdated information as my knowledge cutoff date is September 2021.

The Deno resolve DNS API was considered experimental.

However, it's possible that the API is stabilized and is no longer required to flag. I appreciate your understanding and provide, And I'll provide another obscure question for you. So it tried to give me some lame brained excuse that it's outdated information.

Come on. So are these robot overlords going to overtake us? I don't know. They think that resolved DNS is unstable.

So.

Alright.

These are really fun. Yeah. Totally fun. Okay. Oh, I closed my chat window. I gotta prime the pump again. Hold on. You gotta season it. I gotta season it. This is not an intermediate question. What's the difference between a div and a span? Come on. We're not gonna ask that question. Oh, come on. I want that question. Sucks.

A div for those of you out there, div is block level of span as the inline. There. Bingo. Now give me something very interesting and saucy. Saucy?

Oh my gosh. That one is too complex. What is the difference between get derived state from props and component will receive props lifecycle methods? No. That's that's another one. Yeah. That's old. Another one, but based on CSS and Based on obtuse CSS Okay. Hit me. Here's an obtuse level question of the topic of CSS. What is That's too easy again. Do you mind if I I keep doing this? Because I wanna get a good one. The question was, what's the difference between position relative and absolute? Okay. I'd say that is not obtuse enough. Give me something about a CSS feature that has been released in the last year. I think I think it doesn't know obtuse because it's they're all too easy. This one was called.

What is aspect ratio? Give me That's I mean, that's that's a newer feature, and it is somewhat obtuse.

I will answer this. An aspect ratio is the ratio at which something should be displayed.

I think the concept of aspect ratio is best described as, like, your phone has an aspect ratio of typically maybe by, like, 16 by 9, and and that's, like, that's, like, for every Pixel in one direction, it goes the same like, every vertical well, whatever the fraction is of 16 by 9. You You have that that that pixel fraction. So you could think of it as you have a square that is literally 16 by 9, 16 by 9 pixels, wide and tall, and it's that rectangular shape. And you just scale that exactly up for every When you go up, you go, the same amount over so that that shape will always remain the same size. An aspect ratio allows us to define An aspect ratio for any given block level element that will then be able to maintain its shape as it grows. I'll ask you a follow-up question just out of my own brain For the sake of the users,

how if it's not supported in all the browsers that you need, which it is, how else Could you maintain aspect ratio before using this property?

Yeah. So you you can maintain aspect ratio with a Padding.

Typically, people do this with, like, a padding bottom, and you give it a percentage base. So you take that fraction, whether that is, that that you do that.

The 16 by 9, I believe, is, like, 62%, 62.5% or something. And you do padding bottom 62.5%, and that Shoves everything down the correct amount and will maintain the aspect ratio, and then you just do position relative on that. And everything inside of there, you do position absolutely inside of Inside of that dev. I like it. I used to do that, because, you know, we we, for a long time, have had cards, and our cards have always maintained an aspect ratio. So that was, like, a A really nice thing for me to, like, remove an extra div and remove Oh, yeah. CSS that I hated to just, in place, put the aspect ratio CSS in there. Definitely a feature I've wanted for a long time. Here is a, here's a fun question, Wes, for you and it's a Svelte question, so I'm not sure you're going to get it. It says, In Svelte, there are several life cycle functions that are available for controlling the behavior of components during their life cycle.

One of them is rarely used and is called before update.

Can you explain the purpose of the before Update lifecycle function in Svelte and the best use case for it. So lifecycle hook would be when

Obviously a component is being re rendered, so the before update lifecycle hook would be used to Schedule or start something

before the dom has been painted? Yeah. Yeah. What? Yeah. I one thing I don't know is what why? Like, what's an example you might wanna use that? It's called just before the component updates the DOM. The before update function is asynchronous, which means it does not block the update from occurring. So it just runs right before the DOM is gone, but it's not, does not block. The best use case for before update might be to calculate a derived value based on the components, data, props Before the DOM is updated, this can be useful if you want to ensure that the derived values are up to date when the component renders without causing additional updates. So it allows you to do something without triggering a rerender essentially.

Oh. And and they have a I'll I'll post this this code in the show notes here because I think it's useful to see. But it basically says, here we have a double count variable and allows you to calculate the value of double count, and then that value will be replaced essentially in your Script tag without causing a rerender of the whole thing. But it's it's not a sync, so you couldn't like.

You could do anything that was intensive or took time, right? Like just Quick calculations?

I would I would imagine so. Yeah. And their example is pretty basic here. Yeah. And this is again, this not something that I ever use. I think I could do a command find for this in my code base and turn up no results. So I like it. That was a good question.

Yeah. It was. Yeah. I have I have no usage of this ever. This is great because I can now I can tune this a little bit to say, give me a type Script questioner. Give me a hard one Yeah. Based on this. This is way better than looking through a repo. I like this. It's great.

Alright. Here is an expert Expert level question on the topic of TypeScript, category, data types. What is the difference between unknown and Any in TypeScript, and when should each be used? Yeah. I mean, philosophically,

I understand that unknown is like you do not know what the type is going to be.

And then any is, like, you're just saying that this has a type but the type is literally anything you want it to be. It's Fair game.

It can be anything.

I I don't know in practice, Like, really, I almost never use unknown myself.

I almost never use any either. So let's see. If a type is unknown, it means You do not know what it is. How is that different than anything? Because it's yeah. I I guess I don't I don't I don't know the practical application of that because I just don't use it very much. All right,

let's redirect people to back to the show of A show about nothing. Remember, we did a whole show. An unknown any. So the difference between unknown and any Is that unknown is saying I do not know the type, but I will check what it is before I use it.

Okay. Whereas any is literally any type can go.

And any will take off will turn off a lot of type checking, whereas unknown will make you first write a type guard or an if statement before you use it. So like I have an I have an example where it could be a number or could be a function. It could be a string.

And before you call that function Or before you add 1 to that number, you must first check that it is a number with unknown. With any, it just says, I don't know. Do whatever the hell you want. I don't care. So in general, you should probably use unknown

in most cases. Yeah. Like a fetch response. Right? You it's the response is unknown. That's interesting. Yeah. I I like, I I almost got there. I got there pretty much there. Yeah. I like that. Alright. Here's a expert level difficulty in TypeScript.

A topic is advanced types advanced types.

In TypeScript, what is the what is a mapped type And how can you use it to create a new type that makes all properties of an existing type optional?

A map type In TypeScript is where you loop over every type or every property in an existing type and create a new type of it. And I believe it's done with the square bracket Notation when creating the type and the way that you can do that is by you loop over it and then you put a little question mark On the new type, which then makes it optional. There also are a bunch of helper functions that do that, but that's what it's doing under the hood. Yeah. What about,