Apa yang terjadi ketika Anda melempar kesalahan javascript?

Question

Khususnya, ada situasi di mana kami mungkin ingin menghentikan program atau memberi tahu pengguna jika sesuatu yang buruk terjadi

Table of Contents Show

Apa itu kesalahan dalam JavaScript?
Banyak jenis kesalahan dalam JavaScript
Apa itu pengecualian?
Apa yang terjadi saat kita melempar pengecualian?
Penanganan kesalahan sinkron
Penanganan kesalahan untuk fungsi reguler
Penanganan kesalahan untuk fungsi generator
Penanganan kesalahan asinkron
Penanganan kesalahan untuk pengatur waktu
Penanganan kesalahan untuk acara
Bagaimana dengan kesalahan?
Penanganan kesalahan dengan Janji
Janji, kesalahan, dan lempar
Penanganan kesalahan untuk pengatur waktu "dijanjikan".
Penanganan kesalahan di Janji. semua
Penanganan kesalahan di Janji. setiap
Penanganan kesalahan di Janji. balapan
Penanganan kesalahan di Janji. allSettled
Penanganan kesalahan untuk async/menunggu
Penanganan kesalahan untuk generator async
Penanganan kesalahan di Node. js
Penanganan kesalahan sinkron di Node. js
Penanganan kesalahan asinkron di Node. js. pola panggilan balik
Penanganan kesalahan asinkron di Node. js. pemancar acara
Apa yang terjadi ketika terjadi kesalahan dalam JavaScript?
Apakah melempar kesalahan kembali dalam JavaScript?
Haruskah Anda membuang kesalahan di JS?
Apakah melempar kesalahan menghentikan eksekusi?

Misalnya

program mencoba membuka file yang tidak ada
koneksi jaringan terputus
pengguna memasukkan input yang tidak valid

Dalam semua kasus ini kita sebagai pemrogram, membuat kesalahan, atau kita membiarkan mesin pemrograman membuat beberapa untuk kita

Setelah membuat kesalahan, kami dapat memberi tahu pengguna dengan pesan, atau kami dapat menghentikan eksekusi sama sekali

Apa itu kesalahan dalam JavaScript?

Kesalahan dalam JavaScript adalah objek, yang kemudian dilempar untuk menghentikan program

Untuk membuat kesalahan baru dalam JavaScript, kami memanggil fungsi konstruktor yang sesuai. Misalnya, untuk membuat kesalahan umum baru yang bisa kita lakukan

const err = new Error("Something bad happened!");

Saat membuat objek kesalahan, Anda juga dapat menghilangkan kata kunci

Uncaught DOMException: Node.appendChild: May not add a Document as a child

5

const err = Error("Something bad happened!");

Setelah dibuat, objek kesalahan menampilkan tiga properti

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_6. string dengan pesan kesalahan

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_7. jenis kesalahan

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_8. jejak tumpukan eksekusi fungsi

Misalnya, jika kita membuat objek

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_9 baru dengan pesan yang sesuai,

Uncaught DOMException: Node.appendChild: May not add a Document as a child

6 akan membawa string kesalahan yang sebenarnya, sementara

Uncaught DOMException: Node.appendChild: May not add a Document as a child

7 akan menjadi

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

2

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

Firefox juga menerapkan banyak properti non-standar seperti

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

3,

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

4, dan

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

5

Banyak jenis kesalahan dalam JavaScript

Ada banyak jenis kesalahan dalam JavaScript, yaitu

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

_6

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

_7

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

_8

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

_9

const err = Error("Something bad happened!");

_00

const err = Error("Something bad happened!");

_01

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_9

const err = Error("Something bad happened!");

_03

Ingat, semua jenis kesalahan ini adalah fungsi konstruktor aktual yang dimaksudkan untuk mengembalikan objek kesalahan baru

Dalam kode Anda, Anda kebanyakan akan menggunakan

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

6 dan

Uncaught DOMException: Node.appendChild: May not add a Document as a child

9, dua jenis yang paling umum, untuk membuat objek kesalahan Anda sendiri

Sebagian besar kesalahan akan datang langsung dari mesin JavaScript, seperti

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

8 atau

const err = Error("Something bad happened!");

01

Contoh

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_9 terjadi saat Anda mencoba untuk menetapkan kembali

const err = Error("Something bad happened!");

09

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

Contoh

const err = Error("Something bad happened!");

01 adalah saat Anda salah mengeja kata kunci bahasa

va x = '33';
// SyntaxError: Unexpected identifier

Atau saat Anda menggunakan kata kunci yang dicadangkan di tempat yang salah, seperti

const err = Error("Something bad happened!");

11 di luar fungsi

const err = Error("Something bad happened!");

12

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

Contoh lain dari

Uncaught DOMException: Node.appendChild: May not add a Document as a child

9 terjadi saat kita memilih elemen HTML yang tidak ada di halaman

Uncaught TypeError: button is null

Selain objek kesalahan tradisional ini, objek

const err = Error("Something bad happened!");

14 akan segera mendarat di JavaScript.

const err = Error("Something bad happened!");

14 nyaman untuk menggabungkan banyak kesalahan, seperti yang akan kita lihat nanti

Selain kesalahan bawaan ini, di browser kita juga bisa menemukan

const err = Error("Something bad happened!");

_16

const err = Error("Something bad happened!");

17, usang dan tidak lagi digunakan hari ini

const err = Error("Something bad happened!");

16 adalah keluarga kesalahan yang terkait dengan API Web. Mereka terlempar saat kita melakukan hal-hal konyol di browser, seperti

document.body.appendChild(document.cloneNode(true));

Hasil

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_

Untuk daftar lengkap lihat halaman ini di MDN

Apa itu pengecualian?

Sebagian besar pengembang berpikir bahwa kesalahan dan pengecualian adalah hal yang sama. Pada kenyataannya, objek kesalahan menjadi pengecualian hanya saat dilempar

Untuk membuang pengecualian dalam JavaScript, kami menggunakan

const err = Error("Something bad happened!");

19, diikuti oleh objek kesalahan

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

_

Bentuk singkatnya lebih umum, di sebagian besar basis kode yang akan Anda temukan

const err = Error("Something bad happened!");

0

atau

const err = Error("Something bad happened!");

1

Tidak mungkin membuang pengecualian di luar fungsi atau blok bersyarat. Sebagai gantinya, pertimbangkan contoh berikut

const err = Error("Something bad happened!");

2

Di sini kita memeriksa apakah argumen fungsi adalah string. Jika tidak, kami memberikan pengecualian

Secara teknis, Anda bisa memasukkan apa saja ke dalam JavaScript, tidak hanya objek kesalahan

const err = Error("Something bad happened!");

_3

Namun, lebih baik hindari hal-hal tersebut. selalu membuang objek kesalahan yang tepat, bukan primitif

Dengan melakukan itu, Anda menjaga konsistensi penanganan kesalahan melalui basis kode. Anggota tim lain selalu dapat berharap untuk mengakses

const err = Error("Something bad happened!");

20 atau

const err = Error("Something bad happened!");

21 pada objek kesalahan

Apa yang terjadi saat kita melempar pengecualian?

Pengecualian seperti lift naik. setelah Anda melempar satu, itu menggelembung di tumpukan program, kecuali jika tertangkap di suatu tempat

Pertimbangkan kode berikut

const err = Error("Something bad happened!");

_4

Jika Anda menjalankan kode ini di browser atau di Node. js, program berhenti dan melaporkan kesalahan

const err = Error("Something bad happened!");

5

Selain itu, Anda dapat melihat garis yang tepat di mana kesalahan terjadi

Laporan ini adalah pelacakan tumpukan, dan berguna untuk melacak masalah dalam kode Anda

Jejak tumpukan bergerak dari bawah ke atas. Jadi disini

const err = Error("Something bad happened!");

6

Kita bisa bilang

sesuatu dalam program di baris 9 disebut

const err = Error("Something bad happened!");

22

const err = Error("Something bad happened!");

22 meledak di baris 3

Selain melihat jejak tumpukan ini di konsol browser, Anda dapat mengaksesnya di properti

Uncaught DOMException: Node.appendChild: May not add a Document as a child

8 dari objek error

Jika pengecualian tidak tertangkap, yaitu tidak ada yang dilakukan oleh pemrogram untuk menangkapnya, program akan macet

Kapan, dan di mana Anda menemukan pengecualian dalam kode Anda bergantung pada kasus penggunaan tertentu

Misalnya Anda mungkin ingin menyebarkan pengecualian di tumpukan untuk menghentikan program sama sekali. Hal ini dapat terjadi karena kesalahan fatal, saat menghentikan program lebih aman daripada bekerja dengan data yang tidak valid

Setelah memperkenalkan dasar-dasarnya, mari kita mengalihkan perhatian kita ke penanganan kesalahan dan pengecualian dalam kode JavaScript sinkron dan asinkron

Penanganan kesalahan sinkron

Kode sinkron sebagian besar langsung, dan juga penanganan kesalahannya

Penanganan kesalahan untuk fungsi reguler

Kode sinkron dijalankan dalam urutan yang sama dengan yang ditulis. Mari kita ambil lagi contoh sebelumnya

const err = Error("Something bad happened!");

_4

Di sini mesin memanggil dan mengeksekusi

const err = Error("Something bad happened!");

_22. Semua terjadi secara sinkron. Untuk menangkap pengecualian yang berasal dari fungsi sinkron tersebut, kita dapat menggunakan

const err = Error("Something bad happened!");

26

const err = Error("Something bad happened!");

_8

Biasanya,

const err = Error("Something bad happened!");

_27 berhubungan dengan happy path, atau dengan pemanggilan fungsi yang berpotensi melempar

const err = Error("Something bad happened!");

28 sebagai gantinya, menangkap pengecualian yang sebenarnya. Itu menerima objek kesalahan, yang dapat kita periksa (dan kirim dari jarak jauh ke beberapa logger dalam produksi)

Pernyataan

const err = Error("Something bad happened!");

_29 di sisi lain berjalan terlepas dari hasil fungsi. apakah itu gagal atau berhasil, kode apa pun di dalam ________2______29 akan berjalan

Ingat.

const err = Error("Something bad happened!");

26 adalah konstruk sinkron. sekarang ada cara untuk menangkap pengecualian yang berasal dari kode asinkron

Penanganan kesalahan untuk fungsi generator

Fungsi generator dalam JavaScript adalah jenis fungsi khusus

Itu dapat dijeda dan dilanjutkan sesuka hati, selain menyediakan saluran komunikasi dua arah antara ruang lingkup dalamnya dan konsumen

Untuk membuat fungsi generator, kami menempatkan bintang

const err = Error("Something bad happened!");

32 setelah kata kunci

const err = Error("Something bad happened!");

33

const err = Error("Something bad happened!");

_9

Begitu berada di dalam fungsi, kita dapat menggunakan

const err = Error("Something bad happened!");

_34 untuk mengembalikan nilai

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_0

Nilai balik dari fungsi generator adalah objek iterator. Untuk mengeluarkan nilai dari generator, kita dapat menggunakan dua pendekatan

memanggil

const err = Error("Something bad happened!");

_35 pada objek iterator

iterasi dengan

const err = Error("Something bad happened!");

_36

Jika kita ambil contoh kita, untuk mendapatkan nilai dari generator bisa kita lakukan

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_1

Di sini

const err = Error("Something bad happened!");

_37 menjadi objek iterator kita saat kita memanggil fungsi generator

Mulai sekarang kita dapat memanggil

const err = Error("Something bad happened!");

_38 untuk memajukan eksekusi

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_2

Generator juga bekerja sebaliknya. mereka dapat menerima kembali nilai dan pengecualian dari pemanggil

Selain

const err = Error("Something bad happened!");

35, objek iterator yang dikembalikan dari generator memiliki metode

const err = Error("Something bad happened!");

40

Dengan metode ini kita dapat menghentikan program dengan menyuntikkan pengecualian ke dalam generator

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_3

Untuk menangkap kesalahan seperti itu, Anda akan membungkus kode Anda di dalam generator dengan

const err = Error("Something bad happened!");

41 (dan

const err = Error("Something bad happened!");

29 jika diperlukan)

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_4

Fungsi generator juga dapat membuang pengecualian ke luar. Mekanisme untuk menangkap pengecualian ini sama dengan untuk menangkap pengecualian sinkron.

const err = Error("Something bad happened!");

_26

Berikut adalah contoh fungsi generator yang dikonsumsi dari luar dengan

const err = Error("Something bad happened!");

36

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_5

Di sini kami mengulangi jalur bahagia di dalam blok

const err = Error("Something bad happened!");

27. Jika terjadi pengecualian, kami menghentikannya dengan

const err = Error("Something bad happened!");

28

Penanganan kesalahan asinkron

JavaScript pada dasarnya sinkron, menjadi bahasa single-threaded

Lingkungan host seperti mesin browser menambah JavaScript dengan sejumlah API Web untuk berinteraksi dengan sistem eksternal, dan untuk menangani operasi terikat I/O

Contoh asinkronisitas pada browser adalah timeout, event, Promise

Penanganan kesalahan di dunia asinkron berbeda dari mitra sinkronnya

Mari kita lihat beberapa contoh

Penanganan kesalahan untuk pengatur waktu

Di awal penjelajahan Anda dengan JavaScript, setelah mempelajari tentang

const err = Error("Something bad happened!");

26, Anda mungkin tergoda untuk meletakkannya di blok kode apa pun

Perhatikan cuplikan berikut

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_6

Fungsi ini melempar setelah kira-kira 1 detik. Apa cara yang tepat untuk menangani pengecualian ini?

Contoh berikut tidak berfungsi

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_7

Seperti yang kami katakan,

const err = Error("Something bad happened!");

_41 sinkron. Di sisi lain kami memiliki

const err = Error("Something bad happened!");

_49, API browser untuk penghitung waktu

Pada saat callback diteruskan ke

const err = Error("Something bad happened!");

_49 berjalan,

const err = Error("Something bad happened!");

41 kita sudah lama hilang. Program akan macet karena kami gagal menangkap pengecualian

Mereka melakukan perjalanan di dua jalur yang berbeda

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_8

Jika kita tidak ingin merusak program, untuk menangani kesalahan dengan benar kita harus memindahkan

const err = Error("Something bad happened!");

41 ke dalam callback untuk

const err = Error("Something bad happened!");

49

Namun, pendekatan ini seringkali tidak masuk akal. Seperti yang akan kita lihat nanti, penanganan kesalahan asinkron dengan Janji memberikan ergonomis yang lebih baik

Penanganan kesalahan untuk acara

Node HTML dalam Model Objek Dokumen terhubung ke

const err = Error("Something bad happened!");

54, leluhur bersama untuk penghasil peristiwa apa pun di browser

Itu artinya kita bisa

(

const err = Error("Something bad happened!");

_54 dalam rilis mendatang)

Mekanisme penanganan kesalahan untuk peristiwa DOM mengikuti skema yang sama dari API Web asinkron apa pun

Perhatikan contoh berikut

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_9

Di sini kami memberikan pengecualian segera setelah tombol diklik. Bagaimana kita menangkapnya?

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

0

Seperti contoh sebelumnya dengan

const err = Error("Something bad happened!");

_49, panggilan balik apa pun yang diteruskan ke

const err = Error("Something bad happened!");

57 dijalankan secara asinkron

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

1

Jika kita tidak ingin merusak program, untuk menangani kesalahan dengan benar kita harus memindahkan

const err = Error("Something bad happened!");

41 ke dalam callback untuk

const err = Error("Something bad happened!");

57

Tetapi sekali lagi, tidak ada gunanya melakukan ini

Seperti

const err = Error("Something bad happened!");

_49, pengecualian yang dilemparkan oleh jalur kode asinkron tidak dapat ditangkap dari luar, dan akan merusak program Anda

Di bagian selanjutnya kita akan melihat bagaimana Janji dan

const err = Error("Something bad happened!");

61 dapat memudahkan penanganan kesalahan untuk kode asinkron

Bagaimana dengan kesalahan?

Elemen HTML memiliki sejumlah penangan acara seperti

const err = Error("Something bad happened!");

62,

const err = Error("Something bad happened!");

63,

const err = Error("Something bad happened!");

64 untuk beberapa nama

Ada juga

const err = Error("Something bad happened!");

_65, tetapi tidak ada hubungannya dengan

const err = Error("Something bad happened!");

19 dan teman-teman

Penangan peristiwa

const err = Error("Something bad happened!");

_65 aktif setiap kali elemen HTML seperti tag ________2______68 atau

const err = Error("Something bad happened!");

69 mengenai sumber daya yang tidak ada

Perhatikan contoh berikut

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

2

Saat mengunjungi dokumen HTML dengan sumber daya yang hilang atau tidak ada, konsol browser mencatat kesalahan tersebut

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

3

Dalam JavaScript kami, kami memiliki kesempatan untuk "menangkap" kesalahan ini dengan event handler yang sesuai

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

4

Atau lebih baik

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

5

Pola ini berguna untuk memuat sumber daya alternatif menggantikan gambar atau skrip yang hilang

Tapi ingat.

const err = Error("Something bad happened!");

65, tidak ada hubungannya dengan

const err = Error("Something bad happened!");

19 atau

const err = Error("Something bad happened!");

41

Penanganan kesalahan dengan Janji

Untuk mengilustrasikan penanganan kesalahan dengan Janji, kami akan "menjanjikan" salah satu contoh asli kami. Kami men-tweak fungsi berikut

const err = Error("Something bad happened!");

_4

Alih-alih mengembalikan string sederhana, atau pengecualian, kami menggunakan masing-masing

const err = Error("Something bad happened!");

73 dan

const err = Error("Something bad happened!");

74 untuk menangani kesalahan dan keberhasilan

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

7

(Secara teknis tidak ada yang asinkron dalam kode ini, tetapi berfungsi dengan baik untuk mengilustrasikan intinya)

Sekarang setelah fungsinya "dijanjikan", kita dapat melampirkan

const err = Error("Something bad happened!");

75 untuk menggunakan hasilnya, dan

const err = Error("Something bad happened!");

28 untuk menangani Promise yang ditolak

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

8

Kode ini akan masuk

const name = "Jules";
name = "Caty";

// TypeError: Assignment to constant variable.

_9

Di ranah Janji,

const err = Error("Something bad happened!");

_28 adalah konstruk untuk menangani kesalahan

Selain

const err = Error("Something bad happened!");

_28 dan

const err = Error("Something bad happened!");

75 kami juga memiliki

const err = Error("Something bad happened!");

29, mirip dengan

const err = Error("Something bad happened!");

29 di

const err = Error("Something bad happened!");

41

Sebagai "kerabat" sinkronnya,

const err = Error("Something bad happened!");

29 Promise berjalan terlepas dari hasil Promise

va x = '33';
// SyntaxError: Unexpected identifier

0

Ingatlah selalu bahwa panggilan balik apa pun yang diteruskan ke

const err = Error("Something bad happened!");

84 ditangani secara asinkron oleh Antrean Microtask. Itu adalah tugas mikro dengan prioritas di atas tugas makro seperti acara dan pengatur waktu

Janji, kesalahan, dan lempar

Sebagai praktik terbaik saat menolak Promise, sebaiknya berikan objek kesalahan

va x = '33';
// SyntaxError: Unexpected identifier

1

Dengan melakukan itu, Anda menjaga konsistensi penanganan kesalahan melalui basis kode. Anggota tim lain selalu dapat berharap untuk mengakses

const err = Error("Something bad happened!");

20, dan yang lebih penting Anda dapat memeriksa pelacakan tumpukan

Selain

const err = Error("Something bad happened!");

73, kita dapat keluar dari rantai Janji dengan melemparkan pengecualian

Perhatikan contoh berikut

va x = '33';
// SyntaxError: Unexpected identifier

2

Kami menyelesaikan Janji dengan sebuah string, dan kemudian rantai itu segera diputuskan dengan

const err = Error("Something bad happened!");

19

Untuk menghentikan propagasi pengecualian, kami menggunakan

const err = Error("Something bad happened!");

28, seperti biasa

va x = '33';
// SyntaxError: Unexpected identifier

3

Pola ini umum di

const err = Error("Something bad happened!");

89, tempat kami memeriksa objek respons untuk mencari kesalahan

va x = '33';
// SyntaxError: Unexpected identifier

4

Di sini pengecualian dapat dicegat dengan

const err = Error("Something bad happened!");

28. Jika kita gagal, atau memutuskan untuk tidak menangkapnya di sana, pengecualian bebas untuk meluap di tumpukan

Ini tidak buruk, tetapi lingkungan yang berbeda bereaksi berbeda terhadap penolakan yang tidak tertangkap

Node. js misalnya di masa mendatang akan membuat crash program apa pun di mana penolakan Promise tidak ditangani

va x = '33';
// SyntaxError: Unexpected identifier

5

Lebih baik Anda menangkap mereka

Penanganan kesalahan untuk pengatur waktu "dijanjikan".

Dengan penghitung waktu atau peristiwa, tidak mungkin menangkap pengecualian yang dilemparkan dari panggilan balik. Kami melihat contoh di bagian sebelumnya

va x = '33';
// SyntaxError: Unexpected identifier

6

Solusi yang ditawarkan oleh Janji terdiri dari "promisifikasi" kode kami. Pada dasarnya, kami membungkus pengatur waktu kami dengan Janji

va x = '33';
// SyntaxError: Unexpected identifier

7

Dengan

const err = Error("Something bad happened!");

_91 kami memicu penolakan Janji, yang membawa objek kesalahan

Pada titik ini kami dapat menangani pengecualian dengan

const err = Error("Something bad happened!");

28

va x = '33';
// SyntaxError: Unexpected identifier

8

Catatan. umum untuk menggunakan

const err = Error("Something bad happened!");

93 sebagai nilai kembalian dari Janji, dan

const err = Error("Something bad happened!");

94 sebagai objek kembalian dari penolakan

Node. js memiliki utilitas yang dipanggil untuk memudahkan "promisifikasi" API callback gaya lama

Penanganan kesalahan di Janji. semua

Metode statis

const err = Error("Something bad happened!");

95 menerima larik Janji, dan mengembalikan larik hasil dari semua Janji yang menyelesaikan

va x = '33';
// SyntaxError: Unexpected identifier

_9

Jika salah satu dari Janji ini ditolak,

const err = Error("Something bad happened!");

95 menolak dengan kesalahan dari Janji pertama yang ditolak

Untuk menangani situasi ini di

const err = Error("Something bad happened!");

_95 kami menggunakan

const err = Error("Something bad happened!");

28, seperti yang kami lakukan di bagian sebelumnya

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

0

Untuk menjalankan fungsi terlepas dari hasil

const err = Error("Something bad happened!");

95, sekali lagi, kita dapat menggunakan

const err = Error("Something bad happened!");

29

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_1

Penanganan kesalahan di Janji. setiap

Kami dapat menganggap

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

01 (Firefox > 79, Chrome > 85) sebagai kebalikan dari

const err = Error("Something bad happened!");

95

Sedangkan

const err = Error("Something bad happened!");

_95 mengembalikan kegagalan bahkan jika Janji tunggal dalam larik ditolak,

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

01 memberi kita Janji yang diselesaikan pertama kali (jika ada dalam larik) terlepas dari penolakan apa pun yang terjadi

Jika semua Janji yang diteruskan ke

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

01 ditolak, kesalahan yang dihasilkan adalah

const err = Error("Something bad happened!");

14. Perhatikan contoh berikut

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_2

Di sini kami menangani kesalahan dengan

const err = Error("Something bad happened!");

_28. Output dari kode ini adalah

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_3

Objek

const err = Error("Something bad happened!");

_14 memiliki properti yang sama dengan properti

const wrongType = TypeError("Wrong type given, expected number");

throw wrongType;

6 dasar, ditambah properti

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

10

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_4

Properti ini adalah larik dari setiap kesalahan individual yang dihasilkan oleh penolakan

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_5

Penanganan kesalahan di Janji. balapan

Metode statis

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_11 menerima array Promise

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_6

Hasilnya Janji pertama yang memenangkan "perlombaan"

Lalu bagaimana dengan penolakan?

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_7

Jika penolakan malah muncul sebagai elemen pertama dari array,

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

11 menolak, dan kita harus menangkap penolakan

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_8

Penanganan kesalahan di Janji. allSettled

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_14 adalah tambahan ECMAScript 2020 untuk bahasa ini

Tidak banyak yang harus ditangani dengan metode statis ini karena hasilnya akan selalu Promise yang diselesaikan, bahkan jika satu atau lebih input Promise ditolak

Perhatikan contoh berikut

function wrong(){
    await 99;
}

wrong();

// SyntaxError: await is only valid in async function

_9

Kami meneruskan ke

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_14 sebuah array yang terdiri dari dua Promise. satu diselesaikan dan yang lain ditolak

Dalam hal ini

const err = Error("Something bad happened!");

_28 tidak akan pernah terkena.

const err = Error("Something bad happened!");

29 malah berjalan

Hasil kode ini, login

const err = Error("Something bad happened!");

_75 adalah

Uncaught TypeError: button is null

_0

Penanganan kesalahan untuk async/menunggu

const err = Error("Something bad happened!");

61 dalam JavaScript menunjukkan fungsi asinkron, tetapi dari sudut pandang pembaca mereka mendapat manfaat dari semua keterbacaan fungsi sinkron

Untuk mempermudah, kita akan menggunakan fungsi sinkron sebelumnya

const err = Error("Something bad happened!");

22, dan mengubahnya menjadi fungsi asinkron dengan meletakkan

const err = Error("Something bad happened!");

12 sebelum kata kunci ________2______33

Uncaught TypeError: button is null

_1

Hanya dengan mengawali sebuah fungsi dengan

const err = Error("Something bad happened!");

12 kita menyebabkan fungsi mengembalikan Promise. Itu berarti kita dapat menghubungkan

const err = Error("Something bad happened!");

75,

const err = Error("Something bad happened!");

28, dan

const err = Error("Something bad happened!");

29 setelah pemanggilan fungsi

Uncaught TypeError: button is null

_2

Saat kita melempar dari fungsi

const err = Error("Something bad happened!");

_12, pengecualian menjadi penyebab penolakan untuk Janji yang mendasarinya

Kesalahan apa pun dapat dicegat dengan

const err = Error("Something bad happened!");

_28 dari luar

Yang terpenting, selain gaya ini kita dapat menggunakan

const err = Error("Something bad happened!");

26, seperti yang akan kita lakukan dengan fungsi sinkron

Dalam contoh berikut kita memanggil

const err = Error("Something bad happened!");

_22 dari fungsi lain,

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

31, yang dengan mudah membungkus pemanggilan fungsi dengan

const err = Error("Something bad happened!");

26

Uncaught TypeError: button is null

_3

Keluarannya adalah

Uncaught TypeError: button is null

_4

Pada topik yang sama. Bagaimana Cara Melempar Kesalahan Dari Fungsi Async di JavaScript?

Penanganan kesalahan untuk generator async

Generator asinkron dalam JavaScript adalah fungsi generator yang mampu menghasilkan Janji, bukan nilai sederhana

Mereka menggabungkan fungsi generator dengan

const err = Error("Something bad happened!");

_12. Hasilnya adalah fungsi generator yang objek iteratornya memaparkan Janji kepada konsumen

Untuk membuat generator asinkron, kami mendeklarasikan fungsi generator dengan bintang

const err = Error("Something bad happened!");

32, diawali dengan

const err = Error("Something bad happened!");

12

Uncaught TypeError: button is null

_5

Berdasarkan Janji, aturan yang sama untuk penanganan kesalahan berlaku di sini.

const err = Error("Something bad happened!");

19 di dalam generator async menyebabkan penolakan Janji, yang kami mencegat dengan

const err = Error("Something bad happened!");

28

Untuk mengeluarkan Janji dari generator async, kita dapat menggunakan dua pendekatan

const err = Error("Something bad happened!");

75 penangan

iterasi asinkron

Dari contoh di atas kita tahu pasti akan ada pengecualian setelah dua yang pertama

const err = Error("Something bad happened!");

34. Ini berarti kita bisa melakukannya

Uncaught TypeError: button is null

_6

Output dari kode ini adalah

Uncaught TypeError: button is null

_7

Pendekatan lain menggunakan async iterasi dengan

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

40. Untuk menggunakan iterasi asinkron, kita perlu membungkus konsumen dengan fungsi

const err = Error("Something bad happened!");

12

Berikut contoh lengkapnya

Uncaught TypeError: button is null

_8

Dan seperti

const err = Error("Something bad happened!");

_61 kami menangani potensi pengecualian dengan

const err = Error("Something bad happened!");

41

Uncaught TypeError: button is null

_9

Output dari kode ini adalah

document.body.appendChild(document.cloneNode(true));

_0

Objek iterator yang dikembalikan dari fungsi generator asinkron juga memiliki metode

const err = Error("Something bad happened!");

40, seperti mitra sinkronnya

Memanggil

const err = Error("Something bad happened!");

_40 pada objek iterator di sini tidak akan memunculkan pengecualian, tetapi penolakan Janji

document.body.appendChild(document.cloneNode(true));

_1

Untuk menangani situasi ini dari luar bisa kita lakukan

document.body.appendChild(document.cloneNode(true));

_2

Tapi jangan lupa bahwa objek iterator

const err = Error("Something bad happened!");

40 mengirim pengecualian di dalam generator. Ini berarti kita juga bisa menerapkan pola berikut

document.body.appendChild(document.cloneNode(true));

_3

Penanganan kesalahan di Node. js

Penanganan kesalahan sinkron di Node. js

Penanganan kesalahan sinkron di Node. js tidak jauh berbeda dari apa yang kita lihat sejauh ini

Untuk kode sinkron,

const err = Error("Something bad happened!");

_26 berfungsi dengan baik

Namun, hal-hal menjadi menarik jika kita melihat sekilas ke dunia asinkron

Penanganan kesalahan asinkron di Node. js. pola panggilan balik

Untuk kode asinkron, Node. js sangat bergantung pada dua idiom

pola panggilan balik
pemancar acara

Dalam pola panggilan balik, Node asinkron. js API menerima fungsi yang ditangani melalui event loop dan dieksekusi segera setelah tumpukan panggilan kosong

Pertimbangkan kode berikut

document.body.appendChild(document.cloneNode(true));

_4

Jika kami mengekstrak panggilan balik dari daftar ini, kami dapat melihat bagaimana seharusnya menangani kesalahan

document.body.appendChild(document.cloneNode(true));

_5

Jika ada kesalahan yang muncul dari membaca jalur yang diberikan dengan

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

48, kami mendapatkan objek kesalahan

Pada titik ini kita bisa

cukup catat objek kesalahan seperti yang kami lakukan
membuang pengecualian
meneruskan kesalahan ke panggilan balik lain

Untuk membuang pengecualian bisa kita lakukan

document.body.appendChild(document.cloneNode(true));

_6

Namun, seperti kejadian dan pengatur waktu di DOM, pengecualian ini akan menghentikan program. Upaya berikut untuk menghentikannya dengan

const err = Error("Something bad happened!");

_41 tidak akan berhasil

document.body.appendChild(document.cloneNode(true));

_7

Meneruskan error ke callback lain adalah pilihan yang lebih disukai, jika kita tidak ingin merusak program

document.body.appendChild(document.cloneNode(true));

_8

Di sini

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_50 adalah apa namanya, fungsi sederhana untuk penanganan kesalahan

document.body.appendChild(document.cloneNode(true));

_9

Penanganan kesalahan asinkron di Node. js. pemancar acara

Banyak dari apa yang Anda lakukan di Node. js didasarkan pada peristiwa. Sebagian besar waktu Anda berinteraksi dengan objek emitor dan beberapa pengamat mendengarkan pesan

Setiap modul yang digerakkan oleh peristiwa (seperti net misalnya) di Node. js memperluas kelas root bernama

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

51

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_51 di Node. js memiliki dua metode mendasar.

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

_53 dan

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

54

Pertimbangkan server HTTP sederhana ini

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_0

Di sini kita mendengarkan dua peristiwa. mendengarkan dan koneksi

Selain event ini, emitter event juga menampilkan event error, yang diaktifkan jika terjadi error

Jika Anda menjalankan mendengarkan kode ini di port 80 alih-alih contoh sebelumnya, Anda akan mendapatkan pengecualian

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_1

Keluaran

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_2

Untuk menangkapnya, kita dapat mendaftarkan event handler untuk error

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_3

Ini akan dicetak

Uncaught DOMException: Node.appendChild: May not add a Document as a child

_4

Selain itu, program tidak akan macet

Untuk mempelajari lebih lanjut tentang topik ini, pertimbangkan juga untuk membaca "Penanganan kesalahan di Node. js"

Membungkus

Dalam panduan ini kami membahas penanganan kesalahan dalam JavaScript untuk seluruh spektrum, dari kode sinkron sederhana, hingga primitif asinkron tingkat lanjut

Ada banyak cara pengecualian dapat terwujud dalam program JavaScript kami

Pengecualian dari kode sinkron adalah yang paling mudah ditangkap. Pengecualian dari jalur kode asinkron malah bisa jadi rumit untuk ditangani

Sementara itu, API JavaScript baru di browser hampir semuanya mengarah ke

const wrongType = TypeError("Wrong type given, expected number");

wrongType.message; // "Wrong type given, expected number"
wrongType.name; // "TypeError"

55. Pola meresap ini memudahkan penanganan pengecualian dengan

const err = Error("Something bad happened!");

84, atau dengan

const err = Error("Something bad happened!");

41 untuk

const err = Error("Something bad happened!");

61

Setelah membaca panduan ini, Anda seharusnya dapat mengenali semua situasi berbeda yang mungkin muncul dalam program Anda, dan menangkap pengecualian Anda dengan benar

Apa yang terjadi ketika terjadi kesalahan dalam JavaScript?

Jika terjadi kesalahan di dalam blok try maka kontrol eksekusi dipindahkan ke blok catch . Dengan kata sederhana, coba periksa kesalahan apa pun, dan catch menerima kontrol eksekusi saat terjadi kesalahan dan dapat menanganinya. Setelah itu, program dilanjutkan seperti biasa. Jika tidak terjadi error, maka blok catch akan dilewati.

Apakah melempar kesalahan kembali dalam JavaScript?

Anda tidak perlu memberikan pernyataan kembali setelah melempar , garis balik tidak akan pernah tercapai karena melempar pengecualian segera menyerahkan kendali kembali ke pemanggil.

Haruskah Anda membuang kesalahan di JS?

Sebaiknya hindari melempar kesalahan dari dalam Promise , karena mungkin tidak selalu tertangkap, tergantung pada bagaimana kode yang memanggilnya disusun. Namun, merupakan praktik yang baik untuk mengembalikan kesalahan saat menolak Promise, dan Anda dapat mengembalikan jenis khusus Kesalahan seperti halnya Kesalahan lainnya.

Apakah melempar kesalahan menghentikan eksekusi?

Untuk menangani pengecualian yang dilemparkan, Anda harus menangkapnya. Jika pengecualian dilemparkan dan tidak tertangkap oleh sesuatu, skrip berhenti mengeksekusi .

kode javascript