Rumah > hujung hadapan web > tutorial js > Menguasai Pengendalian Ralat dalam JavaScript

Menguasai Pengendalian Ralat dalam JavaScript

Patricia Arquette
Lepaskan: 2024-12-25 04:45:20
asal
196 orang telah melayarinya

Mastering Error Handling in JavaScript

Menguasai Pengendalian Ralat dalam JavaScript

Tarikh: 19 Disember 2024

Pengendalian ralat ialah kemahiran penting untuk setiap pembangun JavaScript. Pemahaman yang teguh tentang ralat dan cara mengendalikannya memastikan aplikasi anda dapat pulih daripada isu dan memberikan pengalaman pengguna yang lancar. Artikel ini akan merangkumi jenis ralat, mencipta kelas ralat tersuai dan teknik nyahpepijat.


Jenis Ralat dalam JavaScript

Ralat JavaScript boleh dikategorikan secara meluas kepada tiga jenis:

1. Ralat Sintaks

Ralat sintaks berlaku apabila enjin JavaScript tidak dapat menghuraikan kod anda kerana sintaks tidak sah. Ini dikesan pada masa penyusunan sebelum kod dilaksanakan.

Contoh:

console.log("Hello World // Missing closing quotation mark
Salin selepas log masuk
Salin selepas log masuk

Cara Membetulkan:

Pastikan sintaks yang betul dengan menggunakan IDE atau editor dengan penyerlahan sintaks.


2. Ralat Masa Jalan

Ralat masa jalan berlaku apabila kod adalah betul dari segi sintaksis tetapi gagal dilaksanakan semasa masa jalan. Ini selalunya disebabkan oleh merujuk pembolehubah atau fungsi yang tidak wujud.

Contoh:

let a = 5;
console.log(b); // ReferenceError: b is not defined
Salin selepas log masuk
Salin selepas log masuk

Cara Membetulkan:

Semak pembolehubah tidak ditentukan atau panggilan fungsi yang salah.


3. Ralat Logik

Ralat logik berlaku apabila kod berjalan tanpa membuang ralat tetapi menghasilkan keputusan yang salah kerana logik yang cacat.

Contoh:

function calculateSum(a, b) {
  return a - b; // Incorrect operator
}
console.log(calculateSum(5, 3)); // Outputs 2 instead of 8
Salin selepas log masuk
Salin selepas log masuk

Cara Membetulkan:

Nyahpepijat dan semak logik anda untuk memastikan ia sejajar dengan output yang dijangkakan.


Ralat Tersuai dalam JavaScript

Mencipta kelas ralat tersuai membolehkan anda menentukan ralat khusus untuk keperluan aplikasi anda.

Langkah untuk Membuat Ralat Tersuai:

  1. Lanjutkan kelas Ralat terbina dalam.
  2. Tentukan mesej dan nama ralat.

Contoh:

class ValidationError extends Error {
  constructor(message) {
    super(message);
    this.name = "ValidationError";
  }
}

function validateAge(age) {
  if (age < 18) {
    throw new ValidationError("Age must be 18 or above.");
  }
}

try {
  validateAge(16);
} catch (error) {
  console.error(`${error.name}: ${error.message}`); // Outputs: ValidationError: Age must be 18 or above.
}
Salin selepas log masuk
Salin selepas log masuk

Teknik Nyahpepijat dalam JavaScript

Nyahpepijat adalah bahagian penting dalam pembangunan. Di bawah ialah beberapa kaedah dan alatan biasa untuk menyahpepijat aplikasi JavaScript.

Menggunakan Kaedah Konsol

Objek konsol menawarkan pelbagai kaedah untuk nyahpepijat:

  • console.log(): Log maklumat am.
console.log("Hello World // Missing closing quotation mark
Salin selepas log masuk
Salin selepas log masuk
  • console.error(): Log ralat dalam warna merah untuk keterlihatan yang lebih baik.
let a = 5;
console.log(b); // ReferenceError: b is not defined
Salin selepas log masuk
Salin selepas log masuk
  • console.warn(): Log amaran.
function calculateSum(a, b) {
  return a - b; // Incorrect operator
}
console.log(calculateSum(5, 3)); // Outputs 2 instead of 8
Salin selepas log masuk
Salin selepas log masuk
  • console.table(): Memaparkan data dalam format jadual.
class ValidationError extends Error {
  constructor(message) {
    super(message);
    this.name = "ValidationError";
  }
}

function validateAge(age) {
  if (age < 18) {
    throw new ValidationError("Age must be 18 or above.");
  }
}

try {
  validateAge(16);
} catch (error) {
  console.error(`${error.name}: ${error.message}`); // Outputs: ValidationError: Age must be 18 or above.
}
Salin selepas log masuk
Salin selepas log masuk

Alat Nyahpepijat dalam Penyemak Imbas Moden

Pelayar moden menyediakan alatan terbina dalam untuk membantu nyahpepijat kod JavaScript dengan berkesan.

  1. Tab Konsol:

    • Gunakan konsol untuk mengelog ralat, amaran dan mesej lain.
    • Taip arahan JavaScript terus untuk ujian pantas.
  2. Tab Sumber:

    • Tetapkan titik putus untuk menjeda pelaksanaan pada baris kod tertentu.
    • Langkah kod anda baris demi baris.
  3. Tab Rangkaian:

    • Pantau panggilan API, respons dan aktiviti rangkaian.
    • Isu nyahpepijat berkaitan dengan mengambil data atau ralat pelayan.
  4. Tab Prestasi:

    • Analisis dan optimumkan prestasi aplikasi.
    • Kenal pasti skrip dimuatkan perlahan atau kesesakan.

Amalan Terbaik untuk Pengendalian Ralat

  1. Gunakan Try-Catch Blocks: Balut blok kod berisiko untuk mengendalikan kemungkinan ralat dengan anggun.
  console.log("This is a log message");
Salin selepas log masuk
  1. Sahkan Input: Sahkan input pengguna untuk mengelakkan ralat semasa masa jalan.
  console.error("This is an error message");
Salin selepas log masuk
  1. Ralat Log:
    Log ralat ke konsol atau alat pemantauan luaran untuk penyahpepijatan.

  2. Degradasi Anggun:
    Sediakan kefungsian sandaran apabila ralat berlaku.


Dengan menguasai pengendalian ralat dan nyahpepijat, anda boleh menulis kod berdaya tahan yang mengendalikan senario yang tidak dijangka dengan berkesan. Berlatih mengenal pasti dan menyelesaikan ralat dalam aplikasi anda untuk menjadi pembangun yang lebih yakin dan berkebolehan!

Atas ialah kandungan terperinci Menguasai Pengendalian Ralat dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan