ProHoster > Блог > интернет мэдээ > Уучлаарай, би үүнийг дахин хийлээ: JavaScript дахь нийтлэг алдааг дибаг хийж байна

Уучлаарай, би үүнийг дахин хийлээ: JavaScript дахь нийтлэг алдааг дибаг хийж байна

Уучлаарай, би үүнийг дахин хийлээ: JavaScript дахь нийтлэг алдааг дибаг хийж байна

JavaScript код бичих нь маш хэцүү, заримдаа бүр айдас төрүүлдэг тул олон хөгжүүлэгчид мэддэг. Ажлын явцад алдаа гарах нь гарцаагүй бөгөөд зарим нь байнга давтагддаг. Шинэхэн хөгжүүлэгчдэд зориулсан энэхүү нийтлэл нь эдгээр алдаа, тэдгээрийг хэрхэн шийдвэрлэх талаар өгүүлдэг. Тодорхой болгохын тулд функц, шинж чанар, объектын нэрийг авсан болно алдартай дуу. Энэ бүхэн нь нийтлэг алдааг хэрхэн засахаа хурдан санахад тусална.

Бид танд сануулж байна: "Хабр" -ын бүх уншигчдад - "Habr" сурталчилгааны кодыг ашиглан Skillbox-ын аль ч курст бүртгүүлэхдээ 10 рублийн хөнгөлөлт.

Skillbox зөвлөж байна: Практик курс "Мобайл хөгжүүлэгч PRO".

TypeError: шинж чанар тодорхойгүй байна

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)

Дээрх жишээ код нь Uncaught TypeError: Undefined-ийн 'азтай' шинж чанарыг уншиж чадахгүй байна гэсэн алдаа гаргадаг. Асуудал нь охин объект нь нэртэй шинж чанартай хэдий ч нэртэй өмчгүй байдаг. Мөн girl.namemed үл хөдлөх хөрөнгө тодорхойлогдоогүй тул та үүнд хандах боломжгүй, учир нь албан ёсоор энэ нь байхгүй. Гэхдээ хэрэв та girl.namemed.lucky-г охин.name-ээр солих юм бол бүх зүйл ажиллаж, програм Азтай буцаж ирнэ.

Та үл хөдлөх хөрөнгийн талаар илүү ихийг мэдэж болно эндээс уншина уу.

TypeErrors-ийг хэрхэн шийдвэрлэх вэ

Программист тодорхой төрөлд тохирохгүй өгөгдөл дээр үйлдэл хийхийг оролдох үед TypeErrors үүсдэг. Жишээ нь .bold()-г ашиглах, тодорхойгүй шинж чанарыг асуух, эсвэл үнэндээ функц биш функцийг дуудах гэх мэт.

Тэгэхээр, хэрэв та girl() руу залгахыг оролдвол Uncaught TypeError гэсэн алдаа гарах болно: yourVariable.bold нь функц биш, охин нь функц биш, учир нь энэ нь үнэндээ функц биш, дуудагдаж байгаа объект юм.

Алдааг арилгахын тулд хувьсагчдыг судлах хэрэгтэй. Тэгэхээр охин гэж юу вэ? охин гэж юу вэ? Та кодыг шинжлэх, console.log, дибаг хийх командыг ашиглан хувьсагчдыг харуулах эсвэл консол дахь хувьсагчийн нэрийг дуудах замаар олж мэдэх боломжтой. Та хувьсагчид агуулагдсан өгөгдлийн төрөл дээр ажиллах боломжтой эсэхийг шалгах хэрэгтэй. Хэрэв энэ нь тохирохгүй бол түүнийг өөрчлөх, жишээлбэл, нөхцөл нэмэх эсвэл оролдох..catch блок - мөн үйлдлийн гүйцэтгэлийг хянах боломжтой.

Стек халих

Хэрэв та Baby One More Time (энэ бол Бритни Спирс, тийм ээ) дууны шүлгийн зохиогчдод итгэж байгаа бол энэ утгаар хит болсон үг нь дуучны дахин дуудагдахыг хүсч байгаа гэсэн үг юм (энэ нь дууны яг ямар агуулгатай болохыг тайлбарлав. дуу - орчуулагчийн тэмдэглэл). Энэ хүсэл нь бодит амьдрал дээр дуудлагын тоог нэмэгдүүлэхэд хүргэж магадгүй юм. Гэхдээ програмчлалын хувьд энэ нь дуудлагын стек халивал алдаа үүсгэж болох рекурс юм.

Алдаанууд дараах байдлаар харагдаж байна.

Алдаа: Стекийн зай дүүрсэн байна (Ирмэг)
Дотоод алдаа: хэт их рекурс (Firefox)
RangeError: Дуудлагын стекийн дээд хэмжээ хэтэрсэн (Chrome)

Хөгжүүлэгч рекурсын үндсэн тохиолдлыг авч үзэхгүй эсвэл код нь төлөвлөсөн тохиолдлыг авч үзэхгүй бол стек халилт үүсдэг.

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

Энэ тохиолдолд stillBelieve хэзээ ч худал байж болохгүй, тиймээс oneMoreTime болгонд дуудагдах боловч функц хэзээ ч дуусахгүй.

Хэрэв та хоёр найздаа найдаж эхэлбэл энэ нь ганцаардлыг бууруулж, дуудлага хүлээх шаардлагагүй болно.

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

Үүний нэг жишээ бол систем нь алдааны мэдэгдэл үүсгэдэггүй, харин JavaScript кодыг ажиллуулж буй хуудас зүгээр л хөлддөг, хязгааргүй гогцоотой тохиолдлууд юм. Энэ нь while давталт нь дуусгавар болгох нөхцөлгүй тохиолдолд тохиолддог.

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

Та асуудлыг дараах байдлаар шийдэж болно.

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

Хязгааргүй давталт ба рекурсуудыг дибаг хийх

Хэрэв танд хязгааргүй давталтын асуудал байгаа бол та Chrome эсвэл Edge дээрх табыг хааж, Firefox дахь хөтчийн цонхыг хаах хэрэгтэй. Үүний дараа та кодыг сайтар шинжлэх хэрэгтэй. Хэрэв та асуудлыг олж чадахгүй бол давталт эсвэл функцдээ дибаг хийх команд нэмж, хувьсагчийн утгыг шалгах нь зүйтэй. Хэрэв үр дүн нь хүлээгдэж буй зүйлтэй тохирохгүй бол бид үүнийг солих болно, үүнийг хялбархан хийж болно.

Дээрх жишээнд дибаглагчийг функц эсвэл давталтын эхний мөрөнд нэмэх хэрэгтэй. Дараа нь та Chrome дахь дибаг хийх табыг нээж, хамрах хүрээний хувьсагчдад дүн шинжилгээ хийх хэрэгтэй. Дараагийн товчлуурыг ашигласнаар та давталт бүрт өөрчлөлтийг хянах боломжтой. Энэ бүгдийг хийхэд хялбар байдаг бөгөөд ихэнх тохиолдолд асуудал олддог.

Та энэ бүхний талаар илүү ихийг эндээс уншиж болно (Chrome-д зориулсан) бас энд (Firefox-д зориулсан).

Синтакс алдаа

JavaScript дахь хамгийн нийтлэг алдаануудын нэг бол SyntaxError юм. Текст засварлагчийн өргөтгөлүүд нь эдгээрээс зайлсхийхэд тусална. Жишээлбэл, Bracket Pair Colorizer нь кодын хаалтанд өөр өөр өнгөөр ​​тэмдэглэдэг бөгөөд Prettier эсвэл ижил төстэй шинжилгээний хэрэгсэл нь алдааг хурдан олох боломжийг олгодог. SyntaxError гарах магадлалыг бууруулах хамгийн сайн сонголт бол хамгийн бага үүрлэх явдал юм.

Сэтгэгдэл дээр хуваалцаарай: алдаа гаргахаас урьдчилан сэргийлэх эсвэл хурдан илрүүлж арилгахын тулд та юу хийдэг вэ?

Skillbox зөвлөж байна:

Эх сурвалж: www.habr.com

сэтгэгдэл нэмэх