Dev Dilemmas: TypeScript Triumphs and Quirks of JavaScript Arrays - JSJ 614
AJ, Charles, Dan, and Steve dive deep into all things JavaScript and TypeScript. In this episode, they discuss the pros and cons of arrow functions and the ongoing debate about using semicolons at the end of JavaScript statements. They also explore the use of different types of quotes for strings and the rise in popularity of TypeScript among developers. Additionally, they cover a wide range of topics, including array manipulation, coding laziness, and the challenges of reading and understanding JavaScript code. Join them as they navigate through these intriguing discussions and gather valuable insights for our development journey.
Show Notes
AJ, Charles, Dan, and Steve dive deep into all things JavaScript and TypeScript. In this episode, they discuss the pros and cons of arrow functions and the ongoing debate about using semicolons at the end of JavaScript statements. They also explore the use of different types of quotes for strings and the rise in popularity of TypeScript among developers. Additionally, they cover a wide range of topics, including array manipulation, coding laziness, and the challenges of reading and understanding JavaScript code. Join them as they navigate through these intriguing discussions and gather valuable insights for our development journey.
Sponsors
- Chuck's Resume Template
- Raygun - Application Monitoring For Web & Mobile Apps
- Become a Top 1% Dev with a Top End Devs Membership
Picks
Transcript
CHARLES MAX_WOOD: Hey, welcome back to another episode of JavaScript Jabber. This week on our panel, we have AJ O'Neill.
AJ_O’NEAL: Yo, yo, yo, coming at you live from the, is my audio in sync?
CHARLES MAX_WOOD: It looks like it.
DAN_SHAPPIR: Yes, it is.
STEVE_EDWARDS: That's a new place. I haven't heard of that place before.
AJ_O’NEAL: Yeah. Well, I was on the boot.dev podcast and when it got released on YouTube, I'm like half a second off.
CHARLES MAX_WOOD: Ooh, yes.
AJ_O’NEAL: It looks terrible. And I was trying to figure it out. And as far as I could tell my audio is in sync on this end.
STEVE_EDWARDS: And I can see lag too now that you say it.
DAN_SHAPPIR: Yeah, there's, there is a slight lag.
AJ_O’NEAL: It really, if you're looking for it, you can see it. Well, that's what we need to know because I can fix that extremely easily. I can fix that with. Okay. Is the lag better or worse?
DAN_SHAPPIR: Not the same.
AJ_O’NEAL: Okay. How about now? Is it?
CHARLES MAX_WOOD: Double shooting live on the show.
STEVE_EDWARDS: I know that. That's what I was about to say too.
DAN_SHAPPIR: It looks better now. I think.
AJ_O’NEAL: Yeah. Okay. Deal. All right. A hundred millisecond delay.
STEVE_EDWARDS: This is how the sausage is made.
AJ_O’NEAL: Yes. This is how the sausage is made. Come in at your live from how the sausage is made.
DAN_SHAPPIR: I think there is still an, I would add another a hundred milliseconds.
AJ_O’NEAL: All right. Thanks.
CHARLES MAX_WOOD: All right. We also have Dan Shapiro.
DAN_SHAPPIR: Hey from an Israel still at war.
CHARLES MAX_WOOD: Steve Edwards.
STEVE_EDWARDS: Yo from I'm only one. Yo, yo, yo, yo, from a very foggy Portland area where we need more snow.
CHARLES MAX_WOOD: Yeah. I'm Charles Maxwood from top end devs and, uh, I'm going to tell y'all to go over to top end devs.com slash calendar. We have a whole bunch of stuff coming up. And I'm super excited to be working with folks to help them get ahead and figure things out. So,
Hey folks, this is Charles Maxwell. I've been talking to a bunch of people that want to update their resume and find a better job. And I figure, well, why not just share my resume? So if you go to topendevs.com slash resume, enter your name and email address, then you'll get a copy of the resume that I use, that I've used through freelancing, through most of my career as I've kind of refined it and tweaked it to get me the jobs that I want. Like I said, topendevs.com slash resume will get you that. And you can just kind of use the formatting. It comes in Word and pages, formats, and you can just fill it in from there.
CHARLES MAX_WOOD: Yeah, this week we're going to be talking about TypeScript and JavaScript. And Dan, you've done a whole bunch of Twitter polls that you wanted to talk through. And I think that's kind of an interesting thing that you're doing there. Do you want to give us a little bit of backstory though on like what prompted you to ask these questions and why these particular ones?
DAN_SHAPPIR: Yeah, as you said, over the past couple of weeks, I've been running a series of polls. They're actually fairly easy to find on my account because I've more or less phrased all of them the same way. All of them start with a question, what kind of JS slash TS dev are you? And then I pose particular question and we will go through the list of questions. Now, the reason is that as we know, and as AJ loves, there are multiple ways to do anything in JavaScript. And over the past number of years, the number of ways has been steadily increasing. And all the tooling is also influencing the way in which we're using JavaScript. And it kind of made me curious about, you know, are developers primarily using the new ways, the old ways? I've been surprised by some of the things that I've seen people do. I review a lot of code. I've been surprised by things I see in code. Now, we've got tools like Prettier and whatnot to kind of rectify a lot of the various discrepancies creep into our code, but be that as it may, I was really interested in how people, what are their default preferences, as it were. And so I started running these polls, just various questions that popped into my head about the ways in which people are using JavaScript or TypeScript or both. And sometimes I was surprised by the answers, sometimes less so. And I thought that it would be a great topic to discuss, you know, especially in this episode which we are recording on January 1st. So it's kind of like the beginning of the new year and trying to kind of take stock where we all are as web developers or JavaScript developers. So as you said, I ran all this whole bunch of questions. I doubt that we will have time to go through all of them. But we will see. Maybe we'll have more for an additional episode. Maybe I'll have ideas for more questions to ask following this episode. But I've copied all the other questions and the answers that I got. I didn't organize them according to the order in which I asked them, because that was pretty random as things occurred to me. Rather, I tried to group them and also kind of sort them more general, you might say, to the more specific. So we will see how it goes and how far down the list we can get. So the first question which I asked, the first question on the poll and one of the questions that got the most votes, it got something like 376 votes. Not like, exactly. And the question was about the usage of, you might say, TypeScript versus JavaScript four options, TypeScript without any, TypeScript with any, JS doc, and JavaScript without any explicit types. Now it's important to kind of emphasize that what I meant by TypeScript without any is not that there's absolutely, positively no use of any anywhere in the code, rather that an effort is made in order to get rid of any as much as makes sense. So it's about people who take a more strict attitude towards TypeScript versus those that take a more lax kind of attitude towards TypeScript. But you might say that both these groups actually use TypeScript. In fact, I might argue that anybody is using JSDoc is effectively also using uh, syntax and different, uh, tool chain.
STEVE_EDWARDS: And the makers of Svelte would agree with that.
DAN_SHAPPIR: Yeah, for sure. And it's also worth mentioning that, you know, one of the Twitter brouhaha's that we had back in 2023, you know, so long ago was the one started by DHH about whether or not using explicit types is a good thing or not and whether we should be just using JavaScript with dynamic types or should we be converting to static typing as much as we can. And it's important to emphasize that difference between a DHH take and the one taken, let's say, in Svelte, which you mentioned, where they ditched type the TypeScript syntax, but not the TypeScript approach because as Steve said, they embraced JS doc. So if we look at the results, we see that almost 55% use TypeScript without any. Then another. Can you bring that up on screen? Yeah. How do I do that? Is there a share? Oh, yeah. A present? That's the one? Yep. OK, share screen. OK.
CHARLES MAX_WOOD: Just keep in mind that most of our Uh, yeah, this audio only, so we need to make it friendly to that.
DAN_SHAPPIR: Yeah, obviously. Uh, here we go. Can you see it now?
CHARLES MAX_WOOD: Nope, I gotta add it to the... Oh, there we go. Good deal.
DAN_SHAPPIR: Okay, the only problem is that the now I don't see you guys, but you know, be that as it may. It could be a good thing. Yeah. So again, the numbers are 55% almost use TypeScript without any, 20% use TypeScript with any, another 14% use JS doc and then.
AJ_O’NEAL: Woohoo!
DAN_SHAPPIR: And then, and then 12% just use JavaScript.
CHARLES MAX_WOOD: Um, I think I voted in this one and I think I was the last. Cause I've just, I've been too lazy to really deeply go for any of it.
DAN_SHAPPIR: So you're, you're just using JavaScript and benefiting from the type information that the VS code can provide for you regardless because of the libraries and what
CHARLES MAX_WOOD: Yeah, but you also have to understand that my contract is a Ruby contract. And so, um, right. So a lot of those people are probably not writing full-stack JavaScript, right? They're, they're doing something where, Hey, you know, it pulls in the JavaScript stuff and it does the JavaScript stuff. Does that make sense?
DAN_SHAPPIR: Yes, it does. So, and, and you know, if you're usage of JavaScript is kind of minimal and especially if you're working solo, it makes a whole lot of sense in my opinion. I once tweet, joked or shit tweeted or whatever you call it, that my optimal use of TypeScript is everybody uses TypeScript and I just use JavaScript and benefit from everybody else's hard work. So I totally get it. And most of the organizations that I see using TypeScript actually are, you know, multiple developers working together on the same code base. It could be like five people. It might be 50 people. Um, and in those environments, it makes sense to be as strict as you possibly can about stuff.
AJ_O’NEAL: Well, the moment you have to refactor something. Okay. First of all, I'm not talking about TypeScript. I'm talking about types. I'm not even talking about types. I'm talking about tooling because all of this is completely, it really is just completely bogus entirely because there's no such thing as types. There's only tooling. Once it runs its machine code, the machine runs whatever the machine code says. The machine does not care about types whatsoever. That's how we get all the security vulnerabilities and memory corruption and all of that stuff, right? Because the machine doesn't know what types are. The types are in the tooling. And the TypeScript checker is probably the best tooling that we have in JavaScript. I think we could have something way better. I think it pales in comparison to what somebody just looking at JavaScript as a language could come up with if they had the resources that the TypeScript team had. Right. But JS doc and the TypeScript checker gives you tooling that lets you know when things are out of alignment. So you change, you miss, you misspell something. You misspell a property name. You get the spell check on it. You, you need to change the name and type of something. Say that, uh, you know, you, you did the dummy thing and you put in.
CHARLES MAX_WOOD: I always do the dummy thing.
AJ_O’NEAL: As a float, but you, you realize, oh, that should be a string instead. Cause it's money and money and floats don't mix. Right. And you know, so you change it to a string. It gives you that capability. To get errors where you forgot something. And I think that's really where the core value of it is.
DAN_SHAPPIR: Well, I have to say, first of all, that these days, if you're doing money in JavaScript, you should be using like a big int rather than strings.
AJ_O’NEAL: Oh, sure, sure. Pardon my French. Yeah.
DAN_SHAPPIR: But it's interesting that I agree with the gist of what you said, but I do disagree with some of the details. I think you're correct about the runtime, not caring that much about types in terms of the machine code. Although, these days, the CPUs do differentiate between floats and ends and stuff like that. But the types in many programming languages do determine the code that gets generated. It's interesting that in the TypeScript JavaScript combination, you know, all the type information is effectively jettisoned. And then the JavaScript engine kind of needs to infer the stuff dynamically at runtime and generate the code based on that, on what it actually encounters and sees and totally disregard the information that it had probably correct information that it might have had in TypeScript.
AJ_O’NEAL: Yes, but if you are using, and again, not TypeScript, but if you are using JavaScript types and you are using them consistently, if you're only using, if you never switch a variable name between what type it is, so you do strict typing, and then you also use specific types for a specific purpose, strong typing, then you will... when the when the JIT optimizer looks at your object, if you provided the object that you're going to use from the start and you use it the same way throughout, then it's going to be optimized. If you're stretching up the way you're using it, it can't optimize it.
DAN_SHAPPIR: Again, I'll slightly rephrase. If you are consistent in terms of the type information, you are making it much easier for the JIT to optimize it. It still may not optimize it. For example, if it's only run once, then it might decide that it's just not worth the effort. But yeah, by doing things poorly in terms of type consistency, you're effectively preventing from optimizing it even if it wants to. The other point that I wanted to make is that I don't know what surprised me more. Was it the fact that 88% effectively used TypeScript or that 12% don't?
AJ_O’NEAL: Well, we had a comment, somebody said that 50% is lying and I'm going to agree with them.
CHARLES MAX_WOOD: Well, just to back up, you know, you said that typescript with any is, or without any is, you're making an effort to minimize any, but I don't know if I get that from this question.
DAN_SHAPPIR: Oh, I added it in a follow-up comment. I should have probably specified it more explicitly in the original question. But if that's the case, if people read it to be you know, really without any than 55%. Yeah. It's very optimistic. Yeah. Um, yes. Um, from what I'm seeing in the real world, um, then there's much more use of any than we would like, by the way. Ah, yeah. I remembered one more thing that I wanted to say, uh, about what you mentioned before. AJ, I actually think that the TypeScript team have done an amazing work of corralling what is likely the most dynamic of any of all dynamic languages into some sort of a static type system. You know, JavaScript was not designed with, with static typing in mind. This is not OCaml. This is not Haskell. Uh, and, and being able to retrofit a sane static type system, you know, you can argue the same part, but you know, being able to retrofit something like that on top of JavaScript is pretty amazing. I'll give you an example. Think about a method like docu The type returned depends on the value of the string passed into the function. So, you know, that's something that's really kind of difficult to do. If you think about it, you know, making the return type conditioned on the value of the argument.
AJ_O’NEAL: Well, I think, I think this is where languages need to go. And this is one of the things that Zig has maybe not pioneered, but advertises. There's no reason that your tooling shouldn't be able to look at your code and effectively run whatever is runnable at dev time. Like it shouldn't have to wait until it's machine code to be able to understand, oh, this string, it's obviously the word div, you know? So I'm not as impressed by that as I am disappointed that it's taken this long and has so few implementations.
DAN_SHAPPIR: There's a whole other topic which I think is beyond the scope today, which is about the fact that TypeScript really has effectively like two levels. There's the level of usage by most application developers. And then there's the level used by library creators, which is much more difficult and is much, makes much more use of things like generics and stuff like that in order to make the interfaces as type-safe as possible. And sometimes that does require a lot of know-how and effort, but again, I think that kind of goes beyond the scope of, of, you know, how much we want to talk about that particular question. Otherwise, you'll never get to any of the others. Yeah.
AJ_O’NEAL: But to that, to that end, did you hear about a floppy bird being implemented in TypeScript?
DAN_SHAPPIR: Well, yes, I did and it's not surprising because in order to do you know once you introduce generics into the type system. You've effectively made your type system a programming language
AJ_O’NEAL: Yeah, and by typescript I meant not typescript but type the types of type.
DAN_SHAPPIR: Yeah, the typescript types. Yeah Yeah, I've seen similar things by the way done in for example in C++ Once when C++ got generic the C++ template system. Because again, once you throw in generics and stuff like that, then effectively it becomes a programming language. You can start doing conditionals and loops, and from that point on, you're off to the races. OK, next question. The next question was, and here I need to thank a few people, we will link to, I won't try to read the names, list of tweets and people can see it. Basically, it was to see whether or not people are using semi-colons or not, because again, this became a whole Twitter debate all over again, surprisingly, so I really didn't expect it in 2023. But here we are, whether or not you use semi-colons at the end of JavaScript statements. Now, obviously we've got tools like prettier that can add it or remove it, depending on your own preferences. My question was mainly about what is your preference? What do you prefer to do? How do you prefer to write your JavaScript code? And I'm happy to see that the majority prefer semi-colons because that's also my preference. Anybody here likes of, you know not using, not putting in semicolons explicitly?
STEVE_EDWARDS: So, coming from the PHP world where they're required is just sort of habit anymore. For me, it just makes neater and easier to read code. You know, that's, and there's times where code won't have a semicolon, but that's pretty rare for me.
CHARLES MAX_WOOD: Yeah, at the risk of dragging DHH back into this. So, most of his JavaScript code samples don't have them, which is kind of funny because I I prefer putting them in. I get that we have automatic semicolon insertion and other things that make it so that, you know, generally you don't have to put them in. I just, I don't know, for me it's kind of just an explicit, hey, you know, anyway, I put them in. I'm actually, I feel like 70%, 75% are right here.
DAN_SHAPPIR: Yeah, my take on this is that again, it's not that semicolons are optional in JavaScript. It's that we have ASI, automatic semicolon insertion, which basically means that the JavaScript parser parses stuff, errors out because there's a missing semicolon. And when it does, it catches that error and then tries to figure out where's the most logical place to insert that missing semicolon. And I don't like my tooling doing guesses about, you know, where semi-colons should go. Uh, you know,
CHARLES MAX_WOOD: I like magic in my code, but not this kind of magic.
AJ_O’NEAL: That's one of the things that's nice about Prettier is when you accidentally forget a semi-colon or whatever Prettier reformats your code in such a way that it is clearly obvious that the structure of the code and the way it's executing has changed. Um, but I will also say one of the reasons that I'm against not using semi-colons is that they are required because there's a list of edge cases that you have to be aware of. And you can either choose to just always put a semi-colon or you can carry around in your head that list of like five or seven checks and then always be thinking about like every single time you don't insert a semi-colon. Is it breaking any of these five or seven rules? And if you are willing to do that mental gymnastics, then you don't need semi colons. Um, however, I've found a very, very simple list of rules that I believe also would eliminate the need for semi colons, which is if you either always capture the results of a function or use the keyword void to explicitly disregard what the return of the
STEVE_EDWARDS: Java and JavaScript are the same. I knew it.
AJ_O’NEAL: And if you never do something that requires parentheses, uh, in the order of operations fashion, you know, like if you never, if you always split multiplication and addition onto two lines or, or, you know, something like that, anything that would require parentheses to be able to
DAN_SHAPPIR: Yeah, and be careful of the return keyword and other various rules, just easier to use semicolons. Oh, yeah.
AJ_O’NEAL: Yeah. I agree with the tooling that we have, but I believe that we could have a version of JavaScript that doesn't require semicolons. Oh, which would be nice if we could get there, but it would require following other rules that people don't follow. Anyway.
DAN_SHAPPIR: Yeah, it would be called Python.
AJ_O’NEAL: I was I was actually gonna call it AI script but
CHARLES MAX_WOOD: There we go.
DAN_SHAPPIR: Yeah, exactly. Okay, moving on to the next one. Another question about how people write or style, more precisely, their JavaScript code. And this one is about how you write a named function. And the two options are either to be old school and use the function keywords. So let's say it's function foo, open parentheses bar, close parentheses, and then, you know, open curly brackets and so forth. The other option, which I'm seeing a lot in code these days, is using an assignment of the function expression. So you would do something like const foo equals a bar arrow and then the curly brackets. So it's assigning a function expression into a named variable or identifier, more precisely. It was fairly evenly split, but still 55% preferred the good old-fashioned function keyword, which I'm happy to say is what I also prefer. And by the way, an important point to make here is that when I look at the code base, if it doesn't use the approach that I prefer, I don't change it. I maintain consistency with the code base.
CHARLES MAX_WOOD: Wow. That's very mature of you.
DAN_SHAPPIR: I know
CHARLES MAX_WOOD: Dan.
DAN_SHAPPIR: I know.
CHARLES MAX_WOOD: I have to say that readability-wise, I prefer the bottom one, but I am freaking lazy and so I very often do the top one.
AJ_O’NEAL: Why is it just make F in a macro? Like if you want to be lazy, be really lazy. Like use the tools. That's why you're typing out the whole word const when you could just type F in and tab. Hmm.
CHARLES MAX_WOOD: Um, I feel bad.
DAN_SHAPPIR: To be honest, I really don't know why people preferred the assignment of the arrow. Um, you know, maybe it's look, it is the one benefit which or there are a few benefits. First of all, it does explicitly make the, the identifier immutable, which is probably what you want in a function in like 99.9% of the time. Another advantage is that you don't, that this is not bound, which is again, is what you generally want these days. And another advantage is that it you don't there's the arguments object doesn't exist and the argument object is something that you probably don't want to use anyway these days. Other than that. It's I don't see it like it's it seems less readable to me like being saying something is a function is a much more explicit way of saying something is a function and I like my goal to be explicit. Uh, the other thing is hoisting. I like hoisting, uh, with, with the assignment it's. You know, it's not hoisted and you can get into trouble in unexpected scenarios. Um,
AJ_O’NEAL: what do you think about exports dot foo equals or exports being a stand in for the larger object people dot get name equals, et cetera.
DAN_SHAPPIR: I'm not sure I follow.
AJ_O’NEAL: Well, most of the time you have a function, it's on an object, right? So you just.
DAN_SHAPPIR: No, not necessarily. A lot of my code just has a lot of exported functions. Not necessarily a lot, but, uh, you know, one or more exported functions from a file, from a module.
AJ_O’NEAL: Right. So what I'm saying is you just assign the function to the object that gets exported.
DAN_SHAPPIR: No, I use the export keyword.
AJ_O’NEAL: You can't be saved.
STEVE_EDWARDS: So you can be structured then? So you can be structured or?
DAN_SHAPPIR: No, he's just using a common JS. That's, that's the thing. It took me a moment to realize what he meant.
AJ_O’NEAL: But even if it's not common JS, I mean, just having, you know, whatever object you're exporting be the thing that you attach the functions to.
DAN_SHAPPIR: But why, why not just have export on the functions or on the identifiers as you know, as you can these days in modern JavaScript.
AJ_O’NEAL: Well, because then you have a lot. It's just a lot more to parse. It's a lot like if you try to grip through the code, it's a lot easier to see the get name function attached to person than it is to see a bunch of get name functions across the code base. Read through the different, you know, like there's a get name in person. There's a get name and dog. There's a get name. I
DAN_SHAPPIR: get what you're saying. Yeah, I get what you're saying. The way that I deal with it is, first of all. That's the kind of the, first of all, the reason that I like hoisting is that I put the exported stuff at the top. Uh, so it's not as if you're likely to, you'll see something exported and then a lot of unexported stuff and then another exported something, you know, as soon. So that's one thing.
CHARLES MAX_WOOD: Another thing is just to back up for people who are really new to JavaScript. So what hoisting does is if you declare a variable, it'll move it to the top. Of your, you know, when it does its stuff and that way you can put the exported stuff at the top and since you have by the property of hoisting anything you declare lower that's going to be used by the stuff you're exporting will get moved up above right it's available to the things at the top even though you haven't declared it yet exactly assuming you use the function keyword right right uh
DAN_SHAPPIR: and um so so that's that's one. Another thing is that I tend to keep my modules small. So it's not as if I'm going to be exporting a hundred things out of the same file. Again, unless it's like this special, like, uh, you know, some people like coalesce a lot of the exports like into the, like, uh, sort of an index file at the root of a library or something, so to make it easier to import things, but for most actual implementations, I don't export a ton of stuff. So again, you don't need to scan a large amount of code just to find all the exports. But I do get what you're saying, AJ. There is merit in that. You know, if you're exporting something that feels like an interface, it makes sense to like put it all within an object or something.
AJ_O’NEAL: So I mean, just so you can see what's public at a glance and when you grep through the code, you can easily find like, show me everything, show me all the methods that are exported from person at a glance. I can just grep person dot, right?
DAN_SHAPPIR: And you also can get potentially easier completion.
AJ_O’NEAL: I don't use completion, but maybe. So it takes too long to pop up on the screen. I can finish typing it by the time that
CHARLES MAX_WOOD: we did have a comment here. And I think it's an interesting, uh, kind of, I know you're talking about named functions here, but, uh, and I'm sorry if I butcher your name. But Bellagio, Bellagio, anyway, he says good old function every day, all day. The only time I use the arrow function are in callback. So I guess the question that I'm aiming at here is, do you ever use arrow functions for anonymous functions?
DAN_SHAPPIR: Oh yeah, for sure. For sure. The name describes their use. Their function expressions. So whenever I need a function, a lambda effectively, within an expression, I use arrows. Okay. So you know, I'm a big fan, for example, of chaining. You know, using stuff like map or filter, stuff like that. And in those, unless it's some sort of a reusable code, a really complex, let's say filter that I, you probably don't want overly complicated filters and functions anyway, but otherwise, I definitely use function expressions there or lambdas and then I definitely use arrows. I never, you can use the function keyword for lambdas. That's the old school way of implementing them.
CHARLES MAX_WOOD: Yeah, you just don't give it a name.
DAN_SHAPPIR: Exactly, I don't do that.
Time is of the essence when it comes to identifying and resolving issues in your software, and our friends at RayGun are here to help. With RayGun alerting, get customized error, crash, and performance alert notifications sent directly to your preferred channel with integrations, including Microsoft Teams and Slack. Set thresholds on your alert based on an increase in error count, a spike in load time, or new issues introduced in the latest deployment, along with custom filters that give you even greater control. Assign multiple users to notify the right team members with alerts linked directly to the issue in Raygun, taking you to the root cause faster. Never miss a runaway error. Make sure you're quickly notified of the errors, crashes, and front-end performance issues that matter the most to you and your team. Try Raygun alerting today and create a world-class issue resolution workflow that gives you and your customers peace of mind. Visit raygun.com to learn more and start your 14-day free trial today. That's raygun.com.
AJ_O’NEAL: Okay. The problem with that, with the Lambda expression style, is that the opening and closing curly braces become ambiguous. And so it's very difficult to tell whether you're returning an object or whether you're defining a block. That's my beef there. I've had bugs pop up with that multiple times.
DAN_SHAPPIR: Yeah, it's always a block. And if you really want it to be an object, you need to
AJ_O’NEAL: Yeah, anyway. Yeah. Yeah. So I'm hard against the implicit parentheses.
DAN_SHAPPIR: Yeah. But again, this has to do with the whole expression thing that it's, you know, but yeah, I can see your point. You know, nothing's perfect. Moving on to the next one. I was just I was just curious how people use, you know, how people write strings these days. Do they use single quotes, double quotes, backticks? What do they use for simple strings? And not surprisingly, the majority prefer single quotes. It's not surprising to me because why press the shift key when you don't have to?
CHARLES MAX_WOOD: I looked at that one and I was trying to decide why anybody cared.
DAN_SHAPPIR: Oh, I was just curious.
CHARLES MAX_WOOD: Yeah.
DAN_SHAPPIR: You know, you do you. By the way, interestingly in the old days of JavaScript and you know, like I'm talking like 15 20 years ago As I recall most people did the double quotes And it's and it's kind of changed over the past decade or two from what I'm what I experienced
AJ_O’NEAL: So I write the single quotes But I commit the double quotes because every time I write single quotes it just gets Transpiled to double quotes with prettier the reason for that is that in every other programming language, single quotes are constants, and double quotes are expressions. So I tend to only use single quotes intentionally when it's something that is a constant value. And I use double quotes in general because usually you're doing expressions. You're not doing constants.
DAN_SHAPPIR: Yeah. Well. I'm not sure what you mean by expression versus constant really.
AJ_O’NEAL: Yeah. Nevermind. Yeah.
CHARLES MAX_WOOD: I can't say the differences is that you can interpolate within double quotes and you can't within single quotes. Right. Yeah.
DAN_SHAPPIR: So in Ruby double quotes are the bit like the back ticks, aren't they kind of like
CHARLES MAX_WOOD: kind of, but yeah, but, but. But the thing is, is that people try to make all kinds of arguments about like performance and stuff like that. And I just haven't seen anything there that holds water. So that's why I'm saying, you know, if people look at it and they know it's a string, then why, why do you kill?
DAN_SHAPPIR: I will make one more. The one re there are two reasons. I initially, when I got into JavaScript, I initially tended to use double quotes was because I come from CC plus plus.
CHARLES MAX_WOOD: Uh-huh.
DAN_SHAPPIR: And in those languages, double quotes are zero terminated or null terminated and single quotes are not. And usually you want the string to be null terminated. Usually in C. Yeah. So yeah. Now the only-
AJ_O’NEAL: If you want security vulnerabilities, you definitely want the null terminated.
DAN_SHAPPIR: Exactly. Now the only comment, I'm not really surprised that hardly anybody chose the backticks. The only thing that's kind of surprising- surprising about that is that we will see later on people do like backticks for template expressions.
STEVE_EDWARDS: Yes.
DAN_SHAPPIR: And it's kind of funny that you if a string becomes template in a template expression, which it might, you need to change the quotes syntax. And then if it stops being a template expression for some reason, you need to change the quotes again rather than just leave them as they are which works. So you could just use backticks everywhere, but apparently people don't like that.
AJ_O’NEAL: You can't actually.
DAN_SHAPPIR: So why not?
AJ_O’NEAL: I was actually on full backtick everywhere train for a while. You cannot use backticks for a key name. So if you were to do an object and you put double quotes around, you know, name and then colon double quotes AJ. You cannot do backtick name, colon backtick AJ. You can't, you can't do that. And I think this just goes to, I, this is very confusing to me because we have a template syntax for keys and an object, which is to put square brackets around it. And to me, it seems, I guess they were standardized at different times. I like why this is seems redundant and silly, we should just be able to use the backticks as the template expression. But instead, if it's an object key, the template expression is you put brackets around the variable name.
DAN_SHAPPIR: Another interesting thing is that JSON uses double quotes.
STEVE_EDWARDS: Yes, that's thrown me off before more times and I can't remember.
CHARLES MAX_WOOD: Yeah, I think everybody's put gun that.
AJ_O’NEAL: NPM install fix JSON and it'll usually get picked up by your editor automatically. And then when you're editing JSON and you put a single quote by mistake, it'll just swap it to double quotes. It'll also deal with the trailing commas and stuff like that.
AJ_O’NEAL: Yeah, that's the other annoying thing.
STEVE_EDWARDS: So my rule, Dan is I'll generally default to single quotes everywhere. Double quotes. If I have to quote something inside a single quote, like say, uh, an attribute inside of a template, uh, like an abuse single file component in the template portion. And then the only time I ever find myself using backticks is when I need to do a template string. And the example that I've been using a lot lately is if I'm defining a poster, a get URL within my view component, and it requires a dynamic value like an ID value, as part of the string or something dynamic, and I'll use the backticks with the dollar sign curly brackets around it. But general rule is single unless I have to otherwise.
DAN_SHAPPIR: So the vast majority agree with you. Steve and that also exactly goes to the next question on my list, which was about building a string from a static value and the dynamic value. So would you write greet equals hello plus name or greet equals backtick hello dollar curly bracket name curly bracket. And it's amazing to see how popular template strings have become. You know, people have told me that it's not really surprising because most default ESLint rules or linting rules now we kind of enforce this approach. So people really got used to it. But still, it's interesting that so many people just prefer to use template, the template literals.
STEVE_EDWARDS: Well, it makes sense. It makes sense because basically you're not switching in and out of your context. You don't have to do like hello plus space plus string variable plus comment and quotes, but you know, in this you can just do it all in one fell swoop without having to switch context like that.
CHARLES MAX_WOOD: Well, and in my opinion, it's easier to parse because the plus with the quotes, it blends into one line more easily, the dollar bracket stands out more. And so you know where you're sticking dynamic values into that sucker.
STEVE_EDWARDS: Yeah, and in my at least in my DEF. ID and I'm assuming I use PHP storm. I'm assuming it does the most it will highlight those colors Yeah, it's all highlights your template strings and they stand out more easily
CHARLES MAX_WOOD: Yeah, so I know exactly what I did and and that's always my issue is how can I make it easier for future me or some? Other idiot, but it's usually future me. That's the idiot Right to look at this and go. Oh, I can easily see what's going on here
DAN_SHAPPIR: Um, yeah, and the vast majority agree with you. Like 88.4%. Yes, AJ.
AJ_O’NEAL: So, uh, the, the, what convinced me on this, cause I've, I've gone every which way with the template strings. Unfortunately, because there's no consistent way to use them. I like, I wish that there was a consistent way to use them, but there's an edge case where they don't work. No, like, no matter which style of coding you prefer that, like you just run into something where you can't be consistent in the way you use strings in JavaScript. But 365JSThings, which is, well, I guess his Twitter handle is actually at unique name, but this is Corey Brown. He made the argument that it's easier for you and the interpreter because you don't have to worry about order of operations errors or concatenation type changes. So if you are putting the two things inside the template string, you know, they're both going to be strings. So if one happens to be a number and the other happens to be a number, if you use plus, but you were thinking that you were assigning a string, you're actually, you know, I mean, that's kind of a weird case, but still, I mean, weird cases are what, where the bugs come from.
DAN_SHAPPIR: I know. And by the way, one of the most, like if, if I could have gone back in time and whispered on Brendan Icke's ears. Back when he was creating JavaScript one of the things that I would have suggested to him would have been to use a different Operator for addition versus concatenation of strengths.
AJ_O’NEAL: Yeah, this gives you that this so that's
DAN_SHAPPIR: Yeah, effectively it does. Yeah Okay, moving on to the next one where now we're entering a new topic which is array processing. So I asked a bunch of questions about the ways in which people work with arrays. And the first question is kind of like the most basic one, and which is, how would you iterate over an array in the scenario where you're kind of in the side effect scenario? So forget, for example, about something like a map or a filter. Let's say I want to log all the values of an array, or I want to send over the network all the values of an array or I want to add to the DOM all the values of an array or something like that. How would you iterate over the array? The first option is the old school one which is you know i equals zero, i less than a dot length, i plus plus. The next one is the more modern use of for of. You know it might be for const v of a. And the last one is the dot for each.
STEVE_EDWARDS: And it depends what you want to do. Oh, by the way is an area like an array this kid You and So yeah, it's interesting I I generally like to use for each I guess the caveat here Dan is what you're trying to do as compared to something like a Map or filter right you just want to do something to whatever item is you don't necessarily want to filter out certain items or only extract certain items
DAN_SHAPPIR: Yeah, as I said before, I like chaining. So when I can't chain stuff, I usually go for chaining. But I explicitly wanted to look at the scenario where you're just looping over an array and just doing something with the values. Like I said, maybe sending them over the network or adding them to the DOM or something like that.
STEVE_EDWARDS: I've seen arguments that for each is performance inhibitive. That's the best way to say it. But it's funny, some of those arguments I see, they say, well, that's better on performance here and here, but the difference is like microscopic.
DAN_SHAPPIR: First of all, first of all, the first of all, let's say this, I'll be surprised or shocked if that's the actual performance issue in your code.
STEVE_EDWARDS: Right. Exactly.
DAN_SHAPPIR: It is, you know, prove it to me with a profiler. That's point number one. Point number two is I can think of scenarios in which for each would actually have better performance because JavaScript the JavaScript engines actually optimize functions as a whole in most cases. So they either optimize the entire function or they don't optimize the entire function with for each they can optimize the function being invoked in the function expression being invoked inside the for each. Even if for some reason they cannot invoke, optimize the containing function. And in that scenario, you'll actually get the optimization of the code called on each iteration sooner or faster or more easily than with the others. So here's a scenario where you, that one might actually execute faster. But again, I highly doubt that that will be the performance bottleneck in your code either way. So it's very much more of a stylistic choice than anything else.
CHARLES MAX_WOOD: Yeah, I just want to chime in here because this was the debate in the Ruby community between the single quotes and the double quotes is somebody did the profiling and it was like a 20 pico second difference, right? So they were saying, see, it's more performant. And I was just like, so what you're telling me is I could just keep being lazy and I'm going to add 20 pico seconds here or there to my code. Okay, great. I'm just going to keep using double quotes.
DAN_SHAPPIR: Um, so what, what you guys prefer, which, which approach do you, would you take?
CHARLES MAX_WOOD: I use for each whenever I can.
AJ_O’NEAL: I, I got on the for each bus early. Uh, but then when promises were introduced, I'm not when async away, it was introduced eventually. I had to get off the four each async or the for each bus because then you, you, you end up with this. What color is your for loop? And I just don't want to deal with it. So I I've stopped using for each map filter, all of it, just like I've thrown it all away because it's just not worth the overhead of having to go back and refactor code for something that is,
CHARLES MAX_WOOD: I mean, it's one line anyway.
DAN_SHAPPIR: Just saying that once a sync iterator helpers hit the language whenever they finally do, you... Sorry, you let the leg get in there. And now you need to stop.
STEVE_EDWARDS: Well, it had it on looping.
DAN_SHAPPIR: Yeah, and looping is the topic. All I was saying is that if and when...
AJ_O’NEAL: Perfectly timed. That was the best one of the whole...10 year run.
DAN_SHAPPIR: If and when a sync iterator helpers actually land in JavaScript, AJ, then you would be able, I don't know if you want to, but you would be able to go back to those iteration methods. But,
CHARLES MAX_WOOD: yeah, you can start doing it right again.
AJ_O’NEAL: It'd be hard to get me back on that bus because iterators introduce their own set of props. Somebody needs to go through the 12 different standard bodies that govern JavaScript and just come out with like a unified standard of JavaScript so that we have one language, not a language and six implementations by different committees that don't communicate with each other. And I think that's what WinterCG is trying to do.
DAN_SHAPPIR: Oh no, WinterCG is trying to actually...Oh, that's not exactly the case. You know, it's an aside. Winter CG is about the library code. So it's about the fetch and stuff like that. Not things that are actually part of the language. So part of the language itself is still owned by TC39 and will continue to be there. Uh, but, but we kind of deviated. I have to say that I was kind of surprised that more people preferred, uh, four of over four each. Uh, it was pretty close. It's 42% versus 40.5%. So it's kind of neck and neck. Uh, and, but you know, it still surprised me. Uh, I was expecting far fewer people to actually use for all of, I'm guessing AJ that it's probably because of the reason that you mentioned, you know, people really like a sink away. And it's much easier to use them with, uh, uh, for all of rather than for each. And I am happy that people are ditching 4i, although 18% using it is still a lot, simply because it's too much, it's TMI. Why are you in the nitty gritty of the index and whatnot?
CHARLES MAX_WOOD: Because that's what they teach you in your computer science class.
AJ_O’NEAL: But this is again, this goes back to a lack of foresight in these committees, right? Most languages that have an iterator construct, it would be 4k, comma, v of a.
DAN_SHAPPIR: You can actually do that here. You can actually kind of do that. You can do const v, let's say v i of entries. So you can have both the key and the value.
AJ_O’NEAL: Wait. Okay. So you, this can be-
DAN_SHAPPIR: You do four. You do a const open square brackets, key, comma, value of a dot entries.
AJ_O’NEAL: I'm going to have to try that because yeah, the reason that I do revert back to the i plus equals one loop is because there are occasions where I need access to the index for some reason. Sometimes it's modifying the original array. Sometimes it's so.
DAN_SHAPPIR: So instead of keys, you use the you use entries that returns. a sequence of arrays of like, well, tuples where you've got like, uh, first is the key and then the value. Uh, and then you destructure them into a key and into a key and a value. Okay.
AJ_O’NEAL: Uh, I, I might play with it, but I, I just have a sense that something will go wrong there.
DAN_SHAPPIR: is not that well let's put it this way all three actually do a different thing so they they're used for the sims for the same purpose or the very similar purpose but each one really does a different thing uh 4i literally you know goes over all the values from zero to. So it's syntactic sugar for iterator, which is why A doesn't need to be an array. It can be anything which exposes an iterator. It could be a map or a set or whatnot.
AJ_O’NEAL: Oh, OK. Yeah, because it's not intuitive when it works and when it doesn't. I always convert things to arrays before using it, because I thought it worked in a case where the thing was an object, but then it never worked again.
DAN_SHAPPIR: It works in a case where A is an object, assuming A is an object that has an iterator.
AJ_O’NEAL: Yeah.
DAN_SHAPPIR: And for each depends on what the implementation of for each is on that object. You can, you know,
AJ_O’NEAL: so standard JavaScript. It's an error.
DAN_SHAPPIR: Yeah. I, again, as I'm saying, you know, I was saying they effectively do the same thing in most cases, it's just important to understand that the implementation is different.
AJ_O’NEAL: Well, to the point of it, iterators, they feel like I guess meta programming. It's, it's like a layer.
DAN_SHAPPIR: But that's the argument we keep having, AJ. I totally agree that iterators kind of failed in JavaScript in that nobody explicitly uses iterators in JavaScript. But everybody uses iterators implicitly in JavaScript. First of all, as you can see, almost half the people use for all, which is built on top of iterators. Everybody uses the spread operator, which is built on top of iterators. So everybody's using iterators without thinking about the fact that it's iterators under the hood.
AJ_O’NEAL: Sure. But you don't. Okay. So let's promises you, if you're using async and await without knowing the, how promises work, you, you're probably creating bugs in your code or, or otherwise doing it wrong, the iterator stuff, thankfully. You don't have to have ever used an iterator explicitly to use the spread operator.
DAN_SHAPPIR: I totally agree. And that's a good thing because iterators, iterators were meant to be used explicitly by library creators. Library. It's like, you know, it's like as a library user, you just get a nicer interface to the code and you don't need to think about how it actually works on the inside. Yeah anyway, moving on to the next one, which is kind of related, it's about how do you concatenate two arrays? The two options are, again, either go old school and use the concat method.
AJ_O’NEAL: Scroll?
DAN_SHAPPIR: Yeah. Scroll so we can see it? Here. Here it is. Muchas gracias. So you can either do like A equals B concat C, or you can do the new spread thing, which is A equals open square brackets three dots B, three dots C, close square brackets. So again, the code is not the same and there are various edge cases in which the code can behave really differently. For example, what happens if C is not an array, but You know, in most cases when a, B and C are all of them, when B and C are arrays, the results are the same. Um, so, um, it's, it's interesting to see, you know, what people use. And it's interesting to see that most people, 80% almost 80% of the people these days now prefer the spread operators inside square brackets.
CHARLES MAX_WOOD: The deep sigh. I love it I heard somebody give a deep sigh.
DAN_SHAPPIR: Yeah. Why am I not surprised? Why are you, why, why are you sighing AJ?
AJ_O’NEAL: a couple things again committees in every other language if you're doing a spread the spread is on the right side not the left side that is a collect the dots on the left side are a collector the dots on the right side are a spreader okay syntax aside it just is so much more complicated like i don't get the preference
for people to use symbols over words when the words are more clear to the most casual of observer, right? You do open bracket, close bracket, dot concat, b, comma, c, which is an option you didn't list there, but that's the way I actually do it. Just because-
DAN_SHAPPIR: What was your option again, sorry?
AJ_O’NEAL: Just a new array, dot concat, and then b, and then c. Okay. But it's just so much more explicit, it's easier to read. And, and just, I just see so much code that's like arrow symbol brackets dots. And it just, it's really difficult because people, people line noise.
DAN_SHAPPIR: It's line noise. That's what you're saying.
AJ_O’NEAL: Line noise. Sure. And, and so there's a lot of JavaScript that ends up looking like pearl. Cause it's just like arrows dots and you know, just like one thing after the other. And And I'm looking at, I don't know, five lines of code that probably should be 15 trying to figure out what the f is this even do it.
DAN_SHAPPIR: It's it's worth, by the way, I had an interesting conversation about this with Evita we've had from Meta we've had on the show, he spoke about the vest testing library, uh, and he actually prefers concat. And there are two reasons that he gave. One is that concat works well with chaining, which he likes. Now, of course you can add stuff after the closing square brackets. You can change stuff there, but then the chaining looks less natural because you got some of the chain inside the brackets and then some of the chain after the brackets. And the other reason that he liked it, which I'm more ambivalent about, and I told him so is that concat works when c is a value rather than a collection
AJ_O’NEAL: that's bad that's not good
DAN_SHAPPIR: that's what i think but he likes it
AJ_O’NEAL: Yeah. I have gotten a little bit scared sometimes because of concat. Um, yeah, not, not knowing how it will interpret something. Cause I want an air in that case, right? Like I want to be like, Oh, you, you F'd up. You, you put the wrong variable in here.
CHARLES MAX_WOOD: By the way, once we get through a raise, we should probably call it an episode.
DAN_SHAPPIR: Yeah, for sure. Uh, So let's speed things up. We've got two more things about arrays, which is great. We've got things for next time, and I'll probably have... By the way, if either you or the listeners have ideas about additional such polls that I should run, I'd be more than happy to if you just send me a link, either DM me or send me. By the way, to all our listeners, if you're not following us on Twitter, why? You know, I'm Dan Shapiro Twitter is thinking exactly I'm just Dan Shapiro on Twitter You know follow me. I'll probably follow you back and you know, we can all be friends. You like me here on the podcast you you you'd probably like me just as much on X. Anyway, moving to the next to the next one. It's how to get the last item of an array so again, we've got the old-school approach which is you know, just use the dot length minus one inside the square brackets. Uh, then we've got, I'll go to the other extreme. We've got the latest and greatest, which is the at method. Oh, and the at works exactly like an index only it also supports negative values. Uh, so I might see exactly, exactly like slice. So, you know, doing an at at minus one gives you the last value. By the way, I am slightly miffed that it's minus one rather than minus zero.
CHARLES MAX_WOOD: So zero base going one way and one base going the other, is that what you're saying?
DAN_SHAPPIR: Yeah, and by the way, JavaScript does have the concept of a minus zero as an almost distinct value from zero.
AJ_O’NEAL: Yeah, this was one of the underscore versus low dash things. This low dash handles negative zero per spec.
DAN_SHAPPIR: So yeah, but anyway, it isn't. So the last item is minus one rather than minus zero. And the middle of the road is to use the dot slice, which supported minus one from way back when. Uh, and then you can destructure the result because the slice returns an array.
AJ_O’NEAL: So it was like zero. If, if you don't want your code to look weird.
DAN_SHAPPIR: Yeah. Um, and, um,
CHARLES MAX_WOOD: I always did. I liked slice.
DAN_SHAPPIR: Yeah. It's the only downside of course, is we were talking overhead and the Pico seconds, it actually allocates an array and copies into that area.
CHARLES MAX_WOOD: So there's a slight addition of my memory allocation.
DAN_SHAPPIR: Yeah, exactly.
STEVE_EDWARDS: It's gonna be a tiny bit bigger. You know, I've always used slice. I haven't used at, but just looking at the code, to me, it makes more sense.
CHARLES MAX_WOOD: I like that. Yeah, I didn't know that.
STEVE_EDWARDS: Constantly looking at the difference between slice and splice and...
DAN_SHAPPIR: Yeah, and at is pretty much universally supported these days. It's obviously in Node, the latest version of Node, and I think all the browsers now support it. So it just works. Even if you don't use some transpilations, the step or not, or whatnot. Um, but it's interesting to see that the majority of people, 55% still go old school.
AJ_O’NEAL: Well, they don't know about it. They're finding out about it today on this podcast.
STEVE_EDWARDS: Yeah.
CHARLES MAX_WOOD: Or when they say,
DAN_SHAPPIR: yeah, but I gave the option on the poll. They could have said, Hey, that's cool. I don't use it, but I'll start using it today.
AJ_O’NEAL: And they, yeah, but then they would have still answered the poll honestly.
DAN_SHAPPIR: Oh yeah. Okay. Maybe. Um, yeah, I'm, I'm, I'm with, with the at, um, but, uh, but yeah, uh, it's not complicated, it's easy to understand. The only potential downside that I see if it's not an actual area, but rather an area like objects, you know, those abominations, but other than that, you know, just use that.
AJ_O’NEAL: So weird thing at is not on. Can I use, are you sure you can't search for it? Probably because it's a two letter search term. I'm trying to see if I can get it. Not it is not there at is not on. Can I use so, but I have started using at for my node code. Cause now it's gotten mature enough in node that I feel comfortable using it. Uh, last time we had mentioned it on the show. It I don't think that it had been in an LTS release yet or something like that. But I believe that now it actually has been in an LTS release. So it's mature enough, but I'm not sure on the browser side of browsers actually support it yet or not.
DAN_SHAPPIR: Oh, browsers do. You know what?
AJ_O’NEAL: Oh, I found it. I found it on can I use it's just, it's, it's weird. Okay. Yeah. So basically. It doesn't work on any of the Asian browsers. So QQ, Baidu, KaiOS doesn't work on the Wii U or on feature phones on Android.
DAN_SHAPPIR: Yeah. But you'll probably use it when you build for those, you probably use a transpilation, then you're fine.
AJ_O’NEAL: Well, but if you don't want to use transpilation, if your target is people on feature phones, meaning non-paying customers or Asians then you don't want to use it unless you transpile.
DAN_SHAPPIR: OK, now moving on to the last question of the day, the last question in the array category. This one is slightly contrived, or more than slightly, but still it's interesting. Let's say you want an array where the values match the index values. So it would be an array with a value 0, 1, 2, 3, 4, all the way up to n or whatever. So there, how would you create this in your code? And it does come up, you know, I've run into the scenarios where you want it and it's kind of annoying that there's no easy way to get it. Although in the spec, they are working towards something and we can mention it at the end. But the options that I gave are using it's you know, I'll basically be reading out code. It's easy using using array dot from where you can provide it with two arguments. One is just an object with the length property that you, you know, whatever your end that you want to go up to. And the other is kind of a map function that you can provide as this as an optional second argument to the from, and you can use it to actually fill in the values into the array that you're generating. So that's option number one. Option number two is to create, you might call it, an empty array of length n by just using the array constructor with the value n. Then use the dot fill to actually fill it with something because it's so that it won't be empty. So you can fill it with zeros. And then you can use the map to actually put the indexes into the array. And then finally, there's the old-school approach of just using whatever loop construct you prefer with a push to push the values into what was initially an empty array. Um, so yeah. And interestingly, it kind of split almost, well, almost equally between all those, between these three options. Interestingly, array from is in the lead, which kind of surprised me. On the other hand, only this one was the one that got the least amount of votes. Only 71 people voted on this particular poll and it might be skewed by, you know, the people who tend to follow me. So that's definitely a possibility there. Um, I'm curious what you guys would have used in this scenario.
AJ_O’NEAL: Preferring readability. And being that looking at that screenshot is absolutely no clearer than listening on the podcast. I prefer the obvious. I create a function called range and then I do whatever I do in there and I can't remember what I do, but it is a pain in the butt. Yes, it's, it's weird, but I create a function called range so that it's clear what I'm doing.
DAN_SHAPPIR: How about you, Chuck? What would you use?
CHARLES MAX_WOOD: I do the loop and push. I didn't even know you could do the other stuff.
DAN_SHAPPIR: And Steve, how about you?
STEVE_EDWARDS: What Chuck said.
DAN_SHAPPIR: By the way, so again, Evyatar, what I've mentioned before, reminded me that an advantage of array from over the array and then the fill is that you iterate over the loop once rather than twice. Because with fill you first iterate to fill it with zero and then you iterate again in order to fill it with the actual Index values so it is a couple of picoseconds slower. Yeah, it's interesting I don't you know, I really don't know what I would use To be honest, I probably do what AJ just said which is why it's really great that JavaScript standard is working on introducing a built-in range method so that you'll be able to get such ranges out of the box built-in without you having to implement them yourself.
AJ_O’NEAL: Yeah, I'm definitely in support of that making it to the standard library. Hopefully it's done in a way that isn't incompatible with all the other types of loops we do already.
DAN_SHAPPIR: Let me let me slightly slightly annoy you it's iterator dot range. So it will be a method on the iterator object
AJ_O’NEAL: Well, they're gonna force people to Accept the one true iterator object, huh?
DAN_SHAPPIR: Yeah, but it does mean that it will work with for all So if you want to do a 4i over a range of values. You'd actually do a for all over a range. And the advantage of doing it over as an iterator is that it would never actually allocate the array. So you could do theoretically an infinite range and then break out of it when you don't need it anymore. You know, when you reach the point that you are done with it.
AJ_O’NEAL: I just I've got to ask the question though, because this is this is, you know, the thing that people say about iterators. Oh, it doesn't allocate the memory. In what real UK use case are you generating such a big number of things that...
DAN_SHAPPIR: No, actually that's not the right way to think about it. You either generate something that has a limited size, in which case you're absolutely correct, or you generate something that looks as if it's infinite size. And then you break out of it when you reach the point where you don't need to go any further.
AJ_O’NEAL: Okay, I'm not, I get the sense of what you're saying. I'm not sure where it's of, of practical.
DAN_SHAPPIR: Think about, think about, think about, for example, I've got the sequence of all the, all the odd numbers, and then I go as far as I need to go.
AJ_O’NEAL: I, again, it's, it's like one of those things that people say for mathematical purity, but okay, show me the use case, baby.
DAN_SHAPPIR: Anyway, this is it for today. We've got something like five more questions remaining that we can do in some follow-up episodes or not. Hopefully, I'll have more questions, more polls by then, but we're essentially out of time.
STEVE_EDWARDS: So Dan, did you calculate your margin of error for this polling?
DAN_SHAPPIR: No. You just know what your error bars are? No, I did not, but. I'll put it this way and that's another reason to follow me. I am betting that there's a certain skew in my answers given that, you know, thinking about the people who follow me, people like Dan Abramov and Rich Harris and Ryan Carniato and Adios Manny and Mishko Hevery just throwing out the names. You know, so if you want to be about amongst that refined crowd, you should follow me. And then you can, and then you'll see my polls when they come out and you can participate.
CHARLES MAX_WOOD: All right. Well, let's, let's get to some picks and yeah, by all means, if you have a question you think Dan should ask, throw that at him too.
Hey, this is Charles Maxwood. I just wanted to talk really briefly about the top in Dev's membership and let you know what we've got coming up this month. So in February, we have a whole bunch of workshops that we're providing to members. You can go sign up at topendevs.com slash sign up. If you do, you're going to get access to our book club. We're reading Docker Deep Dive, and we're going to be going into Docker and how to use it and things like that. We also have workshops on the following topics, and I'm just going to dive in and talk about what they are real quick. First, it's how to negotiate a raise. I've talked to a lot of people that they're not necessarily keen on leaving their job, but at the same time, they also want to make more money. And so we're going to talk about the different ways that you can approach talking to your boss or HR or whoever about getting that raise that you want and having it support the lifestyle you want. That one's going to be on February 7th, February 9th. We're going to have a career freedom mastermind. Basically you show up, you talk about what's holding you back, what you dream about doing in your career, all of that kind of stuff. And then we're going to actually brainstorm together, you and whoever else is there and I, all of us are going to brainstorm on how you can get ahead. The next week on the 14th, we're going to talk about how to grow from junior developer to senior developer, the kinds of things you need to be doing, how to do them, that kind of a thing. On the 16th, we're going to do a Visual Studio VS Code tips and tricks. On the 21st, we're going to talk about how to build a software course. And on the 23rd, we're going to talk about how to go freelance. And then finally, on February 28th, we're going to talk about how to set up a YouTube channel. So those are the meetups that we're going to have, along with the book club. And I hope to see you there. That's going to be at topendevs.com slash sign-up.
CHARLES MAX_WOOD: All right, AJ, why don't you start us off with our picks?
AJ_O’NEAL: Okay, picks. Dang. Uh, one thing that I, I was thinking about recently is I got, I'm, I'm now in the third book of the Chaos Walking trilogy and that is pretty good. I, I'm going to be interested to watch the movie after I finished the books and kind of
DAN_SHAPPIR: see which trilogy is that?
AJ_O’NEAL: Chaos walking. It starts with the knife of never letting go. It's about, it's about a colony. It's kind of like a space Western, but the people have crash-landed their ship on a planet and they're not going to be able to get off of it. And then they, you know, it's been almost a generation of people living there. And then the next settler ship is, is, uh, on its way. And so,
DAN_SHAPPIR: so there was a movie in 2021.
AJ_O’NEAL: I that sounds about right. Okay. Yeah. So yeah, but the movie got really bad reviews. And I think the problem was that they tried to turn it into I think this is what I what I heard is that they they tried to turn it into a story about sexism and it just didn't land with people because people didn't want to get preached at that wanted to watch that movie. They wanted the story and and so a lot a lot of people said that they're really upset that they abused the movie. And that the book, you know, if they followed the book instead of creating their own story arc that, you know, the movie could have done well. And so that got me interested in the book because I liked the trailer for the movie and I didn't know it was based on a book. But the reviews were so bad that I just didn't go see it. But I saw a review that said, look, you got to read the books because the books actually are an interesting story. And the reason that it would be an easy movie to turn into, you know, a political message about sexism is because. There is a divide the mint. So everybody is infected with a bacteria or some pathogen or, or, or parasite or whatever that, um, but it only affects males. It doesn't affect females.
DAN_SHAPPIR: Oh, I remember the, I now remember the trailer. Okay. So they project their thoughts, something like that.
AJ_O’NEAL: Yeah. So all males, um, project their thoughts as as something that and the females can sense it and this goes for animals as well as humans. So the females can sense the males but the females don't project their own thoughts. So you know every impulsive thought that a man has including about women you know like is immediately available on display to anyone within earshot let's say of of the man. And so this creates this rift in society. Um, and there is a psychopath who wants, does not like that women can hear his thoughts and the women mysteriously disappear. And that I'm in the third book and that's still not entirely resolved. I'm still kind of waiting for the reveal of what happened, but yeah, so there is, there there's, there's like the psychopath who needs complete control and the ability for others to hear thoughts or like it's, it's, it's kind of difficult to explain because of the nature of the sci-finess of it. But essentially settlers land on a planet, the women disappear, the men can see and hear each other's thoughts. And a woman is discovered in the woods by the protagonist about like two or three chapters in. And it's his first encounter with a woman and she is from the other settler ship that had been on its way for a generation. So that's kind of, that doesn't spoil too much, you know, other than the first, you know, it doesn't spoil any more than what's in the trailer for the movie. So I'll just stick with that because we talked about it a whole bunch and I don't want to take up the remainder of the hour with that.
CHARLES MAX_WOOD: Interesting.
AJ_O’NEAL: Yeah, so Chaos, the Chaos Walk in the book trilogy, really interesting to me. We'll see what I think about it when I finish the third book here, but I'm about two-thirds through the third book and I'm excited to see how things wrap together. And I think there's going to be a twist ending. I'm not sure if I'm going to like it or not.
CHARLES MAX_WOOD: Alright, Steve what are your picks?
STEVE_EDWARDS: Well, before we get to the high point of the episode, I do have another semi-legit pick. It's a blog post I came across on Hacker News from Ars Technica, and it's one of my favorite topics to read about. And it's titled, How Archaeologists Reconstructed the Burning of Jerusalem in 586 BC, or BCE, if you're politically correct. Basically, in the Old Testament, the Kings and Chronicles, Talks about how Nebuchadnezzar came and completely destroyed Jerusalem in 586. He had Captured it and taken off a lot of the Jews To Babylon but a couple of kings that stayed there decided to try to rebel and he said screw this I'm taking you all down. And so it basically completely destroyed the city and so, The article talks about a study that was done uh, there that used, uh, analytics of fire and how fire behaves. And a lot of the things we can tell now, you know, with forensic and how, what fire did to a building to, uh, pretty much nailed down the app. About that time is when Jerusalem was completely burned, uh, and destroyed. It's really pretty fascinating, especially if you're into fire science as I am. So anyway, we can put the link in the show notes for sure. And now it's time for the dad jokes of the week. I haven't been posting for a couple of weeks because I've been on vacation, but I think I can dig up a few that are worthy of being quoted here. So in the spirit of Christmas, did anybody hear about Rudolph's ride on the roller coaster when he went to the amusement park? You can say he held on for dear life. Now I am a, I think true pizza aficionados would call me a heretic and shoot me on site for saying this, that I do like pineapple on pizza. The pine and swine, pine and swine, aka Canadian bacon and pineapple is for me the best pizza. So the other day I was cooking some, but I actually burned it. I found out it was, you know, it's called a Hawaiian pizza. You know, as one of the names. I prefer pine and swine, but in the spirit of wine pizza, I should have cooked it at Aloha temperature. Pfft. Right. I love the groans. And then finally, apologies to pets fans, but I loved this one when I saw it. Does anybody know why there are no cats on Mars? No. Because curiosity killed them. All right. Curiosity is the NASA Rover that was on Mars. You know, there's curiosity with the other one.
CHARLES MAX_WOOD: Oh, discovery. I think. Yeah. Something like that. The space shuttle.
STEVE_EDWARDS: Yeah. That was the space shuttle. Anyway, anyway, those are the dad jokes of the week.
CHARLES MAX_WOOD: All right, Dan, what are your picks?
DAN_SHAPPIR: Um, okay. So I've got two. Uh, my first pick is, um, And despite your frequent recommendations, Chuck, I've not really been into board games that much. But now as a birthday present, our kids bought us Settlers of Catan. Is that how you guys pronounce it? And we've been playing it like, you know, in the family. And it's been lots of fun. I've yet to win. But I'm trying. And it's very enjoyable and it's a good game. I really like it. So so yeah, we will see how long we're able to persist. We play it like once a week something like that. We have a game night and So that's that would be my first pick my second is you know as as everybody in the world knows there's a war going on here and everybody seems to be picking sides and what I've What I've noticed is that a lot of people don't really have the context. They don't know the history. Now, you don't have to know the history to have an opinion. You can certainly have opinions about things that are happening at present without thinking about what happened 50 or 100 years ago. But I do think that having more context usually is helpful. And what I would like to pick is this documentary, Israeli documentary. So I can't say about it that it's objective. It's from the Israeli perspective. But it does try to be even-handed, I have to say. It's a documentary that came out in the 80s called Pillar of Fire. It starts when Zionism started in the like 1870s and goes all the way to the founding of Israel and a bit after that. And there's an English version that you can find on YouTube. By the way, one big advantage of the fact that it was done in the 80s is that they could still interview people who were there or even as kids, people who are deceased since then. And what's really great about this series is that they were able to uncover a lot of original films from the various periods. So it's really great in that regard. It's really good, I highly recommend it. So again, I can't say that it's like objective or, you know, you won't get as much of the Arab perspective as you would get of the Jewish perspective. But still, again, I think, you know, they do try to present all the facts and it's highly recommended for anybody who's really interested. So I link a link to the first link to the search in YouTube that will find it. You will see like episodes two and three there. Uh, I don't know if all the episodes are on YouTube, but I think at least the first four or five are there. So, uh, it's, as I said, I highly recommend that. Um, and those would be my picks for today.
CHARLES MAX_WOOD: Awesome. Well, I'll jump in here with a few of mine. Um, let me get that in the comments, people can find it on the YouTube video. All right. So the first one is, I am excited to be going to another board game convention. This is my first time at this one. If y'all remember, Joe Eames used to be on the show, he and his wife would often go to this one, it's called Salt Con. And it's here in Utah, it's up in Davis County. So it's like an hour, a little more than an hour from here convention center up there. And yeah, it's four days, it goes Thursday through Sunday. And it's the same deal as most of the other ones, right, you just go and you play a bunch of board games. A couple of my friends are going so we're all gonna, I think we'll hang out some of the time and then just go find fun games the rest of the time, you know, maybe without each other. But it'll be fun. I'm really, really looking forward to it. So I'm going to pick that as one of the board game picks that I have. And then, um, I really do feel like I ought to pick a board game. Um, my, so we played this with my kids last night. I know I've picked it here before. It's called mysterious. Um, and effectively you've got this ghost, um, who's trying to give. Uh, clues to a set of psychics, uh, regarding the murders that have happened in this house, and then if the psychics all solve the murders there, each solve their own murder you know, the murder that's assigned to them, then, um, then the ghost, which is just another player, uh, gives the final clue, which is a clue to the, uh, their own murder, right? So one of the murders of the murders that the ghost is giving clues to is their own murder. And, uh, anyway, it's been a lot of fun to play. Um, it says play times about 42 minutes. Um, I think, I think we've played every time we've played, it's been an hour, maybe a little longer. Uh, it has a board game weight of 1.9. Um, so it, you know, it's, it's kind of a party game, um, casual gamer level game. Um, and, uh, yeah, anyway, the clues are basically cards that have just random pictures on it. So you're trying to, the ghost is trying to pass these clues over to the psychics and then the psychics have to figure out what in the picture would lead them to pick the right culprit, the right location or the right murder weapon. And yeah, I've been the ghost a couple of times and I've, you know, I've played as the psychic, you know, one of the psychics a bunch of times. And it's tricky because a lot of times what you wind up doing is you wind up getting a card or passing your card that has one or two elements in the card that indicate the thing that you're trying to get them to pick up on. But it's got a whole bunch of other stuff going on right? They're all kind of random weird, you know, cards. So anyway, it is fun. It's a lot of fun. Um, a few other things. I'm just kind of giving people some context for, uh, where we're going with top end devs. Now, um, I want to preface this just by saying I had, uh, kind of a major family event happen right before Christmas. Um, and so I have been dealing with the fallout of that and helping my mom figure out some of the fallout from that. And, um, I was going to have all this stuff ready by the beginning of the year. And so I'm playing a little bit of catch-up, but by the time this comes out, you should be able to sign up. Uh, you can get the free me, uh, the premium podcast episodes that don't have the ads in them for, uh, each of our shows. But the other thing that I'm doing is, um, every month I'm going to have a producer call. And so if you're, if you buy the premium membership, you're a producer and you can get on the call and you can talk to us about, Hey, you haven't done the show on. This or. Hey, I think it'd be really great if you talk to this person, right? So maybe there's something we didn't cover with Mishko Hevery, or maybe we should get Adi Asmani back on, or maybe there's some thing that is inspired by one of Dan's polls, right? So you can get on the call and you can tell me. I'm going to invite these guys, but I don't know what their schedules all look like, so I can't guarantee anything that way. But then we'll get those scheduled. And so you can kind of have a voice in what we talk about on the show. Um, the other thing I'm putting together is I'm putting together videos, um, for Ruby, JavaScript and React, and those are going to come out every week. And what I'm doing is I'm just building apps. Um, and then we'll talk about some of the ideas or ins and outs of any libraries or techniques or anything that I used to build them. So, uh, you know, the React ones are obviously going to be React. If it's not React and it's JavaScript, um, I think I'm going to build a Discord bot in JavaScript for the JavaScript one. Um, and then, uh, for the Ruby one, um, I've got a library I want to modify. There are a couple of apps I want to build and I may or may not build them in Rails. So that kind of gives you an idea. And then finally, um, if you're looking for content from other experts that you can participate in more kind of a, I don't want to say webinar, but it's kind of a webinar, but it's also going to have a very strong Q and a element to it. Then you can go check out JavaScript geniuses. I'm doing that for JavaScript Ruby and, and, uh, react as well. But you can get the JavaScript geniuses and you can just show up every week and we'll either do a Q and a or we'll have an expert on or you know, something like that. So it's kind of like your JavaScript meetup except it'll be online and we're going to make sure we have networking events so you can get to know each other because I feel like that's a critical part of having a successful career these days. So anyway, putting all that together, if you go to JavaScript Jabber.com slash premium, You can see where to get onto the premium podcast. Uh, the other one is called a JavaScript. What is it? JavaScript clips, I think is what I called it. JavaScript clips and the JavaScript geniuses. And I have the domains. If you go to the domains, it'll take sign up pages. So, um, anyway, that's, that's what I got for picks. Um, yeah, I don't think there's anything else, so we'll go ahead and wrap it up until next time folks max out.
Dev Dilemmas: TypeScript Triumphs and Quirks of JavaScript Arrays - JSJ 614
0:00
Playback Speed: