Trong JavaScript, TypeError là một đối tượng đại diện cho lỗi do thực hiện một thao tác không thể thực hiện được, thường là do giá trị trong một thao tác không thuộc loại mong đợi.
Nhưng các loại là gì? Theo phiên bản mới nhất của đặc tả JavaScript, ECMAScript, có chín kiểu dữ liệu và cấu trúc. Sáu trong số đó, (đôi khi là bảy nếu chúng ta đếm null), là các kiểu dữ liệu nguyên thủy, là chuỗi, số, bigint, boolean, không xác định và ký hiệu. Trước khi chúng ta có thể hiểu tại sao TypeErrors lại kích hoạt trong một hoạt động, hãy xem lại chín loại JavaScript của chúng ta. Nếu chúng ta đang ở một vị trí mà chúng ta không chắc chắn về cách phân loại một kiểu, chúng ta có thể sử dụng toán tử typeof.
- undefined:Một loại giá trị tự động được xác định cho các biến vừa được khai báo. Chúng tôi thường nhận được giá trị lỗi gõ là không xác định khi chúng tôi quên xác định hoặc thêm giá trị vào biến của mình.
- Boolean:Kiểu dữ liệu logic chỉ chứa các giá trị đúng hoặc sai.
- Số:Kiểu dữ liệu số.
- Chuỗi:Chuỗi ký tự bên trong dấu gạch ngược, dấu đơn hoặc dấu ngoặc kép.
- BigInt:Kiểu dữ liệu số đôi khi được gọi là bignums trong các ngôn ngữ lập trình khác.
- Biểu tượng:Giá trị đại diện cho một số nhận dạng duy nhất được tạo bằng cách gọi hàm Biểu tượng.
- Đối tượng:Một kiểu cấu trúc và hầu hết mọi thứ mà từ khóa 'mới' có thể tạo, như mảng, đối tượng, bản đồ, tập hợp, v.v.
- Chức năng:Một cấu trúc phi dữ liệu khác là một đoạn mã có thể được gọi bằng các đoạn mã khác.
- null:Thường là giá trị có chủ đích đại diện cho một đối tượng hoặc địa chỉ không tồn tại.
Loại lỗi JavaScript phổ biến nhất và cách khắc phục chúng
TypeErrors có thể được ném vào bạn khi cố gắng thay đổi một giá trị không thể thay đổi được hoặc khi sử dụng một giá trị theo cách không phù hợp. Nó cũng có thể xảy ra khi một đối số được truyền cho một hàm không tương thích với kiểu mà hàm mong đợi hoặc toán tử bên trong hàm.
Thay đổi một giá trị không thể thay đổi
Khi bạn sử dụng từ khóa const để gán giá trị cho một thứ gì đó, điều này có nghĩa là nó là hằng số, nó sẽ không thay đổi. Cố gắng thay đổi giá trị của một biến hằng số sẽ dẫn đến Lỗi kiểu.
const a = 5 a = "5" // Uncaught TypeError: Assignment to constant variable.
Chúng tôi có thể khắc phục điều này bằng cách chỉ cần thay đổi tên của số nhận dạng mà chúng tôi muốn xác định chuỗi “5”.
const a = 5 const b = "5"
Sử dụng Giá trị theo cách không phù hợp
Các nhà phát triển cũng phải đảm bảo rằng các giá trị đang được sử dụng như dự định. Trong ví dụ dưới đây, “Cat” và “garfield” ngược lại khi cố gắng xác minh xem garfield có phải là một phiên bản của hàm Cat () hay không.
function Cat() {} function Dog() {} let garfield = new Cat() Cat instanceof garfield // Uncaught TypeError: Right-hand side of 'instanceof' is not callable
Chúng ta có thể khắc phục điều này bằng cách sửa lại thứ tự của cả hai.
function Cat() {} function Dog() {} let garfield = new Cat() garfield instanceof Cat
Đối số không tương thích với kiểu mà hàm mong đợi
Khi mã hóa một hoạt động, các nhà phát triển phải đảm bảo rằng họ đang sử dụng các giá trị theo những cách mà họ có thể thu được kết quả mong muốn. Giá trị null có thể được sử dụng cố ý để biểu thị sự vắng mặt của một đối tượng, nhưng cách mà nó được sử dụng bên dưới sẽ dẫn đến Lỗi kiểu vì nó đang được sử dụng làm đối số không tương thích với kiểu mà hàm mong đợi.
81% người tham gia cho biết họ cảm thấy tự tin hơn về triển vọng công việc công nghệ của mình sau khi tham gia một cuộc thi đào tạo. Kết hợp với bootcamp ngay hôm nay.
Sinh viên tốt nghiệp bootcamp trung bình đã dành ít hơn sáu tháng để chuyển đổi nghề nghiệp, từ khi bắt đầu bootcamp đến khi tìm được công việc đầu tiên của họ.
function readingErrorsAreImportant(a){ if(a.length === 5){ return "equals five" } else if(a.length > 5) { return "Greater than five" } else { return "Less than five" } } console.log(readingErrorsAreImportant(null)) // Uncaught TypeError: Cannot read property 'length' of null
Chúng tôi có thể sửa lỗi này bằng cách chuyển vào một loại giá trị mà nó đang mong đợi. Giống như một kiểu giá trị số.
function readingErrorsAreImportant(a){ if(a.length === 5){ return "equals five" } else if(a.length > 5) { return "Greater than five" } else { return "Less than five" } } console.log(readingErrorsAreImportant(10))
Kết luận
Điều quan trọng là có thể hiểu tại sao mã của bạn gặp lỗi kiểu để bạn hiểu cách gỡ lỗi nó. Nếu bạn đang ở một vị trí mà bạn không chắc chắn về cách phân loại một kiểu, toán tử typeof sẽ trả về cho bạn một trong chín kiểu dữ liệu hoặc cấu trúc, để hiểu rõ hơn về cách bạn nên tiến hành gỡ lỗi.