Как прервать выполнение программы в vs code

В этом учебнике представлены средства отладки, доступные в Visual Studio Code для работы с приложениями .NET.

Предварительные требования

• В этом учебнике используется консольное приложение, созданное в руководстве Создание консольного приложения .NET в Visual Studio Code.

Использование конфигурации отладочной сборки

В .NET используются две встроенные конфигурации сборки — Отладка и Выпуск. Вы воспользуетесь отладочной конфигурацией сборки для отладки и конфигурацией для выпуска для окончательного выпуска программы.

В отладочной конфигурации программы компилируется с полной символической отладочной информацией и без оптимизации. Оптимизация усложняет отладку, поскольку усложняется связь между исходным кодом и сгенерированными инструкциями. Конфигурация для выпуска полностью оптимизирована и не содержит символической отладочной информации.

По умолчанию параметры запуска в Visual Studio Code используют отладочную конфигурацию сборки, поэтому их не нужно изменять перед отладкой.

VS Code #Shorts: Toggle terminal

1. Запустите Visual Studio Code.
2. Откройте папку проекта, созданную по инструкциям из статьи Создание консольного приложения .NET в Visual Studio Code.

Установка точки останова

Точка останова приостанавливает выполнение приложения на инструкции, предшествующей той строке, в которой установлена точка останова.

1. Откройте файл Program.cs.
2. Установите точку останова в строке, где отображается имя, дата и время, щелкнув в левом поле окна кода. Левое поле находится слева от номеров строк. Или нажмите клавишу F9 либо выберите в меню пункт Запуск>Перейти к следующей точке останова при выбранной строке кода. Красная точка в левом поле обозначает строку с точкой останова Visual Studio Code.

Настройка входных данных терминала

Точка останова находится после вызова метода Console.ReadLine . Консоль отладки не принимает входные данные терминала для выполняющейся программы. Чтобы использовать выходные данные терминала во время отладки, можно использовать встроенный терминал (одно из окон Visual Studio Code) или внешний терминал. В этом учебнике используется встроенный терминал.

1. Откройте файл .vscode/launch.json.
2. Измените значение параметра console с internalConsole на integratedTerminal .

«console»: «integratedTerminal»,

Начать отладку

1. Откройте окно отладки, щелкнув значок «Отладка» в меню слева.
2. Щелкните зеленую стрелку в верхней части панели рядом с элементом .NET Core Launch (console) (Запуск .NET Core (консоль)). Еще один способ запуска программы в режиме отладки — нажать клавишу F5 или выбрать в меню пункт Запуск>Начать отладку.
3. Перейдите на вкладку Терминал , чтобы просмотреть запрос «Как вы называете?», который отображается в программе перед ожиданием ответа.
4. Введите строку в окне Терминал в ответ на запрос имени, а затем нажмите клавишу ВВОД . Выполнение программы остановится, когда будет достигнута точка останова, то есть перед выполнением метода Console.WriteLine . В разделе Локальные окна Переменные отображаются значения переменных, которые определены в текущем выполняемом методе.

Использование консоли отладки

Окно Консоль отладки служит для взаимодействия с приложением, которое вы отлаживаете. Вы можете изменить значения переменных и посмотреть, как это повлияет на работу программы.

How to get clean output on the vscode terminal .run #coding #programming #python

1. Выберите вкладку Консоль отладки.
2. Введите name = «Gracie» в запросе в нижней части окна Консоль отладки и нажмите клавишу ВВОД .
3. Введите currentDate = DateTime.Parse(«2019-11-16T17:25:00Z»).ToUniversalTime() в нижней части окна Консоль отладки и нажмите клавишу ВВОД . В окне Переменные отображаются новые значения переменных name и currentDate .
4. Продолжите выполнение программы, нажав кнопку Продолжить на панели инструментов. Еще один способ продолжить — нажать клавишу F5 .
5. Снова выберите вкладку Терминал. Значения, отображаемые в окне консоли, соответствуют изменениям, произведенным в окне Консоль отладки.
6. Нажмите любую клавишу, чтобы выйти из приложения и остановить отладку.

Установка условной точки останова

Программа отображает строку, которую вводит пользователь. Что произойдет, если пользователь ничего не введет? Это можно проверить с помощью полезной функции отладки, которая называется условной точкой останова.

1. Щелкните правой кнопкой мыши красную точку, обозначающую точку останова (или щелкните ее, удерживая нажатой клавишу CTRL в macOS). В контекстном меню выберите Изменить точку останова, чтобы открыть диалоговое окно, в котором можно ввести условное выражение.
2. Выберите Expression в раскрывающемся списке, введите следующее условное выражение и нажмите клавишу ВВОД .

String.IsNullOrEmpty(name)

При каждом достижении точки останова отладчик вызывает метод String.IsNullOrEmpty(name) и останавливается на этой строке только в том случае, если вызов метода возвращает true . Вместо условного выражения можно указать количество обращений (выполнение программы будет прервано, пока инструкция не будет выполнена указанное количество раз) или условие фильтра (выполнение программы будет прервано на основе таких атрибутов, как идентификатор потока, имя процесса или имя потока).

Запустите отладку программы, нажав клавишу F5 .

Когда на вкладке Терминал появится предложение ввести имя, нажмите клавишу ВВОД . Так как указанное вами условие соблюдается ( name имеет значение null или String.Empty), выполнение программы будет остановлено при достижении точки останова, то есть перед выполнением метода Console.WriteLine . В окне Переменные указывается, что значение переменной name «» или String.Empty.

Убедитесь в том, что переменная содержит пустую строку, введя следующий оператор в окне Консоль отладки и нажав клавишу ВВОД . Результат равен true .

name == String.Empty

Пошаговое выполнение программы

Visual Studio Code позволяет выполнять программу пошагово, отслеживая результат ее выполнения. Для этого обычно задают точку останова и запускают программу в небольшой части ее кода. Поскольку наша программа невелика, давайте выполним ее пошагово.

1. Установите точку останова на открывающей фигурной скобке метода Main .
2. Нажмите клавишу F5 , чтобы начать отладку. Visual Studio Code выделит строку точки останова. На этом этапе в окне Переменные показано, что массив args пуст, а name и currentDate имеют значения по умолчанию.
3. Выберите Запуск>Шаг с заходом или нажмите клавишу F11 . Будет выделена следующая строка.
4. Выберите Запуск>Шаг с заходом или нажмите клавишу F11 . Visual Studio Code выполняет Console.WriteLine для запроса имени и выделяет следующую строку выполнения. Следующая строка — это Console.ReadLine для name . Окно Переменные не изменяется, а на вкладке Терминал отображается запрос «Как вы называете?»
5. Выберите Запуск>Шаг с заходом или нажмите клавишу F11 . Visual Studio выделит назначение переменной name . В окне Переменные видно, что name по-прежнему null .
6. Ответьте на этот запрос, введя строку на вкладке «Терминал» и нажав клавишу ВВОД . На вкладке Терминал может не отображаться введенная строка, однако метод Console.ReadLine будет записывать входные данные.
7. Выберите Запуск>Шаг с заходом или нажмите клавишу F11 . Visual Studio Code выделит назначение переменной currentDate . В окне Переменные отображается значение, полученное в результате вызова метода Console.ReadLine. На вкладке Терминал также отображается строка, указанная в командной строке.
8. Выберите Запуск>Шаг с заходом или нажмите клавишу F11 . В окне Переменные отображается значение переменной currentDate , которому было присвоено свойство DateTime.Now.
9. Выберите Запуск>Шаг с заходом или нажмите клавишу F11 . Visual Studio Code вызывает метод Console.WriteLine(String, Object, Object). В окне консоли отображается форматированная строка.
10. Выберите Запуск>Шаг с выходом или нажмите клавиши SHIFT + F11 .
11. Выберите вкладку Терминал. В окне терминала отобразится сообщение «Нажмите любую клавишу, чтобы выйти. «
12. Нажмите любую клавишу для выхода из программы.

Использование конфигурации сборки для выпуска

После тестирования отладочной версии приложения следует скомпилировать и протестировать версию в режиме выпуска. Версию для выпуска компилятор собирает с использованием методов оптимизации, которые могут влиять на поведение приложения. Например, оптимизации компилятора для повышения производительности могут привести к состоянию конкуренции в многопоточных приложениях.

Чтобы создать и протестировать версию консольного приложения для выпуска, откройте терминал и выполните следующую команду:

dotnet run —configuration Release

Дополнительные ресурсы

• Debugging in Visual Studio Code (Отладка в Visual Studio Code)

Следующие шаги

В этом учебнике вы использовали средства отладки Visual Studio Code. В следующем руководстве вы опубликуете развертываемую версию приложения.

Источник: learn.microsoft.com

10 возможностей VS Code, помогающих ускорить работу программиста

Когда программист попадает в состояние потока, его мысли часто движутся прямо-таки с космической скоростью. Он пишет код так быстро, как только может, прилагая все усилия к тому, чтобы ухватить свои идеи и не дать им растаять в воздухе или затеряться в закоулках новых образов.

Редактор Visual Studio Code (VS Code) стал восходящей звездой вселенной инструментов программирования сразу после того, как появился. Я долго не решалась его попробовать. Причина этого была не в том, что это — просто некий очередной редактор кода. Дело было в том, что вся моя работа была отлично организована в Sublime.

Для меня понятия «работа» и «написание кода» — это одно и то же. И, по большому счёту, неважно, каким именно редактором я буду постоянно пользоваться. Но изменения — это всегда нелегко. После того, как я неделю поработала в VS Code, я обнаружила, что моя продуктивность сильно просела. Я сделала за это время меньше, чем сделала бы, пользуйся я чем-то привычным.

Это было так, отчасти, из-за того, что мне нужно было перестроиться, привыкнуть к новым инструментам. Нужно было выяснить то, какие команды мне пригодятся, нужно было запомнить полезные сочетания клавиш, изучить средства навигации по коду. И, вдобавок, надо было разобраться в том, какие расширения редактора мне понадобится установить для того, чтобы облегчить себе жизнь.

В итоге я снова вышла на высокую производительность. Вряд ли я снова затею переход на новый редактор. VS Code — это надёжный и нетребовательный к ресурсам инструмент. Вокруг него собралось мощное сообщество разработчиков расширений. Пожалуй это — одна из лучших разработок Microsoft.

Вот 10 возможностей VS Code, освоение которых помогло мне ускорить работу. Надеюсь, они пригодятся и вам.

1. Сниппеты

Использование сниппетов — это серьёзный способ повышения продуктивности программиста. Дело в том, что они помогают автоматизировать ручной труд. Поначалу использование сниппетов может выглядеть как нечто вроде читерства. Но после того как, разрабатывая Angular-приложение, много раз воспользуешься этим средством для ввода каркаса конструкции switch в коде сущности View , перестаёшь обращать внимание на такие мысли.

Программирование — это, в сущности, знание о том, где и как пользоваться некими паттернами. Сниппеты ускоряют работу из-за того, что облегчают доступ к заранее заготовленным фрагментам кода.

В результате программист может тратить больше времени на размышления о том, как некие конструкции сочетаются и как они работают вместе, а не на то, чтобы писать код этих конструкций. Знаю, это звучит странновато, но если у нас есть ограниченное количество времени на работу над неким проектом, то чем больше времени удастся уделить размышлениям о структуре и архитектуре кода — тем выше шансы того, что в итоге удастся создать что-то надёжное и поддающееся масштабированию.

Использование сниппетов, кроме того, может помочь программисту быстрее освоить некий фреймворк или некую библиотеку. Дело тут в том, что человеку приходится тратить меньше времени на то, чтобы понять причину некоей ошибки. То, что ему нужно, чаще оказывается работоспособным с первого раза.

Вот хорошее расширение, Angular Snippets, которое позволяет ускорить написание Angular-кода. При работе над проектами, основанными на React, я пользуюсь расширением ES7 React/Redux/GraphQL/React-Native snippets.

C Vue я пока не работала, но вот одно расширение, Vue 2 Snippets, которое, имея более 900 тысяч установок, выглядит многообещающим.

Процесс загрузки и установки расширений для VS Code можно начинать из браузера, но можно инициировать этот процесс и из интерфейса редактора. Для открытия панели, предназначенной для работы с расширениями, достаточно нажать на кнопку Extensions , выделенную на следующем рисунке.

Работа с расширениями в Visual Studio Code

2. IntelliSense

IntelliSense — это система автозавершения кода. Она весьма интеллектуальна, что выгодно отличает её от других подобных систем.

Об IntelliSense говорят, как об одном из основных средств VS Code, обеспечивающих высокую производительность труда. При этом многие, выбирающие VS Code, пользуются этой возможностью далеко не на полную мощность.

Если навести мышь на некий участок кода, IntelliSense покажет дополнительные сведения о типах и даст возможность добраться до сведений об источнике их описания. В то время как эта возможность может оказаться полезной при работе с незнакомыми сущностями, созданными другими людьми, основная ценность IntelliSense заключается в том, что эта система способна предсказывать действия программиста.

Работа с IntelliSense (источник)

Когда программист, например, вводит имя объекта и ставит после него точку, появляется выпадающий список с перечнем методов этого объекта. По мере того, как вводятся всё больше и больше букв имени метода, система фильтрует список. На определённом этапе ввода имени метода можно, клавишами-стрелками, выбрать нужное имя из довольно короткого списка, и нажать Enter для его вставки в код. Если сразу непонятно — какой именно метод нужен в данный момент — тут же можно взглянуть и на документацию.

Если в VS Code пришёл кто-то, кто пишет на Java или на C++, то всё это может и не показаться ему чем-то таким уж удивительным. Я видела нечто подобное, когда работала в Eclipse. Но в JavaScript-мире интеллектуальное автозавершение ввода — это возможность, достойная того, чтобы её заметили, и того, чтобы ей, ради значительного повышения скорости работы, пользовались.

3. Интегрированный терминал

Наличие в VS Code интегрированного терминала может помочь экономить время за счёт того, что программисту не приходится постоянно переключаться между окнами терминала и редактора. Это ещё значит и то, что в ходе автоматического запуска проекта очень легко замечать ошибки, не прерывая при этом своего обычного рабочего процесса.

Для того чтобы открыть терминал, можно воспользоваться сочетанием клавиш CTRL + ` (обратная галочка).

Терминал открывается для корневой директории текущего рабочего пространства.

Для открытия ещё одного окна терминала можно воспользоваться комбинацией клавиш CTRL + SHIFT + ` (всё та же обратная галочка).

Окно терминала в VS Code

4. Просмотр мест использования сущностей и их определений, рефакторинг

При работе над большим проектом некий класс, метод или свойство могут быть использованы в огромном количестве мест. VS Code позволяет узнать о том, где именно используются подобные сущности, быстро и эффективно собирая соответствующий список и демонстрируя его пользователю.

Для того чтобы увидеть такой список, достаточно щёлкнуть правой кнопкой мыши по методу, функции, или по чему-нибудь ещё, и выбрать в появившемся меню команду Peek References . Того же эффекта можно добиться, выделив нужный участок, и, на Windows-компьютере, воспользовавшись сочетанием клавиш SHIFT + F12 .

Команда Rename Symbol из того же меню позволяет переименовывать сущности. Это особенно полезно при рефакторинге, или тогда, когда оказывается, что имя чего-либо больше не соответствует его предназначению.

5. Средства форматирования кода и инструменты для управления техническим долгом

Форматирование кода может превратиться в настоящий кошмар. Тут, конечно, программисту могут помочь линтеры, но запускать их приходится за пределами редактора.

Средства для форматирования кода помогают ускорить процесс разработки и обеспечить определённый уровень единообразия кода. Это оказывается очень кстати для проектов, работой над которыми занимаются команды программистов, когда у каждого разработчика могут быть собственные представления о форматировании.

Средства форматирования кода часто основаны на определённых соглашениях. Они позволяет обеспечить единообразие оформления текстов программ. Например, речь идёт о правилах выравнивания кода, о расстановке скобок, и, в целом, о том, как выглядит код.

В то время как автоматическое форматирование способствует снижению количества споров, касающихся стиля текстов программ, и помогает улучшить внешний вид кода, оно никак не помогает избавляться от технического долга. Именно поэтому я рекомендую обратить внимание на расширение Tech Debt Tracker.

Средство для управления техническим долгом в действии (источник)

Tech Debt Tracker использует набор показателей для определения сложности кода и потенциального технического долга, который может быть связан с этим кодом. Данное расширение нацелено на JavaScript и TypeScript-код. Оно даёт разработчику рекомендации по поводу улучшения текстов программ и может помочь ему выработать у себя привычку писать чистый и читабельный код.

6. Клавиатурные сокращения

Каждый раз, когда программисту приходится убирать руки с клавиатуры, он теряет несколько секунд. Это удлиняет сроки работы над проектами. Хотя такие потери времени и могут показаться незначительными, надо отметить, что смены положения рук и переключения с клавиатуры на мышь может быть вполне достаточно для того, чтобы нарушить рабочий процесс и выдернуть человека из состояния потока.

Многие разработчики стремятся к тому, чтобы делать всё, что можно, с помощью клавиатуры. Просто потому, что это позволяет им работать быстрее.

Клавиатурные сокращения позволяют решать большинство задач только с помощью клавиатуры. Это означает, что меньше времени тратится на поиск нужных команд в меню, что помогает программисту быстрее достигать своих целей.

Панель клавиатурных сокращений можно посмотреть, воспользовавшись комбинацией клавиш CTRL + K + S .

Панель клавиатурных сокращений в VS Code

Если кому-то не хочется изучать совершенно новый набор «горячих клавиш», он может создать такой список сам или импортировать клавиатурные сокращения из других популярных редакторов. Возможности гибкой настройки клавиатурных сокращений позволяют тем, кто уже к чему-то привык, быстрее достичь высокой продуктивности работы в VS Code.

Здесь можно найти расширения, которые помогают настраивать клавиатурные сокращения в VS Code.

7. Дзен-режим

Кто не любит работать, не отвлекаясь ни на что постороннее? В дзен-режиме (zen mode) VS Code переводится в полноэкранный режим, из интерфейса исчезает всё, что может отвлечь от работы с кодом. Для перевода редактора в этот режим нужно выполнить особую последовательность действий. А именно, тут используется не сочетание клавиш, а скорее — последовательность сочетаний клавиш. Для того чтобы выяснить, как именно дзен-режим включается у вас — загляните в панель клавиатурных сокращений и поищите по слову zen .

В моём случае для включения дзен-режима используется следующая последовательность сочетания клавиш: сначала — CTRL + Z , и сразу после этого — K . То есть — для перехода в этот режим я сначала нажимаю клавиши CTRL + Z , отпускаю их, а потом нажимаю и отпускаю K . У вас это может выглядеть иначе. Например — как CTRL + K и Z .

Дзен-режим помогает поддерживать состояние потока, избавляя программиста от любых потенциальных отвлекающих факторов.

8. Git

Прямо из VS Code можно делать коммиты в Git-репозитории. Как оказалось, VS Code очень хорошо поддерживает Git. А именно, тут можно готовить к коммитам изменённые файлы, делать коммиты, откатывать изменения, делать комментарии. В общем — всё, что обычно делается средствами командной строки, можно сделать, не покидая редактора.

Тут вам понадобится панель Source Control , открываемая соответствующей кнопкой, расположенной в левой части экрана. Например, для подготовки изменённого файла к коммиту можно воспользоваться кнопкой со знаком + , находящейся в верхней части этой панели. После этого можно вызвать контекстное меню этого файла и найти в нём дополнительные команды.

Хотя всё это можно сделать и в консоли, и воспользовавшись настольным приложением GitHub, возможность работать с Git, не покидая редактора, может помочь в повышении производительности труда программиста.

Тут, опять же, всё дело в сохранении состояния потока. Программист, работая с Git, не покидает привычной рабочей среды. Ему не нужно переключаться между терминалом и редактором, не нужно постоянно думать о том, что где находится. Всё, что нужно для решения различных задач, всегда у него под рукой.

Существуют расширения для VS Code, автоматизирующие разные аспекты работы с системами контроля версий. Например, расширение GitLens позволяет получать подробности о репозиториях. Скажем — о том, кто внёс какое изменение в код, о том, какие изменения подготовлены к коммиту, а какие — нет. Это расширение умеет аннотировать код, давая доступ к сведениям из системы контроля версий.

Например — к таким, как время коммита и изменения, внесённые коммитом в проект. GitLens — это инструмент, который особенно полезен при командной работе над проектами.

9. Отладчик

В VS Code имеется отладчик, который позволяет запускать код и устанавливать в нём точки останова, указывая те места, в которых выполнение программы должно быть приостановлено. Это позволяет, не покидая редактора, отлаживать программы, анализируя их внутреннее состояние во время их выполнения.

Отладка — это нечто большее, нежели вывод сообщений в консоль инструментов разработчика Chrome. В ходе отладки можно узнавать о том, что происходит внутри программы и, в результате, обнаруживать и устранять источники самых разных проблем. Если у программиста, например, есть подозрения по поводу правильности работы некоей функции, он может, в ходе отладки, выполнить эту функцию в пошаговом режиме, исследуя в ходе этого процесса состояние программы.

Для того чтобы приступить к отладке программы, нужно открыть панель отладки. Для этого можно воспользоваться кнопкой Debug , которая находится в левой части окна программы.

Кнопка Debug и панель отладки

Для запуска отладки надо нажать на кнопку Start Debugging , которая находится в верхней части панели отладки. В ходе отладки можно работать с окном консоли, открываемом в нижней части окна программы.

По умолчанию VS Code использует для запуска отлаживаемого кода среду Node.js, но можно сделать так, чтобы для отладки использовался бы отладчик браузера Google Chrome. В целом, можно отметить, что отладка кода — это режим работы, в котором можно обнаружить источники проблем, которые очень непросто найти при обычном выполнении кода.

10. Совместная работа над проектами в режиме реального времени

Вам когда-нибудь доводилось редактировать в Google Docs документ вместе с кем-нибудь другим? Расширение Live Share даёт, в сущности, те же возможности, но в применении к работе над программами. Связь между теми, кто работает в таком режиме, устанавливается через учётные записи GitHub или Azure.

Возможность совместной работы над проектами в режиме реального времени может оказаться крайне полезной в командной разработке. Она позволяет быстрее устранять ошибки, помогает заниматься парным программированием и ускоряет разработку.

Итоги

Эффективность разработчика зависит не только от того, как хорошо он умеет программировать. Она зависит ещё и от того, насколько глубоко он знает используемые им инструменты.

VS Code — это фантастический пример бесплатного опенсорсного приложения, которое способно помочь всем желающим в деле оптимизации и ускорения работы. Поэтому тому, кто заинтересован в том, чтобы извлечь из VS Code максимум полезностей, стоит как можно лучше изучить этот редактор.

Хотя ни один инструмент не способен помешать появлению плохо написанного кода, в VS Code можно найти достаточно средств, включая стандартные возможности и расширения, которые могут помочь программисту в повышении качества его кода.

Уважаемые читатели! Чем вы пользуетесь для написания кода?

Источник: habr.com

Отладка JavaScript для начинающих

В последние несколько лет благодаря появлению различных библиотек, таких как jQuery и Prototype, JavaScript завоевал лидирующее место среди языков для создания скриптов для веб проектов. Растущая популярность и простота использования привела к появлению полноценных приложений, например, Gmail, которые содержат тысячи строк JavaScript, выдвигающих к команде разработчиков повышенные требования к уровню владения инструментарием.

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

В данном уроке проводится краткий обзор возможностей современных инструментов разработчиков, которые помогают сделать отладку JavaScript кода более простым процессом. Основное внимание будет уделяться возможностям браузера Chrome и дополнения Firebug для FireFox, но большинство описанных функций доступны и в других инструментах, например, Dragonfly для Opera.

Консоль — общий взгляд

В большинстве программ для разработчиков самым лучшим другом программиста будет консоль . Многоцелевая панель используется для журналирования сообщений об ошибках, проверки DOM, отладки кода JavaScript и множества других задач. В зависимости от браузера консоль вызывается разными командами (кроме прямого выбора через меню):

• в браузере Chrome и Dragonfly для Opera – Ctrl + Shift + I
• Firebug — F12

Консоль автоматически выводит ошибки в коде, которые выявляются в ходе выполнения скрипта. Файл и строка указываются рядом с ошибкой, а нажатие клавиши мыши на ошибке перемещает фокус ввода в соответствующее ей место.

Данные выводим в консоль

Консоль может не только показывать ошибки в коде скрипта. С помощью Console API и Command Line API можно управлять выводом данных в консоль. Самая известная и полезная команда .log().

При разработке кода формы очень полезно знать значения переменных, чтобы проверять правильность работы кода. Обычной практикой является использование функции alert() для визуального контроля. Однако, использование такого метода блокирует выполнение остальной части кода до нажатия кнопки в окне диалога.

Современным решением является использование метода console.log, который выводит значения переменных на панель консоли:

console.log(“Captain’s Log”); // выводит “Captain’s Log” в панель консоли

Метод можно использовать для вывода вычисленных значений:

function calcPhotos() < total_photos_diff = total_photos — prev_total_photos; // Выводим значения переменных в консоль console.log(total_photos_diff); >

Преимуществом такого подхода по сравнению с методом использования диалога alert() является то, что выполнение кода не прерывается, и разработчик может несколько раз выводить значения переменных для наблюдения за изменениями данных в реальном времени.

var t = 3, p = 1; function calcPhotos(total_photos, prev_total_photos) < var total_photos_diff = total_photos — prev_total_photos; // Выводим значения в консоль console.log(total_photos_diff); // Обновляем значения t = t*1.3; p = p*1.1; >setInterval(function() < calcPhotos(t,p); >,100);

Выделение сообщений

В выше приведенном примере цикл будет выводить много значений переменных в консоль. Однако, часто бывает удобно визуально разделять различные данные, чтобы эффективно выделять в коде места, требующие повышенного внимания. Для решения таких задач Console API имеет несколько методов.

console.info(): выводит иконку «информация» и выделяет цветом представляемую информацию. Данный метод удобно использовать для предупреждения о различных событиях.

console.warn(): выводит иконку «предупреждение» и выделяет цветом представляемую информацию. Удобно использовать для информации о выходе параметров за рамки ограничений.

console.error(): выводит иконку «ошибка» и выделяет цветом представляемую информацию. Удобно использовать для представления информации об ошибках и критических условиях.

Примечание: инструмент разработчика Chrome не имеет средств для различного представления информации в консоли.

Группировка вызовов метода .log()

Использование различных методов для вывода информации в консоль позволяет представить данные в наглядном виде. Представление информации можно улучшить с помощью объединения в блоки. Используется метод console.group():

// Первая группа console.group(«Photo calculation»); console.info(«Total difference is now » + total_photos_diff); console.log(total_photos_diff); console.groupEnd(); // Вторая группа console.group(«Incrementing variable»); console.log(«Total photos is now: » + t); console.log(«Prev total photos is now: » + p); console.groupEnd();