Привет, разработчики JavaScript 👋
Мы все любим писать код, верно? Большинство из нас просто подписаны 👇
Пока мы не получим несколько ошибок в нашем коде, и нам придется сломать нашу рутину, и большая часть ее изменится вот так 👇
Я собираюсь помочь вам написать волшебный код, у которого никогда не будет 🐞.
Хе-хе! ладно, я шучу, на этой небесной земле нет никого, кто мог бы научить вас программировать без ошибок. Но есть несколько способов сократить время отладки и помочь нам понять 🐞 и его источник.
Надеюсь, вы, ребята, все еще со мной, если вы молодцы, давайте начнем -
Как разработчик JavaScript, мы все часто использовали консоль внутри инструмента разработчика. Наш первый подход к тестированию или отладке нашего кода — это вывести его на консоль.
Но знаете ли вы, что существуют разные методы консоли, которые мы можем использовать для различения наших журналов?
console.log («привет, мир!»)
🔸 Наиболее часто используемый консольный метод — console.log(), который выводит все, что передается ему в качестве аргументов на консоль.
🔸 Можно передавать несколько аргументов.
🔸 Это могут быть строки, переменные, объекты, функции или элементы HTML.
console.assert(выражение, сообщение);
🔸 Он используется для создания условных операторов журнала на консоли.
🔸 Выводит сообщение (передается вторым аргументом), если выражение (передается первым аргументом) ложно.
🔸 Если утверждение истинно, на консоль ничего не выводится.
консоль.предупреждать()
🔸 Он выводит предупреждающее сообщение на консоль.
🔸 Сообщение будет выделено желтым цветом.
🔸 Это также дает нам стек вызовов для журнала предупреждений, что помогает отслеживать предупреждение в стеке вызовов.
консоль.ошибка()
🔸 Так же, как и console.warn(), он выводит сообщение об ошибке на консоль.
🔸 Сообщение выделяется красным цветом.
🔸 Получаем стек вызовов ошибок для удобства отладки.
console.count(метка);
🔸 Он выводит количество вызовов метода count для переданного ему аргумента.
🔸 Если ему не передан аргумент, он считается для метки default.
🔸 Аргументом может быть только строка.
console.table(данные)
🔸 Выводит массивы и объекты в табличную форму.
🔸 В качестве обязательного аргумента должен быть массив или объект.
🔸 Первый столбец помечен как index.
🔸 Для массивов первый столбец — это индексы элементов
а для объектов — его ключи.
console.time(метка) и console.timeEnd(метка)
🔸 console.time(label) запускает таймер, чтобы отслеживать время, затраченное на задачу.
🔸 console.timeEnd(label) останавливает таймер для этой метки и печатает общее время, прошедшее с момента его запуска.
🔸 label аргумент должен быть таким же, и как только мы вызываем console.timeEnd(label), таймер удаляется из стека.
console.timeLog(метка)
🔸 Регистрирует время, прошедшее с момента запуска таймера после запуска метода console.time(label).
🔸 Должен иметь тот же аргумент label, что и метод console.time(label).
🔸 При вызове после console.timeEnd(label) выдается предупреждающее сообщение с указанием Timer Label does not exist, потому что timer выталкивается из стека.
console.group() и console.groupEnd()
🔸 console.group() группирует логи с отступом
🔸 console.groupEnd() закрывает начатую ранее группу.
🔸 можно использовать для групповой обработки ошибок и предупреждений или одновременной печати аналогичной информации.
консоль.трассировка()
🔸 Показывает полный стек вызовов при отладке с точки вызова.
🔸 Это может быть очень удобно при отладке сложного кода с несколькими файлами и модулями.
консоль.очистить()
🔸 Когда консоль становится слишком загроможденной, вы можете использовать метод console.clear(), чтобы очистить консоль.
Бонусный совет
Вы можете печатать отчеты журнала с вашими собственными стилями. Есть куча string substitutions, которые вы можете использовать для управления оператором журнала. Но он работает только с консольными методами, которые принимают строки в качестве аргументов.
Проверьте, как использование %c с нашей строкой в console.log() меняет вывод операторов журнала.
Подведение итогов
Хорошо! вот и конец сегодняшнего поста. Я надеюсь, вам, ребята, понравилось, и, возможно, вы начнете использовать вышеупомянутые консольные методы в надлежащих случаях вместо того, чтобы использовать только console.log() для всей вашей отладки.
«Если ваш единственный инструмент — молоток, то любая проблема выглядит как гвоздь». — Абрахам Маслоу
Если вы тот, кто интересуется Frontend-разработкой и хочет узнать о ней больше, рассмотрите возможность подписаться на меня 👇
Отзывы, хорошие или плохие, приветствуются 🧡
До следующего раза продолжайте программировать, продолжайте учиться и ПРОДОЛЖАЙТЕ ОТЛАДКУ. 😁
Ваше здоровье!
Лалит
Первоначально опубликовано на https://blog.lalitshahi.com.
