Odpravljanje napake pri klicu funkcije JavaScript: ReferenceError zaradi nedefiniranih spremenljivk

Razumevanje napake JavaScript ReferenceError in njenih popravkov

V JavaScriptu, če vidite a ReferenceError je lahko nadležno, še posebej, če ustavi izvajanje vaše kode. Eden od pogostih scenarijev je, da spremenljivke niso podane pred uporabo, kar povzroča takšne napake.

Težava je pri klicu funkcije, ki pridobi podatke iz zunanjega API-ja. Ta posebna težava izvira iz spremenljivk, ki niso pravilno deklarirane v klicu funkcije. Če z njim ne ravnate pravilno, lahko to povzroči zlom kode.

Ne glede na to, ali delate z API-ji JavaScript ali sestavljate skript z dinamičnimi vrednostmi, je treba določiti spremenljivke, preden jih posredujete. Če ne, boste morda prejeli sporočilo "ReferenceError: spremenljivka ni definirana".

Ta objava bo pojasnila, kako spremeniti svojo funkcijo JavaScript, da popravite ReferenceError. Preučili bomo tudi, kako pravilno definirati in posredovati parametre, da se izognemo tej težavi v prihodnjih izvedbah.

Razreševanje ReferenceError v klicih JavaScript API

V ponujenih primerih so JavaScript skripte namenjene pridobivanju menjalnih tečajev iz API-ja, natančneje storitve BitPay. Glavno vprašanje je a ReferenceError ki ga ustvarijo nedefinirane spremenljivke med uporabo gc() funkcijo. Da bi to rešili, je prvi korak zagotoviti, da so parametri, posredovani funkciji, kot sta 'eth' in 'usd', pravilno deklarirani kot nizi. JavaScript ne more obdelati nedefiniranih spremenljivk, zato njihovo enkapsulacijo v narekovajih odpravite težavo in omogočite, da zahteva za pridobivanje nadaljuje s pravilno konstrukcijo URL-ja.

API za pridobivanje je kritična komponenta tega pristopa, saj skriptu omogoča asinhrono pridobivanje podatkov iz zunanjega strežnika. V tem primeru get() pošlje zahtevo HTTP na URL, ki ga določata dva parametra (var1 in var2). Struktura URL-ja je ključnega pomena in njeno dinamično generiranje zagotavlja, da se ustrezna končna točka pokliče na podlagi uporabniškega vnosa. Po pridobitvi podatkov se ti razčlenijo z uporabo res.json() za pretvorbo odgovora v format JSON. Nastali menjalni tečaj je nato prikazan v telesu HTML s spremembo DOM, ki posodobi uporabniški vmesnik v realnem času.

V različici Node.js uporabljamo axios namesto pridobivanja bolj robusten paket za obravnavanje zahtev HTTP v zalednih kontekstih. Axios izboljša obravnavo napak in poenostavi postopek razčlenjevanja odgovorov. V skriptu axios pošlje zahtevo GET do končne točke API-ja, zbere podatke in prikaže menjalni tečaj v konzoli. Poleg tega skript zagotovi, da sta oba parametra zagotovljena v funkciji, preden izvede klic API-ja, s čimer odstrani drug potencialni vir napake.

Za potrditev stabilnosti teh funkcionalnosti so bili testi enot napisani z uporabo Šala ogrodje. Ti testi ponarejajo knjižnico axios za posnemanje uspešnih in neuspešnih klicev API-ja. To nam pomaga zagotoviti, da funkcija pokriva vse možne scenarije, na primer ko API dostavi veljavno stopnjo ali ko pride do napake, kot je izpad omrežja. Z vključitvijo teh testov lahko samozavestno izdamo kodo v produkcijskih okoljih, saj vemo, da bo delovala po pričakovanjih. Uporaba sprednjih in zalednih rešitev zagotavlja, da je problem v celoti obravnavan, s poudarkom na povečanju zmogljivosti in odpornosti na napake.

// Define the function with two parameters
function getRates(var1, var2) {
    // Define the URL with the parameters
    let url = 'https://bitpay.com/rates/' + var1 + '/' + var2;
    // Fetch data from the URL
    fetch(url)
    .then(res => {
        if (!res.ok) throw new Error('Network response was not ok');
        return res.json();
    })
    .then(out => {
        // Update the body with the rate
        document.body.innerHTML = 'Rate: ' + out.data.rate;
    })
    .catch(error => console.error('There was an error:', error));
}
// Correctly call the function with string parameters
getRates('eth', 'usd');

const axios = require('axios');
// Function to get exchange rates
function getRates(var1, var2) {
    // Validate input parameters
    if (!var1 || !var2) {
        throw new Error('Both currency parameters must be defined');
    }
    // Define the URL
    const url = 'https://bitpay.com/rates/' + var1 + '/' + var2;
    // Make the request using axios
    axios.get(url)
        .then(response => {
            console.log('Rate:', response.data.data.rate);
        })
        .catch(error => {
            console.error('Error fetching rate:', error.message);
        });
}
// Correctly call the function
getRates('eth', 'usd');

const axios = require('axios');
const { getRates } = require('./getRates');
jest.mock('axios');
// Test successful API call
test('should return correct rate', async () => {
    axios.get.mockResolvedValue({ data: { data: { rate: 2500 } } });
    const rate = await getRates('eth', 'usd');
    expect(rate).toBe(2500);
});
// Test API call failure
test('should handle error', async () => {
    axios.get.mockRejectedValue(new Error('Network Error'));
    await expect(getRates('eth', 'usd')).rejects.toThrow('Network Error');
});

Ravnanje z definicijami spremenljivk v klicih JavaScript API

Ustrezen obseg spremenljivke in inicializacija sta ključnega pomena za obravnavo ReferenceError v JavaScriptu, zlasti ko se ukvarjate s klici API-ja. Če želite pravilno definirati in deklarirati spremenljivke v JavaScriptu, uporabite naj oz konst. Če spremenljivk pred uporabo ne deklarirate ali jih prikličete izven njihovega obsega, se pogosto pojavijo napake, kot je "ReferenceError: spremenljivka ni definirana." Pri izvajanju poizvedb API je ključnega pomena zagotoviti, da so argumenti pravilno izpolnjeni.

Pri razvoju aplikacij, ki se povezujejo z zunanjimi API-ji, morate dodatno upoštevati asinhrono naravo dejanj. Medtem ko API za pridobitev obravnava asinhrone dejavnosti z obljubami, je ključnega pomena dodati obravnavanje napak poskusi ... ulovi bloki ali uporabite .catch() deluje po obljubi, da bo zajel verjetne okvare. To prepreči, da bi nepričakovane težave prekinile celotno aplikacijo. Dobro ravnanje z napakami izboljša uporabniško izkušnjo z zagotavljanjem elegantnih napak in ustreznih sporočil o napakah.

Poleg tega je treba pri obravnavanju zunanjih poizvedb API upoštevati varnost. Potrditi morate vse dohodne podatke, zlasti ko imate opravka s spremenljivimi parametri, kot so valute v naši situaciji. Prečiščevanje vnosov pred zahtevo API lahko pomaga preprečiti morebitne varnostne ranljivosti, kot so zloraba API-ja ali napadi z vbrizgavanjem. Upoštevanje najboljših praks za preverjanje vnosa in izogibanje neposredni uporabi uporabniško ustvarjenih podatkov v URL-jih je pomembna taktika sodobnega spletnega razvoja.