ES6 Debugging

We have earlier seen the introductory concepts of ES6.. Debugging is the act of looking throughout the code, understanding what it is doing, and figuring out why the program is not acting as expected. In the below example, the console.log() function is used for code debugging. To understand what is going on in the program at each step, we are figuring out with console.log() function that outputs the array and accumulator in the program at each step to the console. javascript

const flattened = [[0, 1], [2, 3], [4, 5]]
        .reduce((accumulator, array) => {
    document.write('array', array);
    document.write('accumulator', acccumulator);
    return accumulator.concat(array);
}, []);

To avoid logging to the console every time, ES6 provides with the debugging tool, the debugger. The Debugger allows the user to dive into any function and monitor everything in step by step manner. When JavaScript Engine and the browser runs into the word debugger, it stops and opens up the window for us. The example below demonstrates the use of a debugger. The JavaScript Engine stops at the debugger and opens up the window as shown below. The window gives information regarding the array and accumulator in the program. javascript

// JavaScript code
const flattened = [[0, 1], [2, 3], [4, 5]]
        .reduce((accumulator, array) => {
    debugger;
    return accumulator.concat(array);
}, []);