10 советов для отладки Javascript в консоли как ПРО

В последние десять лет одной из моих страстей является front-end разработка (в особенности javascript). В этой статье я хочу дать вам о несколько крутых советов для профессиональной отладки, используя старую добрую консоль.

Да, мы все знаем основы:

console.log(‘Hello World!’); // выводит сообщение или объект в консоль
console.info(‘Something happened…’); // тоже самое, что и console.log
console.warn(‘Something strange happened…’); // тоже что и console.log, но выводит предупреждение
console.error(‘Something horrible happened…’); // тоже что и console.log, но выводит ошибку

Совет #1 console.trace()

Если вы хотите узнать, откуда запрашивается лог, используйте console.trace(), чтобы получить трассировку стека с зарегистрированными данными

Совет #2 console.time() && console.timeEnd()

Если вы пытаетесь найти проблему с производительностью, начните подсчет времени с помощью console.time() и выведите его с помощью console.timeEnd().

Совет #3 console.memory

Если ваша проблема с производительностью еще сложнее, и вы ищете скрытую утечку памяти, то можете попробовать использовать console.memory (свойство, а не функцию), чтобы проверить размер кучи.

Совет #4 console.profile(‘profileName’) & console.profileEnd(‘profileName’)

Этот метод не является стандартом, но получил широкую поддержку. Вы можете запустить и остановить инструмент производительности браузера(профайлер) из кода с помощью console.profile('profileName'), а затем console.profileEnd('profileName'). Это поможет вам точно спроецировать то, чего вы хотите.

Совет #5 console.count(“STUFF I COUNT”)

В случае повторяющейся функции или кода, вы можете использовать console.count(“?”), чтобы подсчитать сколько раз ваш скрипт будет исполнен.

Совет #6 console.assert(false, “Log me!”)

Да, условное логирование без обёртывания ваших логов с помощью if-else. Вы можете использовать console.assert(условие, сообщение), чтобы выводить в консоль сообщение, когда условие является ложным.

* дисклеймер – в Node.js это вызовет ошибку Assertion Error! (ошибка утверждения)

Совет #7 console.group(‘group’) & console.groupEnd(‘group’)

После написание большого количества логов, возникает необходимость группировать их. Небольшим и полезным инструментом для этого является console.group() и console.groupEnd(). Используя группу в консоли, ваши логи группируются вместе, а каждая группа создаёт другой уровень в иерархии. Вызовите groupEnd(), чтобы понизить уровень иерархии на один.

Совет #8 Подстановка в строки

При логировании вы можете подставлять переменные, используя строковые подстановки. Эти ссылки должны быть типами (%s = string, %i = integer, %o = object, %f = float).

Совет #9 console.clear()

И так, написав так много логов, пришло время немного почистить консоль.

Совет #10 console.table()

Сохранил лучшее для последнего, на мой взгляд это настоящий драгоценный камень! Фактически вы можете распечатать очень красивую таблицу с объектами, которые вы логгируете, используя console.table().

Я очень надеюсь, что эти советы сделают вашу отладку немного продуктивнее и даже интересной!

Больше статей можно найти на сайте: codenative.ru