Using 'debugger' to set breakpoints in JavaScript

Written by
Published on
Modified on
Category

Errors are a part of the coding game and tracking them can sometimes take up most of the job.

This is why most programming IDE's offer some form of debugging system, typically through breakpoints.

What are breakpoints? Think of them as pauses that you can add to your code temporarily to see just what is happening at that point in time.

All modern browsers currently offer built-in JavaScript debugging with breakpoints.

The debugger statement, allows you to directly add breakpoints right in your code.

function driveCar(){
    let direction = 'left';
    debugger;
    turnWheel(direction);
}

In the example above, assuming that the developer tools were open in your browser tab, you would get an instant breakpoint stop on the second line.

This is a great way to save your breakpoints while you are working on a project, as otherwise the breakpoints are saved on the browser itself.

But remember to remove them before they launch to production!

Walter Guevara is a software engineer, startup founder and currently teaches programming for a coding bootcamp. He is currently building things that don't yet exist.

Comments

No messages posted yet

Developer Poll 🐱‍💻

Q:

Add a comment

Send me your weekly newsletter filled with awesome ideas
Post