Voy, men buni yana qildim: JavaScript-dagi keng tarqalgan xatolarni tuzatish

Voy, men buni yana qildim: JavaScript-dagi keng tarqalgan xatolarni tuzatish

JavaScript kodini yozish qiyin va ba'zan qo'rqituvchi bo'lishi mumkin, chunki ko'pchilik ishlab chiquvchilarga yaxshi tanish. Ish jarayonida xatolar muqarrar ravishda yuzaga keladi va ularning ba'zilari tez-tez takrorlanadi. Ajam ishlab chiquvchilarga qaratilgan ushbu maqola ushbu xatolar va ularni qanday hal qilish haqida gapiradi. Aniqlik uchun funktsiyalar, xususiyatlar va ob'ektlarning nomlari olingan mashhur qo'shiq. Bularning barchasi tez-tez uchraydigan xatolarni qanday tuzatish kerakligini tezda eslab qolishga yordam beradi.

Sizga eslatib o'tamiz: "Habr" ning barcha o'quvchilari uchun - "Habr" promo-kodidan foydalangan holda har qanday Skillbox kursiga yozilishda 10 000 rubl chegirma.

Skillbox tavsiya qiladi: Amaliy kurs "Mobil dasturchi PRO".

TypeError: xususiyat aniqlanmagan

let girl = {
    name: "Lucky",
    location: "Hollywood",
    profession: "star",
    thingsMissingInHerLife: true,
    lovely: true,
    cry: function() {
        return "cry, cry, cries in her lonely heart"
    }
}
console.log(girl.named.lucky)

Yuqoridagi misol kodida Uncaught TypeError xatosi paydo bo'ladi: undefined ning "baxtli" xususiyatini o'qib bo'lmaydi. Muammo shundaki, qiz ob'ekti nom xususiyatiga ega bo'lsa-da, nomli xususiyatga ega emas. Va girl.namemed mulki aniqlanmaganligi sababli, siz unga kira olmaysiz, chunki rasmiy ravishda u mavjud emas. Ammo qiz.named.lucky ni qiz.name bilan almashtirsangiz, unda hamma narsa ishlaydi va dastur Lucky qaytib keladi.

Xususiyatlari haqida ko'proq bilib olishingiz mumkin bu erda o'qing.

TypeErrors qanday hal qilinadi

TypeErrors dasturchi ma'lum bir turga mos kelmaydigan ma'lumotlar ustida amallarni bajarishga harakat qilganda yuzaga keladi. Misollar: .bold() dan foydalanish, aniqlanmagan xususiyatni so'rash yoki aslida funktsiya bo'lmagan funksiyani chaqirish.

Shunday qilib, qiz() ga qo'ng'iroq qilmoqchi bo'lsangiz, Uncaught TypeError xatosiga duch kelasiz: yourVariable.bold funksiya emas va qiz funksiya emas, chunki u aslida funksiya emas, chaqirilayotgan ob'ektdir.

Xatolarni bartaraf etish uchun siz o'zgaruvchilarni o'rganishingiz kerak. Xo'sh, qiz nima? girl.named nima? Buni kodni tahlil qilish, console.log, tuzatuvchi buyrug'i yordamida o'zgaruvchilarni ko'rsatish yoki konsoldagi o'zgaruvchi nomini chaqirish orqali bilib olishingiz mumkin. O'zgaruvchida mavjud bo'lgan ma'lumotlar turida ishlash mumkinligiga ishonch hosil qilishingiz kerak. Agar u mos kelmasa, uni o'zgartiring, masalan, shart qo'shing yoki harakat qiling..catch bloki - va operatsiya bajarilishi ustidan nazoratni qo'lga kiriting.

Stack Overflow

Agar siz Baby One More Time qo'shig'ining so'zlari mualliflariga ishonsangiz (bu Britni Spirs, ha), unda bu kontekstdagi hit so'zi qo'shiqchining yana chaqirilishini xohlashini anglatadi (bu erda qo'shiqning kontekstining tushuntirishi. qo'shiq - tarjimonning eslatmasi). Ehtimol, bu istak haqiqiy hayotda qo'ng'iroqlar sonining ko'payishiga olib keladi. Ammo dasturlashda bu qo'ng'iroqlar to'plami to'lib ketganda xatolikka olib kelishi mumkin bo'lgan rekursiyadir.

Xatolar quyidagicha ko'rinadi:

Xato: stekda boʻsh joy yoʻq (chet)
Ichki xato: juda ko'p rekursiya (Firefox)
RangeError: qo‘ng‘iroqlar to‘plamining maksimal hajmi oshib ketdi (Chrome)

Agar ishlab chiquvchi rekursiyada asosiy holatni hisobga olmasa yoki kod mo'ljallangan holatga murojaat qilmasa, stekning to'lib ketishi sodir bo'ladi.

function oneMoreTime(stillBelieve=true, loneliness=0) {
    if (!stillBelieve && loneliness < 0) return
    loneliness++
    return oneMoreTime(stillBelieve, loneliness)
}

Bunday holda, stillBelieve hech qachon yolg'on bo'lishi mumkin emas, shuning uchun har safar oneMoreTime chaqiriladi, lekin funksiya hech qachon tugamaydi.

Agar siz ikkita do'stingizga tayanishni boshlasangiz, bu yolg'izlikni kamaytiradi va siz qo'ng'iroqni kutishingizga to'g'ri kelmaydi.

function oneMoreTime(stillBelieve=true, loneliness=0) {
    if (!stillBelieve && loneliness < 0) return
    loneliness--
    stillBelieve = false
    return oneMoreTime(stillBelieve, loneliness)
}

Bunga misol, cheksiz aylanishlarga ega bo'lgan holatlar, tizim xato xabarini yaratmasa, lekin JavaScript kodi bajarilgan sahifa shunchaki muzlatib qo'yadi. Bu while siklida tugatish sharti bo'lmasa sodir bo'ladi.

let worldEnded = false
 
while (worldEnded !== true) {
  console.log("Keep on dancin' till the world ends")
}

Muammoni quyidagicha hal qilishingiz mumkin:

let worldEnded = false
 
while (worldEnded !== true) {
  console.log("Keep on dancin' till the world ends")
  worldEnded = true
}

Cheksiz tsikllar va rekursiyalarni tuzatish

Agar sizda cheksiz aylanish muammosi bo'lsa, Chrome yoki Edge-da yorliqni yopishingiz va Firefox-da brauzer oynasini yopishingiz kerak. Shundan so'ng siz kodni diqqat bilan tahlil qilishingiz kerak. Muammoni topa olmasangiz, loop yoki funksiyangizga tuzatuvchi buyrug'ini qo'shib, o'zgaruvchilar qiymatlarini tekshirishga arziydi. Agar natija kutilgan narsaga mos kelmasa, biz uni almashtiramiz, buni osongina qilish mumkin.

Yuqoridagi misolda tuzatuvchi funksiya yoki tsiklning birinchi qatori sifatida qo'shilishi kerak. Keyin Chrome brauzerida disk raskadrovka yorlig'ini ochishingiz kerak, bu o'zgaruvchilarni ko'lamda tahlil qiladi. Keyingi tugma yordamida siz har bir iteratsiya bilan ularning o'zgarishlarini kuzatishingiz mumkin. Bularning barchasini qilish oson va ko'p hollarda muammo topiladi.

Bularning barchasi haqida bu erda o'qishingiz mumkin (Chrome uchun) va bu erda (Firefox uchun).

Sintaksis xatosi

JavaScript-dagi eng keng tarqalgan xatolardan biri bu SyntaxError. Matn muharriri kengaytmalari ulardan qochishingizga yordam beradi. Masalan, Bracket Pair Colorizer koddagi qavslarni turli ranglar bilan belgilaydi va Prettier yoki shunga o'xshash tahlil vositasi xatolarni tezda topish imkonini beradi. SyntaxError ehtimolini kamaytirishning eng yaxshi varianti minimal joylashtirishdir.

Izohlarda baham ko'ring: xatolarni oldini olish yoki ularni tezda aniqlash va yo'q qilish uchun nima qilasiz?

Skillbox tavsiya qiladi:

Manba: www.habr.com

a Izoh qo'shish