Membetulkan Ralat Fungsi JavaScript Semasa Mengambil Kadar Pertukaran

Cara Menyelesaikan Ralat dalam Fungsi Pengambilan Kadar JavaScript

JavaScript ialah alat yang berkesan untuk pembangunan web, terutamanya apabila bekerja dengan API luaran. Walau bagaimanapun, walaupun pembangun berpengalaman melakukan kesilapan biasa semasa menulis fungsi untuk mendapatkan semula data daripada API. Satu isu sedemikian berlaku apabila cuba menghantar hujah ke dalam fungsi dan mendapatkan nilai yang tidak ditentukan sebagai tindak balas.

Artikel ini membincangkan kesukaran menulis fungsi JavaScript yang mendapatkan semula kadar bitcoin antara dua mata wang. Masalah, "ReferenceError: btc is not definition," selalunya disebabkan oleh parameter dan pembolehubah yang dinyatakan secara salah. Kebimbangan ini boleh dielakkan jika kod disusun dengan betul.

Kami akan menunjukkan kepada anda cara membuat fungsi bernama parut (dari, kepada), yang menerima dua parameter dan mengembalikan kadar pertukaran antara dua mata wang. Pada penghujung buku ini, anda akan mengetahui cara untuk meluluskan hujah dengan betul dan mengurus ralat semasa proses pengambilan data.

Jika anda mengalami masalah yang serupa atau telah menerima ralat "Tidak dapat membaca sifat yang tidak ditentukan (kadar bacaan')", artikel ini akan membantu anda menyelesaikan masalah dan menyelesaikannya dengan berkesan. Mari kita lihat langkah demi langkah bagaimana untuk menyelesaikan masalah ini.

Memahami Cara Fungsi JavaScript Mengendalikan Permintaan API untuk Kadar Mata Wang Kripto

Skrip yang dibekalkan di sini menunjukkan teknik alternatif untuk mendapatkan kadar pertukaran mata wang kripto antara dua mata wang menggunakan JavaScript. Skrip pertama menggunakan objek XMLHttpRequest, yang merupakan salah satu teknik lama untuk mengendalikan permintaan HTTP tak segerak dalam JavaScript. Fungsi parut (dari, kepada) menerima dua parameter: mata wang untuk ditukar. URL dijana secara dinamik berdasarkan parameter yang dibekalkan dan permintaan dihantar ke titik akhir API Bitpay. Selepas mendapat jawapan, data dihuraikan menggunakan JSON.parse() memaparkan kadar pertukaran dalam badan dokumen. Penyelesaian ini mengekalkan keserasian dengan penyemak imbas yang lebih lama, tetapi ia tidak mempunyai beberapa keupayaan yang lebih baru seperti janji, yang dibincangkan dalam contoh kedua.

Dalam contoh kedua, API Ambil digunakan dan bukannya XMLHttpRequest untuk melakukan tindakan yang sama. API Ambil adalah lebih terkini dan menawarkan cara yang lebih mudah untuk membuat permintaan rangkaian. Ia memanfaatkan janji untuk menjadikan aliran tak segerak lebih mudah dibaca dan terurus. Apabila fungsi itu dipanggil, ia membuat permintaan HTTP ke URL yang sama dan menunggu jawapan. Selepas mendapat respons, ia menukar data kepada objek JSON dan memperoleh kadarnya. API Ambil menambah baik pengurusan ralat dengan menggunakan blok cuba/tangkap untuk mengumpul dan mengurus sebarang isu yang timbul semasa permintaan atau pemprosesan data.

Skrip ketiga menyasarkan a persekitaran bahagian belakang dan membuat pertanyaan API dengan modul HTTP Node.js. Ini amat berfaedah untuk membangunkan apl sebelah pelayan yang memerlukan mendapatkan semula kadar pertukaran. Modul HTTP terbina dalam Node.js dan membenarkan pembangun menjalankan operasi HTTP. Fungsi ini mencipta URL dengan cara yang sama seperti skrip sebelumnya, menghantar panggilan GET ke API, dan kemudian menghuraikan data yang diterima. Hasilnya dilog masuk dalam konsol dan bukannya dipaparkan dalam penyemak imbas, menjadikannya lebih sesuai untuk senario bahagian belakang yang tidak memerlukan pelayar web.

Akhir sekali, suite ujian Jest disertakan untuk menyemak sama ada penyelesaian Fetch API berfungsi dengan betul. Jest ialah rangka kerja ujian yang popular, dan dengan jest-fetch-mock, kami boleh meniru respons API dalam ujian kami. Ini membolehkan pembangun menguji kod mereka tanpa benar-benar menjana pertanyaan rangkaian, yang mempercepatkan proses ujian dan mengasingkan potensi pepijat. Ujian mengesahkan bahawa data kadar berjaya diperoleh dan dipaparkan dalam badan dokumen, mengesahkan bahawa fungsi berfungsi seperti yang dimaksudkan dalam pelbagai konteks. Ujian ialah elemen pembangunan yang penting, terutamanya apabila bekerja dengan API luaran, kerana ia membantu mengesan kesilapan lebih awal dan meningkatkan kestabilan keseluruhan produk.

// Solution 1: Using XMLHTTPRequest to fetch cryptocurrency rates
function grate(from, to) {
  var burl = 'https://bitpay.com/rates/';
  var url = burl + from + '/' + to;
  var ourRequest = new XMLHttpRequest();
  ourRequest.open('GET', url, true);
  ourRequest.onload = function() {
    if (ourRequest.status >= 200 && ourRequest.status < 400) {
      var response = JSON.parse(ourRequest.responseText);
      document.body.innerHTML = 'Rate: ' + response.data.rate;
    } else {
      console.error('Error fetching the data');
    }
  };
  ourRequest.onerror = function() {
    console.error('Connection error');
  };
  ourRequest.send();
}
// Test the function with actual currency codes
grate('btc', 'usd');

// Solution 2: Using Fetch API for cleaner asynchronous requests
async function grate(from, to) {
  var burl = 'https://bitpay.com/rates/';
  var url = burl + from + '/' + to;
  try {
    let response = await fetch(url);
    if (!response.ok) throw new Error('Network response was not ok');
    let data = await response.json();
    document.body.innerHTML = 'Rate: ' + data.data.rate;
  } catch (error) {
    console.error('Fetch error: ', error);
  }
}
// Test the function with Fetch API
grate('btc', 'usd');

// Solution 3: Using Node.js HTTP module to fetch data from API
const http = require('http');
function grate(from, to) {
  const url = 'http://bitpay.com/rates/' + from + '/' + to;
  http.get(url, (resp) => {
    let data = '';
    resp.on('data', (chunk) => { data += chunk; });
    resp.on('end', () => {
      let rateData = JSON.parse(data);
      console.log('Rate: ' + rateData.data.rate);
    });
  }).on('error', (err) => {
    console.log('Error: ' + err.message);
  });
}
// Test the Node.js function
grate('btc', 'usd');

// Solution 4: Unit testing Fetch API using Jest
const fetchMock = require('jest-fetch-mock');
fetchMock.enableMocks();
test('grate() fetches correct rate data', async () => {
  fetch.mockResponseOnce(JSON.stringify({ data: { rate: 50000 }}));
  const rate = await grate('btc', 'usd');
  expect(document.body.innerHTML).toBe('Rate: 50000');
});

Meneroka Fungsi JavaScript Tak Segerak untuk Permintaan API

Mengendalikan permintaan tak segerak adalah penting apabila bekerja dengan API dalam JavaScript. API Ambil dan XMLHttpRequest ialah dua cara asas untuk membuat permintaan ini. Tujuan fungsi tak segerak adalah untuk menghalang penyemak imbas atau pelayan daripada membeku sementara menunggu respons, seterusnya meningkatkan pengalaman dan prestasi pengguna. Memahami tingkah laku tak segerak membolehkan pembangun membina aplikasi yang lebih responsif yang boleh mendapatkan semula data daripada API dalam masa nyata tanpa menjejaskan urutan utama.

Mengendalikan permintaan tak segerak memerlukan pengurusan respons dan pelbagai kesilapan yang mungkin timbul semasa proses. Sebagai contoh, satu kesukaran biasa apabila mendapatkan semula data daripada API luaran ialah mengembalikan nilai yang tidak ditentukan, seperti yang ditunjukkan oleh ralat dalam kes awal. Apabila pembangun gagal mengurus pengecualian dengan berkesan, aplikasi mereka mungkin ranap atau menghasilkan keputusan yang tidak tepat. Pengendalian ralat yang berkesan, seperti sekatan cuba/tangkap atau semakan status tindak balas, adalah penting.

Selain pengendalian ralat, keselamatan adalah pertimbangan penting apabila berinteraksi dengan API luaran. Mendedahkan data sensitif atau memberikan akses terus kepada API tanpa pengesahan boleh mengakibatkan kelemahan. Satu penyelesaian adalah untuk melaksanakan permintaan bahagian pelayan, di mana panggilan API dilakukan daripada pelayan bahagian belakang, memberikan tahap keselamatan tambahan. Ini melarang pelakon berniat jahat daripada mengganggu permintaan bahagian hadapan atau terus mendapatkan data sensitif melalui penyemak imbas. Menjaga sambungan API ini adalah penting, terutamanya apabila berurusan dengan maklumat kewangan seperti kadar bitcoin.