Console.log() sous stéroides

NabilFr — Tue, 11 Aug 2020 13:46:34 +0000

Mettre des console.log partout dans son code pour le débugger, tout développeur javascript l’a fait à un moment ou un autre.
Mais la console renferme des secrets méconnues ou plutôt des propriétés fort bien utiles.

C’est ce que nous allons essayer de déterrer à travers quelques exemples très pratiques.

console.count()

Pour savoir combien de fois une fonction a été appelé ou pour vérifier seulement qu’elle a été appelé une fois.
En paramètres un string optionnel qui sert de label pour une meilleure compréhension.

const maFonction = () => { console.count('maFonction a été appellé')};

maFonction();
maFonction();
// Affiche maFonction a été appellé: 2

console.table()

Afficher les données d’un tableau ou d’un objet dans la console peut-être assez illisible.
Essayez donc console.table() pour voir toute la beauté.

const array = [1, 2, 3, 4];
console.table(array);

console.assert()

Tester rapidement quelque chose dans la console c’est possible.
En premier argument ce que l’on veut tester et en second ce qu’on affiche si c’est faux.

console.assert(2 < 3, "2 est inférieur à trois");

console.log() avec du style 😎

Pour terminer, mettre un peu de couleurs et de style dans ses console.log() c’est possible !
On commence avec %c et ce que l’on veut stylisé puis du “inline css”.

console.log('%c Wahouuu!', 'font-size: 48px; color: red;');

Voilà mais n’oubliez pas que le debugger c’est mieux :)

console.clear();

DEV Community: NabilFr

Console.log() sous stéroides

console.count()

console.table()

console.assert()

console.log() avec du style 😎