Asynchronous Iteration & Top-Level Await

[00:00:00]
>> Maximiliano Firtman: Async iteration, this is actually, again, not a big deal, but there are not so many direct use cases for this. Something I will say, you will use this for that. But now, you can have a generator that is async as well. So in this case, you yield, yield, yield, and then when you do this, you can use a for await, and that's a new part.

[00:00:27]
So it's a for where on every iteration, it will have an await, does that make sense? So it's an async for, that kind of the idea. So, in this case, it's giving you a, b and c, nothing really fancy, okay? So it's actually executing the generator until it's done.

[00:00:51]
Of course, when there is no more code, the generator returns that it's I'm done. Okay, I'm done, and because I'm done before off finishes. Again, it's not something that you will use on a daily basis for very specific purposes, but again, it's something that they are anyway. And now, as I mentioned before, we do have a top-level await.

[00:01:17]
And this is new, okay, the top-level level await is new. It's from 2022, and the idea is that you can do something like that, like going and fetch some data and use await directly in the top level without a function, but there is a big catch. If I run this, it's not gonna work.

[00:01:38]
It say, come on, why? Because it works only in the bodies of modules. So I can do this, it works, but only in a module. So for example here, the script3, I can just put that here because that's a module. Remember, when it's a module, it depends if it's Node.js or if it's a browser, but that script should be a module.

[00:02:06]
If you do that, then you can call an API or a function that returns a promise. You can use a wait for that without async, without an async function. If you're interested in why that await is not anywhere else, because it's kind of weird, there is. If I remember correctly, it's a full stack conference in London, 2016, okay?

[00:02:35]
Remember that, so I was speaking there at that conference. And there was one talk of the guy that submitted the proposal, top-level await to the ECMAScript process, because he wanted to do async await without async directly like this everywhere. And he was actually talking about the experience of what and how the browser's were actually reacting to that.

[00:03:01]
And they were actually saying, we cannot do that, and they will explain why bla, bla, bla. And the final solution to that was to change the proposal to work only on modules. So they could do that on modules, but not for the global context. It has to do with the synchronous blocking the thread and so on.

[00:03:25]
There is another exception to that, but it's just for developers, for us. It's a console. So I can do await fetch./labs/labs.json and it works. I'm awaiting for it. And I can even await now for that and call .json. So this is next to the await, and there is no async, okay?

[00:03:51]
And, oops, I have a problem somewhere. I think, yeah, you're right. [INAUDIBLE].
>> Maximiliano Firtman: Is this one, okay? There, so I'm getting all the chapters with all the lessons there and the file that needs to be loaded with all the code labs. And so you can use top-level await in the global context in depth tools.

[00:04:18]
That works in Firefox, Safari, and Chrome, and Chromium. But it's just for us to work better while debugging, but it actually is not working really in the code. So if I copy this and paste this in the JavaScript, it's not gonna work unless it's a module.