Oops, ech hunn et nach eng Kéier gemaach: Debugging gemeinsame Feeler am JavaScript

Oops, ech hunn et nach eng Kéier gemaach: Debugging gemeinsame Feeler am JavaScript

JavaScript Code schreiwen kann Erausfuerderung an heiansdo direkt intimiderend sinn, wéi vill Entwéckler vertraut sinn. Am Prozess vun der Aarbecht entstinn zwangsleefeg Feeler, an e puer vun hinnen ginn dacks widderholl. Dësen Artikel, riicht un Ufänger Entwéckler, schwätzt iwwer dës Feeler a wéi se se léisen. Fir Kloerheet ginn d'Nimm vu Funktiounen, Eegeschaften an Objeten aus geholl populär Lidd. All dëst hëlleft Iech séier ze erënneren wéi Dir allgemeng Feeler korrigéiert.

Mir erënneren Iech: fir all Habr Lieser - eng Remise vun 10 Rubel wann Dir Iech an all Skillbox Cours aschreift mat dem Habr Promo Code.

Skillbox recommandéiert: Praktesch Cours "Mobilentwéckler PRO".

TypeError: Property ass net definéiert

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)

De Beispillcode hei uewen werft de Feeler Uncaught TypeError: Kann d'Eegeschaft net "glécklech" vun ondefinéiert liesen. De Problem ass, datt d'Meedchen Objet net eng genannt Propriétéit huet, obwuel et huet e Numm Propriétéit. A well d'Meedchen.benannt Eegentum net definéiert ass, kënnt Dir net zougräifen, well se formell net existéiert. Awer wann Dir girl.named.lucky duerch girl.name ersetzt, da funktionnéiert alles an de Programm gëtt Lucky zréck.

Dir kënnt méi iwwer d'Eegeschafte léieren liesen.

Wéi léisen TypeErrors

TypeErrors geschéien wann e Programméierer probéiert Aktiounen op Daten auszeféieren déi net mat engem spezifeschen Typ passen. Beispiller enthalen d'Benotzung vun .bold (), eng ondefinéiert Eegeschafte froen oder eng Funktioun ruffen déi net wierklech eng Funktioun ass.

Also, wann Dir probéiert Meedchen ze ruffen (), kritt Dir de Feeler Uncaught TypeError: yourVariable.bold ass keng Funktioun a Meedchen ass keng Funktioun, well et ass tatsächlech en Objet deen genannt gëtt, net eng Funktioun.

Fir Feeler ze eliminéieren, musst Dir d'Variabelen studéieren. Also, wat ass e Meedchen? Wat ass Meedchen.benannt? Dir kënnt erausfannen andeems Dir de Code analyséiert, Variabelen mat console.log, dem Debugger Kommando, oder de Variabelnumm an der Konsole nennt. Dir musst sécher sinn datt et méiglech ass op den Datentyp ze bedreiwen an der Variabel. Wann et net passt, änneren et, zum Beispill, addéiere eng Konditioun oder probéiert ..catch Block - a kritt Kontroll iwwer d'Ausféierung vun der Operatioun.

Stack Iwwerschwemmung

Wann Dir d'Auteure vun den Texter vum Lidd Baby One More Time gleeft (dat ass d'Britney Spears, jo), dann heescht d'Wuert Hit an dësem Kontext dem Sänger säi Wonsch erëm genannt ze ginn (hei ass eng Erklärung vum ganze Kontext vun der Lidd - Iwwersetzer Notiz). Et kann och sinn, datt dëse Wonsch zu enger Erhéijung vun der Unzuel vun Uriff am richtege Liewen féiert. Awer bei der Programméierung ass dëst e Rekurs deen e Feeler verursaache kann wann den Uruffstack iwwerfléisst.

D'Feeler kucken esou aus:

Feeler: Out of Stack Space (Edge)
InternalError: zevill Rekursioun (Firefox)
RangeError: Maximal Uruffstackgréisst iwwerschratt (Chrome)

E Stack Iwwerschwemmung geschitt wann den Entwéckler de Basisfall an der Rekursioun net berücksichtegt, oder wann de Code net de geplangte Fall adresséiert.

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

An dësem Fall kann StillBelieve ni falsch sinn, sou datt oneMoreTime all Kéier genannt gëtt, awer d'Funktioun wäert ni fäerdeg sinn.

Wann Dir ufänken op zwee Frënn ze vertrauen, dëst wäert d'Einsamkeet reduzéieren, an Dir musst net op en Uruff waarden.

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

E Beispill ass Fälle mat onendleche Schleifen, wann de System keng Fehlermeldung generéiert, awer d'Säit op där de JavaScript Code ausgefouert gëtt einfach afréiert. Dëst geschitt wann d'While Loop keng Terminatiounskonditioun huet.

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

Dir kënnt de Problem wéi follegt léisen:

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

Debugging onendlech Schleifen a Rekursiounen

Wann Dir en onendleche Loopproblem hutt, musst Dir d'Tab an Chrome oder Edge zoumaachen an d'Browserfenster am Firefox zoumaachen. Duerno musst Dir de Code virsiichteg analyséieren. Wann Dir de Problem net fanne kënnt, ass et derwäert en Debugger Kommando op Är Loop oder Funktioun ze addéieren an d'Wäerter vun de Variablen ze kontrolléieren. Wann d'Resultat net entsprécht wat erwaart gouf, da ersetzen mir et, dëst kann einfach gemaach ginn.

Am Beispill hei uewen, Debugger soll als éischt Zeil vun der Funktioun oder Loop hinzugefügt ginn. Da musst Dir d'Debug Tab am Chrome opmaachen, d'Variabelen am Ëmfang analyséieren. Mat den nächste Knäppchen kënnt Dir hir Ännerungen mat all Iteratioun verfollegen. All dëst ass einfach ze maachen, an am meeschte Fäll ass de Problem fonnt.

Dir kënnt méi iwwer dëst alles liesen hei (fir Chrome) an hei (fir Firefox).

Syntax Feeler

Ee vun den heefegste Feeler am JavaScript ass SyntaxError. Text Editor Extensiounen hëllefen Iech ze vermeiden. Zum Beispill, Bracket Pair Colorizer markéiert Klammeren am Code mat verschiddene Faarwen, a Prettier oder en ähnlechen Analyseinstrument mécht et méiglech séier Feeler ze fannen. Déi bescht Optioun fir d'Wahrscheinlechkeet vun engem SyntaxError ze reduzéieren ass minimal Nesting.

Deelt an de Kommentaren: wat maacht Dir fir Feeler ze vermeiden oder se séier z'entdecken an ze eliminéieren?

Skillbox recommandéiert:

Source: will.com

Setzt e Commentaire