STUMP'D - Coding Interview Questions

is it something that only returns one thing?

Rid Is it I mean, this is to have to do with, like, the same inputs give the same outputs. Is that a first class function, or am I, like I I I'm, like, conflating it with something else. That's a pure function. Pure function. That's what Yeah. Yeah.

function means that in languages that have first class functions are mean that functions are treated like any other variable or any other value. So a function can be stored in a variable. A function can be passed into another function, like a callback. A function can be returned from another function. That's the kinda, that's the functional programming aspect of it. So just rid Being able to move around, pass in, of Unicode.

Now first class function, give it to me. Alright. So a first class rid the polarity

I remember talking about 1st class functions. I remember a cookie? So it's a weak it's an array of weak references?

I read the the the question, and I was like, I don't think I know this. And then I read the answer because, oh, I remember that. So Check if it is maybe if it's frozen

Yeah.

and

A first class

is

output that give me 11, which means I'm gonna ask you the first question, which is the 11th question And you

This might be fun for me to get wrong. Let's see. A 1st class function

I'm wondering if it's you know, I'm going in a couple directions if it's the it's like a functional programming thing or if it's a it's defined sort of thing. I think a 1st class function is or while we are taking off to distract myself, and it doesn't need to check-in with Wi Fi or anything like that. So if you're the type of person who likes that type of game or or type of thing, What this is is like a factory game. It's called When a set time out or set interval is reached, the corresponding callback is The language sometimes, for me personally, is somebody who has trouble with language. It can trip you up. And and that's the type of thing where if they ask you a question, you very well may know the answer, the difference between you giving them a right answer and a wrong answer is just whether or not you can articulate it, which is, I think, always interesting.

No. K. I didn't think so. That was a Shot in the dark. Do you want you want me to give you the answer? You were you were pretty close there with the functional programming.

So if you wanna create a namespace,

So I would say, you know, you'd create a class in in my experience or you would create an rid. An object that would encapsulate all of that stuff. You nailed it. Well, I mean, you did basically tell me the answer, but, yes, that Sorry. I would have gotten it, I think, because rid. I I literally just did that yesterday when I was, like, thinking about this GraphQL codegen thing. So I'm so used to working on code for my own things. And I was like, well, what if, like, What if other people wanted to use this thing and create a new client like you do with Apollo client? How do you do that? Oh, oh, you just create a class, And then you have the path and the constructor. You construct the whole thing, and then each time you want to use the methods, you say, you know, g dot fetch instead of

But, yeah, definitely useful. How I used to do it is, yeah, you'd create an object. I would always call it app. And then on that app, you would have your rid. Your data, that would look like app dot people, and then you would have your methods, app dot add person. Other ways you can do it is you can create re Iffy, which is an immediately invoked function expression.

defetch as a function. Right? So yeah. Yeah. Definitely just did this one. And,

Oh, you're not gonna like this one. Oh, yeah.

That is correct, Wes. You did it.

Something that is going to be very interesting for you, Wes. I don't know if you'll get this or not. Alright. This okay. Number 144,

how do you declare

Man. Yeah. Yeah.

These modules are scoped to that file.

What Prevent default has been one of those things that you just use all the time now.

Number 291,

Rid

are labels in JavaScript?

And what that will do is it will create a scope, and you can just put all your functions inside of that. That's kinda similar to how we do modules a GPU only cookie. Yeah. So both of those should work. Cool. Well, do you wanna cap it at that? Yeah. Yeah. That's good. That was fun. We haven't done that one in a while, so hopefully you learned a thing or two. There's Obviously, plenty more questions, so maybe we'll do another one of those in a month or two.

when the person visits your app or website. That's correct.

rid of just using like, modules have their own scope, and you don't necessarily have to worry too much about this. And it's also much more of And for your JavaScript, and then we have weak set. Yeah. That's the part. Yeah.

And then also it says you can use

you know, a name space for that, and it was just by using a A class extends object.

yeah, namespacing. It's funny. We we don't think about it. You're right. Have our our modules. We have our our our files that are all encapsulated and nicely nicely neat encapsulation there or candy.

a class based approach. But Sorry. I've said too much. I know. That's one way that you would do it if you wanted to create a name space. You would create a class. Yeah. And that's probably how I would do it because it's funny. I was talking about this GraphQL thing I created. I created, basically, a weak reference, 4? There's only 4 on a week set that are unique to a week set? Yeah. Oh, god. I have no clue. I have no clue. You know when the last time I used a week set was? When? sort of what they are.

a namespace? handles all the authentication, it's not a clean

There's a couple different ways that you could make them in JavaScript, and I'm willing to bet you don't like this one because

we can talk more about this in another episode, but I wanted to rid sort of remove the dependency that is Apollo because we weren't using most of Apollo. Right? Just like, you know, in the past with Meteor, we weren't using most of it, so might as well not use it. So with Apollo, we weren't even using Apollo's cache. We were just using it as a fetch for Svelte

It's easy. I mean, it's surprisingly easy. I I wanted to

if you may may have noticed, my audio is not as Chris Bora is clear. You may be hearing some dogs barking here or there or some noises. I am without my normal microphone,

and then using Svelte's own cache Yeah. For their their subscriptions, not their cache. So I wrote my own GraphQL plug in. Just do a quick fetcher, and then I was like, oh, I bet I could integrate this with Codegen so we will hardly have to touch a thing. And sure enough, it it works super well. And my new GraphQL fetcher is a 100 lines of code versus an entire library, In an event loop, I was too this is asking, what are tasks an event loop. Oh. What is some predictability

my normal setup. In general, we are just T minus a couple days here till the move, so all my stuff is in boxes. It's all over the place. So this will be officially the last episode ever recorded in The current level up studios before we move into the new level up studios of which, the name I think is probably gonna be the level up lodge courtesy of Wes

GraphQL code generator plug in for myself. Oh. And let me tell you, dude, is not necessarily like a Yeah. A technique or something, so to say. I for some reason, I was thinking it was like a technique, and I don't know why it was there. But, yeah, in this context, makes a lot more sense

JavaScript Session replay and Auth0.

Nice little name exploration for me. But, yeah, I'm doing good. Yeah. You know, I I spent all weekend working on a, this is actually, like, Kind of related to coding stuff, I spent all weekend working on a,

Every time we do one of these stumped episodes, we go and We go to these, like, interview question GitHub repos. There's there's a bunch of them out there. Today, we are grabbing them from that a DOM element was clicked. So if you have a DOM element, that's an object. And if you wanna track how many times that element has been clicked, you have a couple options. You could just put a property on the DOM element rid And increment it every single time. But you could also create, like, a totally separate dictionary

Sick. Yeah. That's my kind of refactor.

and then split it on equals,

We do the last sponsor and then a couple more? Yeah. This is a perfect way to,

If you would have Googled that error at some point, why can't I get search params in React Router? I'll use this. Yeah. URLs are trends. Assign it seems so easy. Just rid Split it on ampersand

Alright. I gotta I'm gonna get a brain buster for you. This is 343.

for For a long time, that was, like, something people were wondering about in React Router. Why doesn't React Router have this? Why, like, why can't I get the search params Yeah. The query string values from React Router? Should we move on to some sick pics? Yeah. You know, that was a lot of fun, Wes. I'm I'm glad we did that. So, Yeah. Let's get into sick picks here. Do you have anything off the jump that you wanna you wanna sick pick? Or of two numbers,

leave my my current office even though I don't have a good mic. But, with JavaScript, it's a little bit different because you do

dot sum?

you do a new URL,

syntax.

No. No. No. No. It's not new URL. It's URL search params.

Thank you, auththezero, for sponsoring.

And their answer is always, it's in the browser. It's use use it's in the browser. Just use the browser's thing and just pass it in. And, you know, it would be nice To have that in the router sometimes, but, personally, I never had it too much of a problem using your new URL search brands. But that's definitely one that you would have encountered a dot dot dot spread

is something you can add into your application. It's a service, and it will make things like logging in with Twitter, Google, Discord ready. Super easy. You can make a customizable

and then it's just a rabbit hole of edge cases rid all the way down because sometimes there's multiple of the same ones, and that's an array of values. And sometimes there's encoded values in there that need to be decoded, and

of building an application in Auth0 they've got all kinds of features. They have biometrics. You wanna put touch ID into your app? You got it. No problem. So rid Check it out. Your next application,

authorization,

And then

So glad it's in the browser.

Rid. Yeah. And then that will then parse it out.

Alright. Let's,

also a excellent solution for authentication

I don't know what it is. As if my brain has not been busted enough already. I think you'll get this one. This is a good interview question. What is the purpose of the array method

From that, you can except it's part of the set, Then the set will automatically A map is not an array, and a map is an object. Yeah. You're right. Yeah. But You I think you got it there. The weak map is a collection of key value pairs in which the keys are weakly referenced.

Oh, Use e s m dynamic import. Yeah. I think you could use either of those, like, depending on what you need to do. Right? Like Yeah. Here's an event that happens or maybe you're visiting a page. Maybe you want this now, this JavaScript to to show up or any JavaScript code which is function.

array value array value, and it's going to

rid Trying to figure out if something is an emoji or not, and it is very complicated And you pass it the

and then a string that says West Boss. Okay. So you have an array, rid And you're spreading a string and then it is then taken out of the weak map. You don't have to worry about Taking it out. Yeah. Interesting.

0 width joiner, and if you try to spread an emoji,

Oh, I like this one.

next question here. Rid Again, I apologize for my audio. I I'm feeling very self conscious about my audio. Let's go ahead and there is a namespace keyword. How do you declare a namespace? Because we've used namespaces before in our code base. Rid I should say Not TypeScript. JavaScript does not have,

And then you can spread out the contents of the previous one with

of West Boss into it. What is the output of that? The output of that is

Because so often, we're we're just kind of left in the dark here. So LogRocket really gives you a scrubbable video replay. That's right. Scrubbable video replay to see your errors and exceptions happen.

previous object, Triple equals operator treats number dot nan as man as not equal. So interesting. I don't know when you would use this, but this seems like a rid Crazy little edge case here keys? some of the values of the old array.

comma, and then you can just define the rest of your things in your object as normal, And it will create a new object with the contents of the old one plus anything else. Now you can do the same thing with arrays where you do non weak reference, a

In that string, including spaces,

Good friends with Spread. Yep. Also good friends with one of our sponsors today, and that's Bloggeragit.

rid all of the weird edge cases of of the Unicode spec.

emoji properties into each other that, like, don't actually exist. Like, they're, like, fictionalizing emojis. I see that. Yeah. It's like, what if you had, You know, the squiggly eye guy with the also sweat on the brow guy or something, and it's very funny. I'm, like, always cracking up with those. Alright. Next Question,

this is actually a good related question.

A spread operator

Slam dunk, Scott. You nailed it. Oh, yeah. Me and, me and Spread are good friends.

If you want that all that and more, check out log rocket.comforward/syntax

Good friends.

with the weirdness,

I like how you included the spaces in there too. I have very nice attention to detail there. Yeah. Even further, if you're talking about you have to be with those because there are some characters,

the 2 moms and 2 kids, a set time out or a query selector,

Yeah. You know what? One of my favorite things, I there's also another Twitter account that, like, rid. Combines

it will spread each

What is the output of the below spread operator? So this is relating to spread and the code looks like something like this. We have array brackets,

Many emojis are made up of more than 1 characters, and they're they're stuck together with rid. These things called ZedWJ, roles, and permissions for your application. That's always a very hard part How do you load oh, never mind. I'm trying to set,

It's indicated by 3 dots. So if you ever see this in the code with 3 dots,

Okay. So Dynamic import syntax is just an import function that returns a promise after you give it a path.

A spread operator can take the contents of something

What is a spread operator?

Fine. Fine. Fine. 324.

where you'll get 14 days for free. Give it a test. It's Something that you'll really, really love. You have to see it to believe it. Very cool stuff.

add, Oh, Easy way to add authentication to your app. We'll talk about all of them partway through the episode. With me, as Always is mister Scott Talinski. How are you doing today, Scott? Hey. I'm doing good. And, This is one that it's funny. Svelte uses labels in some kind of interesting way. So rid What are labels? Are they like like, is this just a part of JavaScript? It's just a part of JavaScript. Like, this is just something that is in JavaScript that's called labels? It's called a label. Or it's a technique.

rid has So something like

sets

gosh. Is there something to get the properties? Honestly, I have no idea. How many methods are we talking about here? Well, how many are they looking rid out the contents of something.

Correct usage of weak ref takes careful thought. It's best to be avoided. So those of you out here all of a sudden, like, oh, let me use weak set and weak ref for stuff. Well, maybe just make sure you know what you're doing first, because it does say to avoid weak graphs where possible. So but it is interesting that that does exist. For those of you who are working with higher level Yeah. Is that right? Yes. It is. It's great because,

On a week set,

The importance is that a weak

On a weak set.

What is the difference between a set and a weak set? You know, it's funny. Rid I I shouldn't have done this, Wes, but I I started googling

going to give them to you.

Let's go for it.

We have set,

it actually it'll lead us into a follow-up question that I have that we can talk about, but What's the difference between

and length. Length is interestingly and parse it out rid because document dot cookie is just a string. So you have to parse it out based on the spaces and the semicolons, and then you have to remove the one that you don't want, And then you have to set

versus like we would do on in array. Now that's a tricky question. Can I give you a follow-up? That might be a bit trickier. I mean, considering I didn't get the easier one.

List Like, let's say, a form submit or a button click or a mouse drag, those are all events in JavaScript,

But I'm going to guess that the answer to that is that

garbage collection is the difference there and only being able to hold objects.

and then they are automatically

after you'd already started reading the answer. Oh, okay. So I don't know the answer to that question specifically,

I really like that the fact that We've had, like, 3 things already that we're like, oh, wow. I've never had to use that before because Alright. My next question here is this is funny. What is a weak map? Question 206.

4.

Read. Alright. I am

Never? bad Unicode or something like that. This this guy just documents

and a set is a Interesting. So I do see some notes on MDN here, which does kind of give me some support here in terms of my ability to answer this question. It says here on MDN, please avoid where possible.

out there might be a bit more fascinating than those of you who are just getting started. Yeah. But it's always good to know that these things exist.

outside of your set. And when those objects rid are cleaned up or no longer referenced in your JavaScript. They are what is called garbage collected, And you you'll get the all of the pieces or try spread, like, the black Santa. You'll see, like, the orange Santa and then the black Skin tone. And then in some cases, it just garbles up because it's it's not as as clean as that. I know. You you're one you're one to find all the emoji caveats. I think that's one of your specialties.

a week set has Oh, It will know that the object is no longer referenced in JavaScript and will be garbage collected or cleaned up from that map. Dang. Man, read. Weak. Weak. Weak. Where's that where's the soundboard? Yeah. That's just me Yeah. Me emulating the soundboard. Weak.

that's sometimes the problem with these interview questions is that, like, would you need to know that? every single letter

the methods that are available

a normal reference.

delete, no.

Oh, never.

it will return true. Interesting. Never have run across that before. Good. You stumped me. Rid Yeah. I stumped you. You stumped me. It's all it's all in the name of the game.

in in in the instance in which positive 0 and negative 0 need to be false,

So it is used for the following 4 things. It is used for comparison

dot is.

So it's like the there's an object there's a dot is try throw Auth0 into that app and have them do all the authentication. Check it out at a zero dot t o. So rid. Authzeroa0.t0forward/ Object insight into this. Like, what is the purpose of saying new error? Like, why would you create an error object?

and it is used for the comparison of 2 objects Is the last one. So Really? The 2 objects comparison. Yeah. It's really weird. So if you do object dot is and then pass in 25 comma 25, it's The equivalent of using the triple equals.

rid method static method that lives on capital o object.

because it's it's funny because I would have probably gone the same way you would have with the thinking if it was frozen or something like that. To be honest, there's actually a method called is Frozen Oh. Which is what you would use for that. So object dot is, as you might know, Wes, I know you know, everything in JavaScript is an object. Right? Oh. Object. Is is used a little bit

of an object, meaning that you can

in their treatment of signed zeros and not in numbers. For example, the triple equals operator and the double equal operator treat the number negative zero and positive zero as equal.

MDN says, this is not the same as the double equals. This is also not the same as the triple equals. Rid The difference is that object is in triple equals

equals true. It's obviously in there. So it's not If you have 2 objects that have the same properties, it will just be false because they are not the same objects. Correct. But if you have 2 of the same objects Or if 2 of the same numbers or 2 of the same strings,

can use that rid to check the status

of 2 strings.

So I'll give you a little bit more

equivalent to another rid No. I don't think that. I'm gonna say you you can use it to check if it is frozen.

rid Object

Okay. So you were closer with the thing that you said wasn't true. It's actually really interesting

or if it is

What is the purpose of using

Yes. The object's is method. What is the purpose of using for maybe something This type of game, it it's so computer programming

191.

Let me read the answer here. Okay. The object dot is? we catch those errors and display them to the actual user. Yep. Because there's a whole bunch of possible things that could happen. You don't have access to that. You're not allowed to you're allowed to read it, but not write it, things like that. Yep. Yep. Yep. Yep. Alright. This one is going to be one that you will get. I'm gonna tell you that right now. So this is a little bit of a softball here, I think this one's good for our audience, especially the people who are newer to JavaScript. So this question is, number 268, My name is Scott.

Peace.

the cookie with no value.

that I was, like, making me feel like I was, like, actually gaining programming, and and it really scratched that Refactoring it that I had while I was on the airplane. I was like, man, I gotta refactor something. I'm going nuts here. So I refactored a factory

string right now, and

JavaScript for beginners. There's all kinds of Gatsby, all kinds of really good courses there. Check it out. Westboss.comforward/courses.

that works.

You can Yeah. I would say it is the question because they don't differentiate there.

In that, we understand the basics of what the heck it is, why you would want to use it, what are the the concepts and the main ideas with the syntax.

a handy little lawn tool that I never knew that I needed, and I'm excited that I have it. Cool. I'm going to sick pick So I'm not sure what it's looking for here. I think you did a better job than the answer says. So, yes, for CSS, you just make a link tag. You make the DOM element, and then you'd you dump that into the head or something like that With append child.

Wes, I gotta tell you, man. We got some really, really talented course creators coming out with courses coming out over the next few months. So if you're interested in all of that and more, Head on over to level up tutorials.comforward/pro.

document dot cookie Monday.

Oh, yeah. Like the cookie has no value. But I think Your way probably works. I don't know. I almost always set cookies via JavaScript library, so that's a great question.

I'm just trying to set document dot cookie to be an empty

A video game

I recently learned as I'm getting into lawn care that my rid Lawnmower blades were duller than a butter knife. Oh, man. I bet mine are too. Yeah. I had never thought about it until I was like I was like, why does the lawn get And the values can be anything.

But, again, it's It's a programming and automation game. I just found it to be really, really interesting, especially to to really scratch that programming itch I had. So, Yeah. Check it out. I it does I don't know if it is for Android or let me check this out. But, yeah, it it's a really fun game. I had a good time playing it. So, yes, in before iOS only or what. So it looks like this person just built it on iOS. I'm sorry, Android people. But, again, it doesn't need online requirements or anything like that, so it's pretty cool there.

Where

and I really enjoyed it. And it is one of the unfortunately, one of those things where you can

So so with that all said, former sponsor of Syntax.

Peace.

Builderment Things that I would have thought were easy outside of an interview and then put on the spot, I'll get flustered and, you know, miss the question in the interview and then kick yourself about it later. So Definitely meant to to replicate that sort of off the wall experience of an interview question, stuff you can't necessarily prepare for. Hopefully, it gives you guys some, Oh,

Alright. Thanks everybody for tuning in, And we will catch you on is cloud accounting,

to the new updated string. What if you want to delete it? The purpose of it the purpose is to Like, what does it do? Yeah. Yeah. It's to create a new array. That's Part of it. Right? So it creates a new array with

for a Full archive of all of our shows. And don't forget to subscribe in your podcast player or drop a review if you like this show.

I am going to sick pick Another piece of lawn care equipment. Oh.

you you mine this and you mine that, you put them on conveyor belts, and then you put them into a factory that creates a a block of rid Iron, and then you use that block of iron to create

So, like, if the cookie was, like, cookie name, it would be cookie name equals and then semicolon.

Meaning it does not have HTTP only set on it.

You can get yourself

Pyramid where you put your blade on there, and it will balance. And you can tell if it's if one side needs to be ground down a little bit more or not. So Alright. Here we go. Next question is, what is the purpose of the error object? We were tracking is that you can use

Trying to figure out how to sharpen them myself because our our lawnmower has 6 blades, I believe. 6? Yeah. There's 3 on a weak set. Oh, gosh.

if it is a client side cookie,

And it's a factory building and automation game, which I had never even heard of this type of genre, but maybe it's a thing that I'm not in into.

iron wire, and then you use that to create something else until you eventually have this, like, intricate, and spread it into whatever you are attempting ready. So let's give an let's give an example here, a couple of them. So first one might be, you want to create a new object.

wire I know that's probably the answer, but it's, like, such a non answer. Yeah. You just use the name to describe what it does. But that is the literal answer is that one deals with weak refs And one deals with normal graphs. So I guess the answer is, like, what is the difference there?

And, Yeah.

they specify

This app is

rid com forward slash courses. Learn some React,

Head on over to syntax.fm Is used for the comparing

But as a computer programmer, I found it to be even more interesting because it allowed me to, like, think about systems and creating systems, and It didn't feel like programming. It felt like I was kind of playing a game. So it's called Builderment,

Yeah. I'm wondering Yeah. That makes perfect sense. I don't know that I would've would've got that once. That would that's a pretty tricky one, I think. Yeah. What it it's a it's an explanation of something that, like, JavaScript

And then the course that's coming out For September, its release date is August 31st, is web components 101 meant for anybody who has no experience with web components. We don't use any libraries. We don't use any build tool. We just straight up use JavaScript and HTML to write real web components.

Shameless plugs. Westbostdot

You have to take document dot cookie will test an array You can even take e s six. You can learn all about maps, sets, weak maps, and all that good stuff. Rid You can use a coupon code syntax for an extra $10 off. Sick. I'm going to shamelessly plug level up tutorials.com.

A blade balancer. So it doesn't look like removed from that weak set. So if you've got an object

it's my kind of game. I discovered it on an airplane because I really needed to have something to play on the airplane, It's the perfect place to see all of your errors and exceptions happen. Rid Let's say you tried to spread something you couldn't spread. Well, that might give you an error. Maybe you're spreading something in a old version of JavaScript that's not being re formed or an old browser or something. Maybe that's gonna give you an error too. And it might be nice to see that with your error logs. And maybe even the browser one is a good one. Right? You're trying to use some read bread syntax without compiling it. You have a user firing this thing up on IE 11. Well, this is going to pop up and and say you have an error, and it's going to show you The browser is gonna tell you, the console log, and you can see exactly what happened and why your code didn't work. It's really unbelievable in my new office, Wes, I'm gonna be getting a whole new set of keys, and I'm gonna authenticate myself in to that new office and and to install myself. Yeah. Do you wanna, talk about our next sponsor, which is Auth0, Yeah.

Use syntax in the how did you hear about us. That's gonna get you a 30 day unrestricted free trial With no credit card required. Thank you, FreshBooks, for sponsoring.

meaning that you run a small business. You're a freelancer. You're just throwing out a couple invoices, or you are running a massive

For example, the code below with labels avoids printing the numbers when they are the same. So Sorry. I just read the the example code part, but basically, it the syntax is

Do you wanna do you wanna get have the answer to your Yeah. Let me let me let me guess. Let me guess. Hold on.

the way they have it is they have a, like, a a for loop. And so they would say loop 1,

re company. You need to send out invoices. You need to collect the money. You need to track your time. You need to track all of your expenses. You need to turn those expenses into

I do. FreshBooks

No. Not a property.

Rid I have only seen it not in real practice before. I've only seen it as like, hey, this thing exists. So I've I've not actually used this before. I've never seen it in real code, definitely a good one to at least have on your your mind as it's a thing.

are we posting these in the the show notes? Maybe we should be doing that as we go. I say because I have, I have some the MDN links for this. If not, you could just look up label on MDN. That actually has a much more concise way of looking at this. Re But label statement can be used with break or continue statements. So it's a way to, like, name your loops, a weak ref and a ref? So that's the difference, I think, is that a weak set

a way So these are just, like, questions like,

Alright. I've got another question for you here.

describe rid Node. Js in the past as well. And then we try to stumble through them, and it's often hilarious because I think you got it mixed up.

Invoices for your clients. That's exactly what FreshBooks is for. Makes everything so simple, and you can get back to actually doing, rid. Like, working on your business then versus working in your business mean that you go back to coding and and building stuff rather than fussing with rid Invoices. So check it out. Freshbooks.comforward/syntax.

Wow. That's that's like another one for, like, syntax highlighters. That's a syntax questions.

I've never seen either. That's cool. Yeah. That's super interesting.

to There's a whole Twitter account

Before we get into this next one, that was a a fresh new part of JavaScript that neither of us I've never seen that some fresh pow pow for us to to shred up. And so, we also have one of our sponsors today is pretty fresh. I'm talking about FreshBooks. Wes, do you wanna talk about them FreshBooks?

Oh, man. I don't know. I never heard of that. Yeah. I hadn't heard of it until somewhat recently.

you know, like, a set interval and a clear interval. You they return you an actual value, and you can use that to clear it. This is a way to name your loops, and then you can then break or continue them When you are nested. Oh, man. That's cool. That that's this is a good good repo. I've literally never seen that before.

to describe what a function does. That's not Right. But I'm that's what I'm throwing out there. It's not far off. A label statement allows us to name loops and blocks in JavaScript.

A label in JavaScript

It's a label statement.

colon, and then the for loop, and then loop 2, colon, and then another for loop. Oh. And then they use this syntax It says continue loop 1. This might not be something you've ever heard. I I will

And then you can call those Or any blocks. Yeah. Loops. It's similar to, like, Scott to s, and everywhere Scott was, Rid So I would say it is a client side cookie. Okay.

It's a a keyword

We can then use these labels to refer back to code later.

what rid Is oh, I'm sorry. I'm sorry. This is the question number 269.

And number 269 And I'll type and everything. We're not gonna have to, like, even think about it. It's gonna be fantastic.

it'll try and make it as small as possible. So it will take out unused rid bases from your JavaScript. It will rename variables like and capture functions as a value like you would a string, a number, or a Boolean.

bundle of code at the end of the day. Yeah. That's, I mean and what's the benefit of shipping a smaller bundle of code at the end of the day? It will load faster

So it's funny because the questions are very similar.

rid of minification.

you can throw an existing error the object's is method? There are 4 answers here.

your

Some minifiers will find unused code, which can be stripped away. And the benefits of that is that you will ship a smaller

268, 269. 269, what?

anytime you throw, a little bit more interestingly than I think you might expect.

is, what are the benefits All right.

Alright. So minification is when you take

We need to keep track of a specific error. Right? Because if you're a little bit too wrapped up in it where, you know, you gotta put it down.

to track its own thing. This is error happened once. Right? Yeah. So, like, you could pass an error around without creating a new one. You can throw an error without rid creating a new one. So that's my guess. Only the only the way I've used in practice new error is always to indicate that this is in fact you are creating a new error. Rid Exactly. Nailed it. Yeah. You could you could create your own error. You do not have access to that. You do not have enough balance Builderment.

referenced. It will it will reference that. It will remove duplicates.

How about this, Wes? Sorry. Just triple preface here. You're gonna answer 268 and 269 because I think they're gonna be good for the audience and you'll get them both. Rid Number 268 is, what is minification?

rid You anytime you throw, but, like, if it's if you're not throwing a new error, you should just be throwing the current error that you're you're catching. You know what I mean? Yeah. Read. I use it in my in my advanced React course a lot because would be 1 or Man. Or not a number and number dot not a number

JavaScript that you have written And you run it through a minifier, and the minifier will, CSS and JavaScript files dynamically.

In this case, the keys must be objects, Yes. Auth 0, a method, not a property on a a set versus like a

objects as keys

in actual, week maps and week sets. And what we did, It's a property on a function.

in your map.

that is a map or a weak map, So I am going down the rabbit hole of and then

you don't also have to go to the weak map and remove it from the weak map. Because the DOM element is no longer referenced, it is garbage collected, something like that. Is that right? Yeah. I think you're you're You're listening to Syntax, the podcast with the tastiest web development treats out there. Strap yourself in and get ready. Here is Scott Talinski and Wes Bos. Welcome to Syntax. This is the podcast with the tastiest web development treats out there. Today, we've got something we haven't done for you in a while, and that is a stumped episode. This is where Scott and I will try to stump each other with read. JavaScript coding interview questions.

building apps. It's a whole another world, right, because you do get into your flow of doing rid Same stuff over and over again, and then you get exposed to this different world or these different ideas at various points.

And the map is an array has to an object.

rid Users. So this is a a a newish API,

So if you wanna store metadata about an object, you could. If you're out there and you're using of the emoji and not the actual emoji itself, which sometimes like, try spread the rid in this repo, Scott, what is a first class function?

as an example, is that So rid Spinnies, and each spinny has a x because it's like Holy cow. I think one of them mulches it, and one of them I have stopped to ready. To look into it. But that little push push more, and it just has 1 wide blade. Yeah. Yeah. We are we are a pretty serious tractor based one, rid. But then you got this blade balancer.

rid in an in a single area. And the thing about that is that if the DOM element is deleted from the page, Alright. Next question we have here.

that is important because just like the weak set, if the object goes away,

not brand spanking new, but newish where you would probably need to polyfill in in some older ones. How do you get the query string values in JavaScript?

So it's it's just like a set, but with a map.

So to trying to get each other with them. And then if we are doing too well, we'll we'll try to, handpick rid to try to stump each other. For 1st time listeners, do you wanna give an overview, like a a very brief overview?

The next question is, what are the differences between a weak map and a map? Oh god. A map can have anything as keys. Rid Yeah. Yeah. That's actually one one benefit of of using a map over an object you can pass it either window dot location or a string.

Yes. That's pretty close. A weak map is a collection of key value pairs in which the keys is I'm gonna say

But, again, that's another one of those things that I've only ever done in like, first class namespaces.

the key of the map will

week map rid. In weeks set on the regular or you're using them in any sort of, like, interesting way, please let us know because it seems to be a theme for this show. And I honestly like I said, I don't really come across that much code that uses this. So if you're using it in your day to day and you have some interesting use cases for it, I think that would be something that, some of our audience would really enjoy, and we can give you a retweet there. Just thinking back to my e s six course, e s six dot I o, use coupon code syntax for 10 plus tops, And that's where I taught

Weak.

the number of times could use that as sort of a separate metadata collection, and that's really handy because all of the metadata about all the elements that have been clicked is stored

I have a a next question for you if you are ready here. I'm ready. Believe it or not, this is one that I actually know the answer to, but I'm not sure you will because it is very kinda specific if you've had to do this or not. Yeah. But I also think this will be a good one for the

Alright.

submit, called kinda light after I cut it? And it's because it was, like, just whipping the ends of the grass off, and then the the ends of the grass would ray gray and yellow. Yeah. And that gives it a bit of a lighter look.

default.

Like Yeah. It's kinda silly. It's kind of silly. But maybe if you're interviewing at a, you know, a hotshot Company, they might expect you to know that because maybe their code uses that. And maybe that's one of those things that you've you heard it on an episode of syntax, and the next time you're in a job interview, you can say, oh, you know what? Week graph, I know what that is. I've never used it, but I did hear those, those guys talking about it on on the, on my headphones. They're coming in on the AMs AM radio. Let's go ahead and do this next one here, Wes. I'm I'm very confident you'll probably get this one, but I think it's also a good one for the audience. What is the use rid of prevent you now with ESM, you could do a dynamic import of that JavaScript as well.

rid. And those all have some default, huge repo of 425 Version, a weak set, and a weak map, they can hold only objects, so you can't put numbers and stuff in them rid or strings, and those objects must exist Oh, you're saying the updated one. So you removed it. Yeah. So you you take the string, yank that part of the string out, or use a library that will parse it And then put the string back in. I think that works. But in their answer, login page. You can integrate it with your Node, Express, React, Next. You name it. They have a SDK for your language you

It will prevent the default action. So when an event fires,

we wait for things. We fire off events in JavaScript, and we take the action accordingly.

interactivity world than we did perhaps when you were writing

Oh, I like this one.

Drag whatever is under your cursor at the time. So those are all the default. Those things are built into the browser, some base level functionality. And rid. Sometimes you want don't want that to happen because you are going to be providing Sick.

randomly pulling them and trying That's another thing you can do to make sure that it cuts nicely and doesn't rattle all out. And it's just a tiny little cheap little 294.

what is a constructor because it's a constantly evolving spec. And the the character ranges where the emojis are are not

Alright. So we have written a little code, math dot seal rid Brackets math dot random times 425

We either drop the ball huge or absolutely nail it. Usually, nowhere in between. Yeah. And it should be noted that this is without any preparation here or anything like that. It's It's meant to illustrate really just how how you can get tossed curve balls all the time in interview questions. I remember being asked some very, like, And, it's gonna be a huge, huge, huge dependency removal from our project. So I'm pretty psyched about that. That's wicked. Yeah. And since it's all cogent

which is functionality that is assumed with them. A form will automatically send the data to wherever the action is pointing to. Read. A button click will either submit the form or or clear a form or do something like that. A mouse drag will attempt to Teaching or explaining, and I've not had to run into that If you were to set it to an empty, the one part of it

Sudhir, Jay, re e dot prevent default, that stops it, and then you can go ahead and do the rest of your stuff, make a fetch request or or just put a loader on the screen, something like that. Yeah. And the event dot prevent default is one of those ones that we're using way more today in the JavaScript forward, And I've dove into will be an item in the array. So in the case of west space boss, you get 7 items in the array.

and maybe potentially seeing some off the wall questions come in your own situations.

a huge, range. Some of them are very early on, and some of them come later. So it's We should have maybe an entire episode on, specifically a lot of the emojis.

or,

what Are what does immutability mean? Or just the general rules to we're doing the new JavaScript today, but we've done CSS and HTML and,

Yeah.

We're going to start off with

40.

No. Is it kind of like filter? Was thinking I was kinda like and then I was like, wait. That's what filter is.

delete ready. Alright. Next question. I have one for you, is method.

Re How do you

meet a criteria. So true or false? So The example I always give Yeah. Is you have an array of family members, and you wanna make sure that at least 1 of the family members is over 18 years old. So you say dot sum, and then you pass it a callback function. You check if the the age of each person is over 18. And if at least 1 of them

is 40.

if some Oh. Of the values

is over 18, then it will return true. Otherwise, it's false. Yeah. I knew I was getting into a hole when I was describing it. Because as I was doing, I was like, wait. This is filter. I'm talking about filter. I'm just grabbing filter. Yeah. That's, that's what's going on here. Okay. Cool. Next one

What's wrong about that? I never used sum. Rid dot sum

Yeah.

Yeah, it's a link tag right out there after Yeah. I was like, so tripping on that. I was like, Wait, is there another one? I don't know why I was thinking there was like another one. Rid And if you use let and const, you can just use curly brackets because They're scoped to a block, so that's another way. I've never seen anybody do that, but that's kinda interesting. Yeah. Just I've actually seen that that block scoping technique, but I've never used it I never really found the meat, but No. Have seen it in the wild before, and it been a little bit like, oh, interesting. I wonder why they chose to do it this way.

JavaScript, nowadays,

I mean, you would just for a CSS, wouldn't you just insert into the DOM a It is used for the comparison of two numbers.

Next question here is run let's see.

A link tag.

And it's also for JavaScript, it's saying do the same thing, but with a script tag. But I think your answer is even better is

Oh, this one will be fun.

What are tasks

387.

I personally have been leaning way towards more doing the dynamic importing. Just because you do, you get that promise. It feels like you have a little bit more control than, oh, I just threw this thing on the body, and now I gotta make sure it loads or whatever. So spreads and this is question number for the iPhone, which I don't know if you call this a video game. You call it, like, a iPhone game, I guess. And I don't know if this is on Android. It could be. I'm very sorry, Android people. I hate it when people do that.

kind of the same thing. But has some crazy good courses coming out. We just had a course from Colby Fayock come out That is, Next. Js in ecommerce with Snipkart, So if you wanted to create a new object with the contents of the old object plus some other stuff, you'd say const, the object name is equal to the 2 brackets, get this. Next question is number 324.

but, yeah,

So I know that I think we even had a show on this. With the event loop, you've got re Events that happen, and then you have

know the answer of if you're writing JavaScript in some sort of way, but you might not know the language.

queue right now. Yep. That's interesting that understanding the event loop is But This is a, pretty modern API.

how it works under the hood. I think that's the type of interview question you'll really, really want to to spend time on because it's a type of thing that you probably

tasks that are queued up.

in the event loop? Sign up your team today. We have team accounts. That's right. You can sign up your entire team. Everybody can get rid in there with all that awesome content. So check it out, level up tutorials .com.

dancing basically on it here. I think you have it, which is just that a task is

I think tasks are things that are in the web API.

Is a weak map Wait.

a very good interview question because it shows a person

rid to the task queue. So a task is added to a task queue when a new JavaScript program is executed directly from the console by running in a script element. It's added to the task queue. Also added when an event fires. An event callback is added to the task queue.

the word task? Oh, god.

Has gone past just being able to write JavaScript, and they've gone into understanding what do we have right now? 48. Man, I'm I'm having a blast here.

Today, we are sponsored by 3 awesome companies, FreshBooks, Cloud Accounting, LogRocket, Node,