00:13 We can already see that it has a couple of different tabs and the VARIABLES one is going to be interesting. We’ll see the variables in here. And then we’ll also look at this WATCH thing for a bit. Just so you know, there’s a lot that you can do in here, and we’ll just look at a couple of the features. All right, so we can easily set a breakpoint by just clicking—oh, excuse me, there we are—by just clicking into a line where we want to set the breakpoint. And this red thing here, we can do as many as we want to.
00:43 You can switch them off again, also, by just clicking again. I think you can just right-click delete also. How’s that? Remove Breakpoint. Okay, so we set one here, and I can start the debugger simply by clicking this green triangle. And, here we’re rolling!
It stops the first time it hits this, and we have this nice definition of the variables. The only local variable that we have here is
x, and we have this step over, step forward, continue execution. So with this, I can just go line-by-line. Down here in my terminal I see the output.
x gets printed, the first time it’s
0. I can keep stepping over it or also step to the next breakpoint.
01:35 So, we get a very good and easy overview of what’s going on in our program. We have the features that most debuggers have. We can step into, step out of, start it again, and also stop the debugger. Now, one thing that I think is fun that I want to show you here is this WATCH.
However, what we’re getting printed out is
2. So that gives us an idea to figure out what might be going wrong here. This WATCH is a fun feature. I could also add other things here, like
x to the power of
And for each time that
x changes, this watched expression also changes. This can obviously also be other things than just this squared in here, but it’s a interesting way to keep track of what’s happening in our program and extrapolate what might be going on if you use a different expression.
So it’s similar to using the poor man’s debugger, the print statement, but we don’t actually have to put a
print() inside of our code. And we can also print out expressions if we’re using these squiggly brackets.
04:12 You see that this is a different thing. It’s not the round debug symbol, but now it’s this lopsided square, and that tells us what the log message is. Now I will get rid of this print statement for now, and if I now run the debugger,
04:42 So that’s a interesting feature that maybe can help you to transition away from using print statements to a proper debugger. Okay! So these are just a few features that Visual Studio Code has built-in for debugging. You can see that it happens pretty easy, it’s very intuitive, and quite a powerful feature.
05:01 There’s more that you can inspect here. Explore this a little bit, you can see the stack trace, you can define which breakpoints to raise, so I could raise an exception and then automatically jump into the console. There’s also, I have the…
05:30 We also have a console, so if I run this here and then switch over to the Debug Console, I can also run in here and figure out what’s going on. Squared, whatever I want to do, right? Continue execution.
Become a Member to join the conversation.