<section id="description">
  <p>У Chrome и Firefox есть отличные консоли JavaScript, также известные как DevTools, для отладки вашего JavaScript.
    Инструменты разработчика можно найти в меню Chrome или в веб-консоли в меню FireFox (Так же можно нажать F12 или
    Ctrl+Shift+i).
  </p>
  <p>
    Если вы используете другой
    браузер или мобильный телефон, настоятельно рекомендуем перейти на настольный Firefox или Chrome.
  </p>
  <p>
    Метод
    <code>console.log()</code> , который «печатает» вывод того, что находится в его круглых скобках на консоли, скорее
    всего, станет наиболее полезным инструментом отладки. Размещение его в стратегических точках вашего кода может
    показывать промежуточные значения переменных. Хорошая практика - иметь представление о том, что должен делать вывод,
    прежде чем смотреть на то, что это такое. Наличие контрольных точек для просмотра состояния ваших вычислений в вашем
    коде поможет сузить проблему. Вот пример печати «Hello world!». на консоль:
    <pre class="language-js"><code>console.log('Hello world!');</code></pre>
  </p>

  <p><b>Подсказка: </b> В console.log можно передавать сколько угодно аргументов. К примеру, можно так:
  <pre class="language-js"><code>const x = 5;
  const y = 10;
  const z = x * y;
  console.log('x:', x, 'y:', y, 'z:', z); // x: 5 y: 10 z: 50</code></pre>
  </p>
</section>

Use the JavaScript Console to Check the Value of a Variable

<section id="description">
<p>Возможно, вы заметили, что некоторые проблемы с JavaScript для FreeCodeCamp включают в себя собственную консоль. Эта консоль ведет себя несколько иначе, чем консоль браузера, которую вы использовали в последнем вызове. Следующая задача состоит в том, чтобы выделить некоторые различия между консолью freeCodeCamp и консолью браузера. Во-первых, консоль браузера. Когда вы загружаете и запускаете обычный файл JavaScript в своем браузере, операторы <code>console.log()</code> будут печатать именно то, что вы им сообщаете, чтобы печатать на консоль браузера точное количество запрошенных вами запросов. В текстовом редакторе в браузере этот процесс немного отличается и может сбивать с толку вначале. Значения, переданные в <code>console.log()</code> в блоке текстового редактора, запускают каждый набор тестов, а также еще одно время для любых вызовов функций, которые у вас есть в коде. Это поддается некоторому интересному поведению и может начать вас в начале, потому что зарегистрированное значение, которое вы ожидаете увидеть только один раз, может распечатывать еще много раз в зависимости от количества тестов и значений, передаваемых этим тестам. Если вы хотите увидеть только свой единственный вывод и не беспокоиться о прохождении циклов тестирования, вы можете использовать <code>console.clear()</code> .</p></section>

Understanding the Differences between the freeCodeCamp and Browser Console

<section id="description">
<p>Вы можете использовать <code>typeof</code> для проверки структуры данных или типа переменной. Это полезно при отладке при работе с несколькими типами данных. Если вы считаете, что добавляете два числа, но на самом деле это строка, результаты могут быть неожиданными. Ошибки типа могут скрываться при вычислениях или вызовах функций. Будьте особенно внимательны, когда вы обращаетесь к внешним данным и работаете с ними в виде объекта JavaScript Object Notation (JSON). Вот несколько примеров с использованием <code>typeof</code> : <pre class="language-js"><code>console.log (typeof ""); // выводит "string"
console.log (typeof 0); // выводит "number"
console.log (typeof []); // выводит "object"
console.log (typeof {}); // выводит "object" </code></pre> 
JavaScript распознает шесть примитивных (неизменных) типов данных: <code>Boolean</code> , <code>Null</code> , <code>Undefined</code> , <code>Number</code> , <code>String</code> и <code>Symbol</code> (новый с ES6) и один тип для изменяемых элементов: <code>Object</code> . </p>
<p>
Обратите внимание, что в JavaScript массивы являются технически типом объекта. Более подробно об этом в статье <a href="https://freecode.academy/topics/javascript.-massiv-eto-tozhe-obekt." target="_blank">Массив - это тоже объект</a></p></section>

Use typeof to Check the Type of a Variable

<section id="description">
<p>Методы <code>console.log()</code> и <code>typeof</code> - это два основных способа проверки промежуточных значений и типов вывода программы.
Теперь пора перейти к общим формам, которые принимают ошибки. Одна проблема синтаксического уровня, с которой могут
согласиться быстрые печатники, - это скромная орфографическая ошибка.
</p>
<p>
Транспонированные, пропущенные или неправильно написанные символы в имени переменной или функции заставят браузер искать
несуществующий объект и пожаловаться в виде справочной ошибки. Имена переменных и функций JavaScript чувствительны к
регистру.</p></section>

Catch Misspelled Variable and Function Names

<section id="description">
<p>Еще одна синтаксическая ошибка, о которой следует помнить, заключается в том, что все открывающие круглые скобки,
фигурные скобки и кавычки имеют закрывающую пару. Забывание части обычно происходит, когда вы редактируете существующий
код и вставляете элементы с одним из парных типов. Также будьте осторожны при вложении блоков кода в другие, например,
при добавлении функции обратного вызова в качестве аргумента метода.
</p><p>
Один из способов избежать этой ошибки - сразу же включить закрывающее совпадение при вводе первого символа, затем
переместить курсор между ними и продолжить кодирование. К счастью, большинство современных редакторов кода автоматически
генерируют вторую половину пары.</p></section>

Catch Unclosed Parentheses, Brackets, Braces and Quotes

<section id="description">
<p>JavaScript позволяет использовать как одинарные ('), так и двойные (") кавычки для объявления строки. Решение, какую из
них использовать, обычно сводится к личным предпочтениям, за некоторыми исключениями.
</p><p>
Наличие двух вариантов отлично, когда в строке есть сокращения или другой фрагмент текста, заключенный в кавычки. Только
будьте осторожны, чтобы не закрыть строку слишком рано, что приведет к синтаксической ошибке.
</p><p>
Вот несколько примеров смешивания цитат:</p>

<pre class="language-js"><code>const grouchoContraction = "I've had a perfectly wonderful evening, but this wasn't it.";

const quoteInString = "Groucho Marx once said 'Quote me as saying I was mis-quoted.'";

const uhOhGroucho = 'I've had a perfectly wonderful evening, but this wasn't it.';</code></pre>

<p>Первые два верны, а третий неверен.
</p>
<p>
Конечно, можно использовать только один стиль цитат. Вы можете избежать кавычек внутри строки, используя escape-символ
обратной косой черты (\):</p>

<pre class="language-js"><code>const allSameQuotes = 'I\'ve had a perfectly wonderful evening, but this wasn\'t it.';</code></pre>
</section>

Catch Mixed Usage of Single and Double Quotes

<section id="description">
<p>Ветвящиеся программы, то есть те, которые выполняют разные вещи, если выполняются определенные условия, полагаются на <code>if</code> , <code>else if</code> и <code>else</code> в JavaScript. 
</p>
<p>
Условие иногда принимает форму проверки того, равен ли результат равному значению. Эта логика произносится (по крайней мере, на английском языке) как «если x равно y, тогда ...», которая может буквально перевести на код с помощью оператора <code>=</code> или присваивания. Это приводит к непредвиденному потоку управления в вашей программе. Как описано в предыдущих задачах, оператор присваивания ( <code>=</code> ) в JavaScript присваивает значение имени переменной. И операторы <code>==</code> и <code>===</code> проверяют равенство (тройные <code>===</code> тесты для строгого равенства, что означает как значение, так и тип). Приведенный ниже код присваивает <code>x</code> равному 2, который оценивается как <code>true</code> . Почти каждое значение само по себе в JavaScript оценивается как <code>true</code> , кроме тех, которые известны как «ложные» значения: <code>false</code> , <code>0</code> , <code>""</code> (пустая строка), <code>NaN</code> , <code>undefined</code> и <code>null</code>. 
<pre class="language-js"><code>let x = 1;
let y = 2;
if (x = y) {

} else {

}</code></pre>
</p>

<p>
  В этом примере блок кода в операторе <code>if</code> будет выполняться для любого значения <code>y</code>, если <code>y</code> не является ложным. Блок <code>else</code>,
  который мы ожидаем запустить здесь, на самом деле не будет выполняться.
</p>
</section>

Catch Use of Assignment Operator Instead of Equality Operator

<section id="description">
<p>Если функция или метод не принимает никаких аргументов, вы можете забыть включить (пустые) открывающую и закрывающую
круглые скобки при их вызове. Часто результат вызова функции сохраняется в переменной для другого использования в вашем
коде. Эту ошибку можно обнаружить, записав значения переменных (или их типы) в консоль и увидев, что одна из них
установлена на ссылку на функцию, а не на ожидаемое значение, возвращаемое функцией.
</p>
<p>
Переменные в следующем примере разные:</p>

<pre class="language-js"><code>function myFunction() {
  return "You rock!";
}
let varOne = myFunction;
let varTwo = myFunction();</code></pre>


<p>Здесь <code>varOne</code> - это функция <code>myFunction</code>, а <code>varTwo</code> - это результат выполнения функции <code>myFunction</code>, то есть строка <code>You rock!</code>.</p>
</section>

Catch Missing Open and Closing Parenthesis After a Function Call

<section id="description">
<p>Продолжая обсуждение вызова функций, следующая ошибка, на которую следует обратить внимание, - это когда аргументы
функции передаются в неправильном порядке. Если аргументы имеют разные типы, например функцию, ожидающую массив и целое
число, это, скорее всего, вызовет ошибку времени выполнения. Если аргументы одного типа (например, все целые числа), то
логика кода не будет иметь смысла. Убедитесь, что вы указали все необходимые аргументы в правильном порядке, чтобы
избежать этих проблем.</p></section>

Catch Arguments Passed in the Wrong Order When Calling a Function

<section id="description">
<p>Ошибки <em>Off by One</em> (иногда называемые <em>OBOE</em>) возникают, когда вы пытаетесь настроить таргетинг на конкретный индекс строки
или массива (чтобы разрезать или получить доступ к сегменту) или при циклическом обходе их индексов. Индексирование
JavaScript начинается с нуля, а не с единицы, что означает, что последний индекс всегда на единицу меньше длины
элемента. Если вы попытаетесь получить доступ к индексу, равному длине, программа может выдать ошибку ссылки «индекс вне
допустимого диапазона» или напечатать <code>undefined</code>.
</p>
<p>
Когда вы используете строковые методы или методы массива, которые принимают диапазоны индексов в качестве аргументов,
это помогает прочитать документацию и понять, являются ли они включающими (элемент по данному индексу является частью
того, что возвращается) или нет. Вот несколько примеров ошибок отключения по одному:</p>

<pre class="language-js"><code>let alphabet = "abcdefghijklmnopqrstuvwxyz";
let len = alphabet.length;

for (let i = 0; i <= len; i++) { 
  console.log(alphabet[i]); 
} 

for (let j=1; j < len; j++) { 
  console.log(alphabet[j]); 
}

for (let k=0; k < len; k++) { 
  console.log(alphabet[k]); 
}</code></pre>

<p>В первом примере цикл повторяется слишком много раз, а во втором цикле слишком мало (отсутствует первый индекс, 0).
Третий пример верен.</p>
</section>

Catch Off By One Errors When Using Indexing

<section id="description">
<p>Иногда необходимо сохранить информацию, увеличить счетчики или переустановить переменные внутри цикла. Потенциальная
проблема заключается в том, что переменные либо должны быть повторно инициализированы, а не инициализированы, либо
наоборот. Это особенно опасно, если вы случайно сбросите переменную, используемую для терминального условия, что вызовет
бесконечный цикл.
</p>
<p>
Печать значений переменных с каждым циклом вашего цикла с помощью <code>console.log()</code> может выявить ошибочное поведение,
связанное со сбросом или невозможностью сбросить переменную.</p></section>

Use Caution When Reinitializing Variables Inside a Loop

<section id="description">
<p>Последняя тема - ужасный бесконечный цикл. Циклы - отличные инструменты, когда вам нужно, чтобы ваша программа запускала
блок кода определенное количество раз или до тех пор, пока не будет выполнено условие, но им нужно конечное условие,
которое завершает цикл. Бесконечные циклы могут привести к зависанию или сбою браузера и вызвать общий беспорядок при
выполнении программы, который никому не нужен.
</p>
<p>
Во введении к этому разделу был пример бесконечного цикла - у него не было конечного условия для выхода из цикла while
внутри loopy (). НЕ вызывайте эту функцию!</p>
<pre class="language-js"><code>function loopy() {
  while(true) {
    console.log("Hello, world!");
  }
}</code></pre>

<p>Задача программиста - убедиться, что условие терминала, которое сообщает программе, когда следует выйти из кода цикла, в
конечном итоге будет достигнуто. Одна из ошибок заключается в увеличении или уменьшении значения переменной счетчика в
неправильном направлении от конечного условия. Другой - случайно сбрасывает счетчик или индексную переменную в коде
цикла, вместо того, чтобы увеличивать или уменьшать ее.</p>
</section>