To‘xtash nuqtalari

ULASHISH

To‘xtash nuqtalari, kuzatish, ko‘rinish doirasi

Breakpoints JavaScript-ni to‘xtatib turish va haqiqatda nima sodir bo‘layotganini tekshirish imkonini beradi.

Bu konsoldan foydalangandan keyin eng kuchli debug usuli.

Breakpoint nima

Breakpoint (to‘xtash nuqtasi) kod bajarilishini ma’lum bir qatorda to‘xtatib turadi.

Kod to‘xtaganda o‘zgaruvchilarni tekshirishingiz va kodni satrma-satr bajarib borishingiz mumkin.

Breakpoint’lar brauzerning dasturchi vositalari (developer tools) ichida o‘rnatiladi.

To‘xtash nuqtalaridan foydalanganda siz qiymatlarni taxmin qilmaysiz.

Siz ularni ko‘rasiz.


Breakpoint o‘rnatish

Tuzatish oynasida siz JavaScript kodida to‘xtash nuqtalarini o‘rnatishingiz mumkin.

Har bir to‘xtash nuqtasida JavaScript ishlashni to‘xtatadi va sizga JavaScript qiymatlarini tekshirish imkonini beradi.

Qiymatlarni ko‘rib chiqqandan so‘ng kod bajarilishini davom ettirishingiz mumkin (odatda play tugmasi bilan).

Misol

function add(a, b) {
  let result = a + b;
  return result;
}

document.getElementById("demo").innerHTML = add(10, 5);
document.getElementById("demo").innerHTML = add(10, 50);
document.getElementById("demo").innerHTML = add(10, 500);
document.getElementById("demo").innerHTML = add(10, 5000);
O‘zingiz sinab ko‘ring »

F12 bilan brauzer ishlab chiquvchi vositalarini oching va Manbalar yorlig‘iga o‘ting.

To‘xtash nuqtalarini qo‘shish uchun skriptingizdagi qator raqamlarini bosing.

To‘xtash nuqtasini ishga tushirish uchun sahifani qayta yuklang.

Kodingizni qatorma-qator ishga tushirish uchun o‘ynash tugmasidan foydalaning.


debugger kalit so‘zi

debugger kalit so‘zi JavaScript bajarilishini to‘xtatadi va (agar mavjud bo‘lsa) debug qilish funksiyasini chaqiradi.

Bu tuzatuvchida to‘xtash nuqtasini o‘rnatish bilan bir xil funksiyaga ega.

Agar nosozliklarni tuzatish mavjud bo‘lmasa, tuzatuvchi operatori ta’sir qilmaydi.

Tuzatish vositasi yoqilgan bo‘lsa, ushbu kod uchinchi qatorni bajarishdan oldin ishlashni to‘xtatadi.

Misol

let x = 15 * 5;
debugger;
document.getElementById("demo").innerHTML = x;
O‘zingiz sinab ko‘ring »

Batafsil ma’lumot

console.log() usuli haqida JavaScript Console Reference sahifamizda batafsil o‘qing.


Kodni qadamma-qadam bajarish

Bajarish to‘xtatilganda siz kod qanday ishlashini boshqarishingiz mumkin.

  • Step Over keyingi qatorni bajaradi.
  • Step Into funksiya ichiga kiradi.
  • Step Out joriy funksiyadan chiqadi.

Sekin qadam tashlang va qadriyatlar qanday o‘zgarishini kuzating.


Scope paneli

Scope paneli joriy satrda qaysi o‘zgaruvchilar mavjudligini ko‘rsatadi.

Bu o‘zgaruvchilar qaerda yashashini tushunishga yordam beradi.

  • Local o‘zgaruvchilar funksiya ichida mavjud bo‘ladi.
  • Global variables exist everywhere.

Misol:

let x = 10;

function test() {
  let y = 5;
  console.log(x + y);
}

test();

To‘xtash nuqtasida y faqat funksiya ichida mavjud.


O‘zgaruvchilarni kuzatish

Watch paneli o‘zgaruvchilar qiymatlarini real vaqtda kuzatish imkonini beradi.

Bu qiymatlar ko‘p marta o‘zgarganda foydalidir.

Watch paneliga o‘zgaruvchi nomini qo‘shing.

Kod orqali qadam bosganingizda qiymat avtomatik ravishda yangilanadi.

Watch variables instead of adding many console.log() calls.


Boshlanuvchilar uchun keng tarqalgan xatolar

Yangi boshlovchilar ko‘pincha breakpoint qo‘shgandan keyin sahifani qayta yuklashni unutishadi.

Sikllar ichidagi breakpoint’lar ko‘p marta ishga tushishi mumkin.

Agar bajarilish qayta-qayta to‘xtasa, breakpoint’ni vaqtincha o‘chirib qo‘ying.


To‘xtash nuqtalaridan qachon foydalanish kerak

  • Qiymatlar kutilmaganda o‘zgarganda.
  • Kod ishlasa-yu, lekin noto‘g‘ri natija bersa.
  • Murakkab mantiqni debug qilishda.

Keyingi: keng tarqalgan xatolar izohi

Keyingi sahifada eng keng tarqalgan JavaScript xato xabarlari tushuntiriladi.

Ular nimani anglatishini va ularni qanday tuzatish kerakligini bilib olasiz.


W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!