<MyRusakov.ru />

JavaScript, jQuery и Ajax с Нуля до Гуру

JavaScript, jQuery и Ajax с Нуля до Гуру

Видеокурс "JavaScript, jQuery и Ajax с Нуля до Гуру" научит Вас "вдыхать жизнь" в страницы, делая их с потрясающими эффектами и максимальным удобством для пользователя.

Курс научит Вас писать скрипты на JavaScript, а также обучит использованию библиотеки jQuery и технологии Ajax.

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

Поэтому курс "JavaScript, jQuery и Ajax с Нуля до Гуру" Вам просто необходим, если Вы хотите создавать по-настоящему достойные сайты.

Подробнее
Подписка

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

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

Мой аккаунт Мой аккаунт Моя группа
Опрос

Каким движком Вы предпочитаете пользоваться?

Как найти ошибку в JavaScript

Как найти ошибку в JavaScript

Мне частенько присылают 50-100 строк кода JavaScript (или даже больше) и задают 1 вопрос: "Где здесь ошибка?" или "Почему не работает?". Когда мне то же самое присылают по PHP, то у меня есть статья: основной инструмент при поиске ошибок в коде, и он подходит для всех языков, но у JavaScript есть одна маленькая особенность при поиске ошибок. Вот о том, как найти ошибку в JavaScript, я и расскажу.

Вы должны знать, что есть синтаксические ошибки, а есть алгоритмические. Вот второй тип ошибок при помощи статьи, ссылку на которую я указал, без проблем решается. Только вместо echo надо использовать alert(). Но вот с синтаксическими ошибками возникают проблемы. Если другие языки сразу же показывают текст ошибок, то JavaScript не делает вообще ничего, как будто никакого скрипта и в помине нет.

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

  1. Комментируется весь код, оставляя лишь 1 верхнюю строчку.
  2. Вызывается alert() с любой строкой.
  3. Если alert() не появляется, значит, ошибка в верхней строчке.
  4. Если alert() появляется, надо расскоментировать ещё одну строчку и далее к пункту 2.
  5. И так до тех пор, пока не будет найдена ошибка.

Давайте разберём его на практике, допустим, надо найти ошибку в этом коде, который вообще никак не запускается:

var a = 15;
var b == 18;
alert(a + b);

Мы хотим увидеть 33, однако, не видим вообще ничего. Значит, где-то имеется синтаксическая ошибка. Следуем по моей инструкции, комментируя все строчки, кроме самой первой. И сразу после неё вызываем alert():

var a = 15;
alert("ABC");
/*var b == 18;
alert(a + b);*/

Запустив код, у нас сработает alert(), значит, в 1-й строчке ошибок нет. Двигаемся дальше, расскоментировав ещё одну строку, после которой вызываем alert():

var a = 15;
var b == 18;
alert("ABC");
/*alert(a + b);*/

После запуска обнаруживаем, что никакого alert() не сработало, значит, ошибка во 2-й строке. Приглядевшись, мы видим, что зачем-то использовали знак сравнения вместо знака присваивания. Исправив ошибку и расскоментировав весь код:

var a = 15;
var b = 18;
alert(a + b);

Мы получаем долгожданные 33. Надеюсь, Вы поняли методику. Безусловно, я долго описывал, на практике же это делается в течение максимум минуты в коде строк на 50.

Вот таким образом можно достаточно легко найти ошибку в коде JavaScript.

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (13):

katushka katushka 10.04.2013 20:56:23

Я правильно понимаю, нужно поместить весь код в комментарии, кроме одной строчки и вызвать alert() не важно с каким параметром, и так до тех пор, пока alert() перестанет работать, значит нужно искать ошибку в именно в этой строчке. ?

Ответить

Admin Admin 10.04.2013 21:34:41

Да, всё правильно.

Ответить

ghhgghhggh ghhgghhggh 10.04.2013 23:44:08

Спасибо как раз не давно искал ошибку)))

Ответить

AllaW AllaW 11.04.2013 09:52:07

Супер, просто и со вкусом! А нельзя ли поподробнее об этих расширениях из Firebug, которые эти синтаксические ошибки видят?

Ответить

sergkosm sergkosm 11.04.2013 20:48:34

Спасибо тебе за статью!!)

Ответить

Алек Алек 19.04.2013 11:09:57

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

Ответить

Дмитрий184 Дмитрий184 09.05.2013 05:04:58

Михаил! А можно ли использовать ваш метод поиска ошибок, если скрипт написан для jquery. Чтобы не просто посмотреть, работает скрипт или нет, но и чтоб найти ошибку в конкретном месте. Я попробовал вставить alert("ABC"); в между строк кода, но не работает. Firebug ошибки показывает.

Ответить

Admin Admin 09.05.2013 11:11:31

Можно использовать, и alert() там будет работать.

Ответить

Дмитрий184 Дмитрий184 09.05.2013 17:19:49

А почему у меня не срабатывает alert("ABC"); - ошибка в коде в строке с идентификатором $("#leto") - нет "точки" перед CSS. function pokaz1() { $("#zima").css("z-index","2"); $("#vesna").css("z-index","1"); alert("ABC"); $("#leto")css("z-index","1"); $("#ocen").css("z-index","1"); }

Ответить

Admin Admin 09.05.2013 20:58:45

Поставьте выше alert(), а всё остальное вообще закомментируйте.

Ответить

Дмитрий184 Дмитрий184 09.05.2013 23:20:36

Большое спасибо! С Вашей помощью разобрался, теперь работает - до строки с ошибкой в коде aleft() работает, а после ошибки alert() не работает.

Ответить

dedok41 dedok41 15.01.2014 15:07:11

Могу поделиться простеньким приемом. Он помогал мне раньше еще в прошлом тысячелетии. Во всех сомнительных местах расставляете отладочный вывод, где обычно проверяется содержимое переменных. Использовать лучше document.write. После проверки такой вывод комментируется, или переносится ниже по ходу программы, или просто удаляется. Программа всегда замолкает, если используемая переменная не определена, т.е. ей еще не присваивалось никакого значения. Чаще это связано с ошибками в идентификаторах. Не согласен с Русаковым, синтаксические ошибки рано или поздно обнаруживаются и легко исправляются. Другое дело ошибки логические, и совсем плохо, если ошибка в алгоритме задачи. И, наконец, главное при обнаружении ошибок - терпение, терпение и еще раз терпение.

Ответить

sergeyJS sergeyJS 25.02.2015 13:58:56

Простейший способ журналирования JS-ошибок - использовать сервисы аля http://t.onthe.io/js/errors/, http://trackjs.com, http://jslogger.com. Они в режиме реального времени покажут ошибки всех ваших посетителей, со срезами по браузерам. При этом нужно скопировать и вставить всего 1 строчку кода. Лично я использую первый сервис в виду его бесплатности.

Ответить

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.