Aupa, berriro egin dut: JavaScript-en ohiko erroreak araztea

JavaScript kodea idaztea zaila izan daiteke eta batzuetan guztiz beldurgarria izan daiteke, garatzaile askok ezagutzen duten moduan. Lan-prozesuan, akatsak sortzen dira ezinbestean, eta horietako batzuk maiz errepikatzen dira. Garatzaile hasiberriei zuzendutako artikulu honek akats horiei buruz eta horiek konpontzeko moduari buruz hitz egiten du. Argitasunerako, funtzioen, propietateen eta objektuen izenak hartzen dira abesti ezaguna. Horrek guztiak akats arruntak nola zuzendu azkar gogoratzen laguntzen dizu.

Gogoratzen dugu: "Habr" irakurle guztientzat - 10 errubloko deskontua "Habr" promozio-kodea erabiliz Skillbox-eko edozein ikastarotan izena ematean.

Skillbox-ek gomendatzen du: Ikastaro praktikoa "Mobile Developer PRO".

TypeError: propietatea ez dago definitu

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)

Goiko adibide-kodeak Uncaught TypeError errorea botatzen du: ezin da irakurri undefined-en 'lucky' propietatea. Arazoa da neska objektuak ez duela propietate izendaturik, nahiz eta izena duen propietate bat duen. Eta girl.named propietatea definituta ez dagoenez, ezin duzu bertara sartu, formalki ez baita existitzen. Baina girl.named.lucky girl.name-rekin ordezkatzen baduzu, dena funtzionatuko du eta programak Lucky itzuliko du.

Propietateei buruz gehiago jakin dezakezu irakurri hemen.

Nola konpondu motako erroreak

Mota erroreak programatzaile bat mota zehatz batekin bat ez datozen datuetan ekintzak egiten saiatzen denean gertatzen dira. Adibideak: .bold() erabiltzea, zehaztu gabeko propietate bat eskatzea edo benetan funtzio bat ez den funtzio bati deitzea.

Beraz, girl(ri) deitzen saiatzen bazara, Uncaught TypeError errorea jasoko duzu: yourVariable.bold ez da funtzio bat eta girl ez da funtzio bat, benetan deitzen den objektu bat delako, ez funtzio bat.

Akatsak ezabatzeko, aldagaiak aztertu behar dituzu. Orduan, zer da neska bat? Zein da neska.izena? Kodea aztertuz, aldagaiak bistaratu console.log, debugger komandoa erabiliz edo aldagaiaren izena kontsolan deituz jakin dezakezu. Ziurtatu behar duzu aldagaian dagoen datu-motarekin funtzionatzea posible dela. Egokitzen ez bada, aldatu, adibidez, gehitu baldintza bat edo try..catch blokea - eta lortu eragiketaren exekuzioaren kontrola.

Pila gainezka

Baby One More Time abestiaren letraren egileak sinesten badituzu (hau Britney Spears da, bai), orduan hit hitzak testuinguru honetan abeslariaren deitzeko nahia esan nahi du (hemen testuinguruaren beraren azalpena). abestia - itzultzailearen oharra). Baliteke gogo horrek bizitza errealean dei kopurua handitzea ekartzea. Baina programazioan, deien pila gainezka egiten bada errore bat sor dezakeen errekurtsioa da.

Akatsak honelakoak dira:

Errorea: pila-lekurik gabe (Edge)
Barne-errorea: errekurtsio gehiegi (Firefox)
RangeError: deien pilaren gehienezko tamaina gainditu da (Chrome)

Pila gainezkatzea gertatzen da garatzaileak errekurtsioan oinarrizko kasua kontuan hartzen ez badu edo kodeak nahi den kasua zuzentzen ez badu.

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

Kasu honetan, stillBelieve ezin da inoiz faltsua izan, beraz, oneMoreTime deituko da bakoitzean, baina funtzioa ez da inoiz osatuko.

Bi lagunengan konfiantzaz hasten bazara, horrek bakardadea murriztuko du, eta ez duzu dei baten zain egon beharko.

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

Adibide bat begizta infinituak dituzten kasuak dira, sistemak errore-mezurik sortzen ez duenean, baina JavaScript kodea exekutatzen den orria besterik gabe izozten da. Hori gertatzen da while begiztak amaiera-baldintzarik ez badu.

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

Arazoa honela konpon dezakezu:

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

Begizta eta errekurtsio infinituak araztea

Begizta infinituko arazoren bat baduzu, fitxa itxi behar duzu Chrome edo Edge-n, eta arakatzailearen leihoa itxi Firefox-en. Horren ondoren, arretaz aztertu behar duzu kodea. Arazoa aurkitzen ez baduzu, merezi du zure begizta edo funtzioari arazte-agindu bat gehitzea eta aldagaien balioak egiaztatzea. Emaitza espero zenarekin bat ez badator, ordezkatuko dugu, hau erraz egin daiteke.

Goiko adibidean, arazketa funtzioaren edo begiztaren lehen lerro gisa gehitu behar da. Ondoren, arazketa fitxa ireki behar duzu Chrome-n, esparruko aldagaiak aztertuz. Hurrengo botoia erabiliz haien aldaketen jarraipena egin dezakezu iterazio bakoitzean. Hori guztia erraza da egiteko, eta kasu gehienetan arazoa aurkitzen da.

Honi guztiari buruz gehiago irakur dezakezu hemen (kromorako) eta hemen (Firefoxerako).

Sintaxi errorea

JavaScript-en akats ohikoenetako bat SyntaxError da. Testu-editorearen luzapenek horiek saihesten lagunduko dizute. Adibidez, Bracket Pair Colorizer-ek kodean parentesiak markatzen ditu kolore ezberdinekin, eta Prettier-ek edo antzeko analisi-tresna batek erroreak azkar aurkitzea ahalbidetzen du. SyntaxError baten probabilitatea murrizteko aukerarik onena habia minimoa da.

Partekatu iruzkinetan: zer egiten duzu akatsak saihesteko edo azkar antzemateko eta ezabatzeko?

Skillbox-ek gomendatzen du:

• Bi urteko ikastaro praktikoa "PRO web garatzailea naiz".
• Lineako ikastaroa "0-tik C# garatzailea".
• Ikastaro praktikoa "PHP garatzailea 0tik PROra".

Iturria: www.habr.com