TypeScript:
Printing debug output

How to:

Want to print debug output in TypeScript? Console methods are your go-to. See console.log, console.error, and friends in action:

// Basic log
console.log('Look Ma, I am debugging!');

// Grouped logs
console.group('User Details');
console.log('Name: John Doe');
console.log('Age: 34');
console.groupEnd();

// Table
console.table([{ a: 1, b: 'Y' }, { a: 'Z', b: 2 }]);

// Error output
console.error('Oops! Something went wrong.');

// Warning output
console.warn('This is a warning.');

// A debug output
console.debug('This is a debug message.');

Sample Outputs:

Look Ma, I am debugging!
User Details
    Name: John Doe
    Age: 34
(index) a  b
0       1  "Y"
1       "Z" 2
Oops! Something went wrong.
This is a warning.
This is a debug message.

Deep Dive

Back in the day, we had alert() – it was in your face and blocked the works until dealt with. Now, console methods rule. They’re less intrusive and come with superpowers: categorize messages, print tables, or style outputs.

Alternatives? Sure. You could write to a file or send messages over the network for remote logging. For the browser, tools like Chrome’s DevTools give you more control over your log levels and formats.

Implementation-wise, console in TypeScript becomes JavaScript at runtime, and that’s where all the real action happens. Fancy TypeScript types don’t change the game here—it’s plain old console under the hood, browser or Node.

See Also