Điều đó không sao vì một số có thể có nghĩa là bất kỳ thứ gì chúng ta muốn, bắt đầu từ loại ô tô [ví dụ: 1 dành cho xe tải] hoặc thậm chí trạng thái của một phép tính [ví dụ: 1 là bắt đầu]
Chúng ta có thể nghĩ rằng chỉ cần có một biến là đủ để hiểu nó. Hãy xem nhanh đoạn mã dưới đây
Ồ. Chúng ta có thể tìm ra loại xe. Nhưng nếu chúng ta cần thêm nhiều loại xe thì sao?
Chúng ta có thể làm điều này vô tận, và nó sẽ vẫn hoạt động. Tuy nhiên, các loại này sẽ không được kết nối hợp lý. Chúng sẽ chỉ là các hằng số riêng biệt có thể di chuyển đến bất kỳ đâu trong mã của bạn. Xử lý các biến theo cách này hơi lộn xộn
Enum là gì?Với nền tảng đó, hãy để tôi giới thiệu Enums [kiểu liệt kê]. Với Enums, nhà phát triển có thể xác định một tập hợp các hằng số được đặt tên. Điều này giúp dễ dàng ghi lại hoặc tạo một tập hợp các trường hợp riêng biệt
Sử dụng Enums cũng có thể giảm thiểu lỗi chính tả, vì Enums không thể thay đổi. Và nó có thể làm cho mã của bạn an toàn và sạch sẽ hơn [nghĩa là có thể tìm kiếm theo tên, với khả năng loại bỏ các giá trị ma thuật, v.v.]. Hãy nghĩ về Enums như một loại lớp đóng, các thể hiện được xác định trước một cách tĩnh
Tuy nhiên, có một vấn đề nhỏ - Enums không được hỗ trợ trong JavaScript nguyên bản. Tuy nhiên, vì Enum là một mẫu nên nó có thể được sao chép thông qua một số kỹ thuật và tính năng của JavaScript gốc
Chúng ta hãy xem xét hai tùy chọn áp dụng điều tra viên trong JavaScript
liệt kê JavaScript. một đại diện cơ bảnBước 1. Xác định một đối tượng đơn giản bằng chữ [POJO]
Như chúng tôi đã đề cập trước đây, Enums là các hằng số tên hay nói cách khác là các cặp khóa-giá trị, vì vậy chúng tôi có thể chỉ cần tạo một đối tượng
Quy ước đặt tên ở đây là một vấn đề của hương vị. Loại phổ biến nhất là PascalCase cho tên và UPPER_CASE cho khóa. Nhưng một lần nữa, tùy bạn quyết định bạn muốn nó trông như thế nào
Lưu ý rằng điều này vẫn không sao chép Enums thực, vì các giá trị có thể thay đổi dễ dàng
Bước 2. Đảm bảo rằng các giá trị không đổi
Trong JS gốc, có thể giữ nguyên các thuộc tính của đối tượng. Tùy chọn đầu tiên là sử dụng phương thứcdefineProperty, nhưng trong ES6, chúng tôi đã có phương thức đóng băng để làm như vậy
Đó là nó cho các tình huống cơ bản. Đối với các kịch bản phức tạp hơn, trong đó các giá trị phải là đối tượng hoặc logic khác nên được đưa vào, chúng ta có thể phát triển triển khai Enum của riêng mình
điều tra viên JavaScript. đại diện nâng caoNhư chúng ta đã biết, Enum là một lớp với các thể hiện được xác định trước. Vì vậy, hãy xem xét kỹ việc triển khai của chúng tôi. Chúng tôi sẽ sử dụng ES6, vì các phiên bản cũ hơn không thực sự phù hợp ở đây
Trong trường hợp này, theo nghĩa đen, chúng tôi xác định trước các thể hiện của lớp có thể được sử dụng trong logic nghiệp vụ của chúng tôi và thêm phương thức toString làm ví dụ về logic tùy chỉnh cho phép liệt kê của chúng tôi
Chúng ta có thể làm cho ví dụ này có thể lặp lại, thêm các phương thức hữu ích hơn và sử dụng lớp Proxy để hạn chế thay đổi trực tiếp các thuộc tính, nhưng tôi sẽ để phần đó cho bạn tự nghiên cứu vì nó nằm ngoài phạm vi của bài viết này
Sự lựa chọn khácBạn cũng có thể sử dụng các gói NPM như enumify, giúp triển khai chính mẫu enum hoặc gói enum cung cấp triển khai hoàn chỉnh với nhiều tính năng hơn, chẳng hạn như không gian tên
Cuối cùng, nếu bạn sử dụng TypeScript trong dự án của mình, Enums có sẵn ngay lập tức
Tóm tắt và liên kết hữu íchPhần trên giải thích cách chúng tôi đi sâu vào Enums và thậm chí tạo bảng liệt kê tùy chỉnh của riêng mình bằng JavaScript đơn giản
Chỉ cần thông báo trước. bạn nên suy nghĩ cẩn thận trước khi sử dụng Enums vì chúng không hữu ích đồng đều trong mọi trường hợp. Tuy nhiên, chúng có thể có lợi trong phần lớn các tình huống
Dưới đây là một số liên kết hữu ích mà bạn có thể thấy thú vị
- Đối tượng MDN. Đông cứng[]
- Tutorialspoint Enums
- Enums trong TypeScript Handbook
- gói liệt kê
- liệt kê gói
Cảm ơn vì đã đọc. Tôi hy vọng bạn thích hướng dẫn ngắn gọn này và học được điều gì đó mới về phép liệt kê trong JavaScript
Xây dựng các ứng dụng có thể kết hợp với các thành phần tách rời
Đừng xây dựng web nguyên khối. Sử dụng Bit để tạo và soạn các thành phần phần mềm tách rời — trong các khung yêu thích của bạn như React hoặc Node. Xây dựng các ứng dụng mô-đun và có thể mở rộng với trải nghiệm nhà phát triển mạnh mẽ và thú vị
Đưa nhóm của bạn đến Bit Cloud để lưu trữ và cộng tác trên các thành phần cùng nhau, đồng thời tăng tốc, mở rộng quy mô và chuẩn hóa đáng kể quá trình phát triển theo nhóm. Bắt đầu với các giao diện người dùng có thể kết hợp như Hệ thống thiết kế hoặc Giao diện vi mô hoặc khám phá phần phụ trợ có thể kết hợp. Hãy thử nó →
Enums trong JavaScript có thể mang lại nhiều lợi ích. Chúng giúp giảm thiểu lỗi chính tả trong trường hợp chuỗi đồng thời cung cấp tên tiếng Anh cho một số giá trị có thể là số. Các giá trị cũng được coi là hằng số và sẽ không bị thay đổi trong thời gian chạy — tất cả điều này, cũng như làm cho mã dễ dàng cấu trúc lại hơn với một nguồn sự thật duy nhất cho các giá trị. Điều gì không thích?
Hãy cùng xem một số ví dụ và cách triển khai enums
Xác định Enums của chúng tôi
Mặc dù JavaScript không có kiểu riêng cho enum, nhưng chúng ta luôn có thể tạo kiểu riêng của mình bằng cách sử dụng một đối tượng. Có một số quy ước thường được sử dụng khi xác định enum — mặc dù bạn không nhất thiết phải tuân theo chúng
- Tên enum là Capital Case
- Tránh viết tắt trừ khi chúng được sử dụng phổ biến
- Các thuộc tính là HOA
- Các thuộc tính được phân cách bằng dấu gạch dưới
Với suy nghĩ trên, chúng ta hãy xem những điều sau đây
Chúng tôi có một enum ở đây cho một số giá trị thời gian mà chúng tôi có thể sử dụng thường xuyên trong cơ sở mã của mình. Thay vì có các số thô trôi nổi xung quanh mà chúng ta có thể vô tình thêm 0 vào, chúng ta có một hằng số được xác định trong enum không bao giờ được thay đổi
Lợi ích của việc sử dụng enum ở đây sẽ là
- Tự động hoàn thành trong IDE/trình soạn thảo
- Nguồn duy nhất của sự thật
- Tính nhất quán
- Đánh dấu lỗi — Chúng tôi có thể bỏ lỡ số 0 trên giá trị, nhưng chúng tôi sẽ không bỏ lỡ một tên hằng sai chính tả
- Có thể tìm kiếm theo tên
NB. Một lợi ích thường bị bỏ qua là việc đặt tên cụ thể cho giá trị trong enum sẽ cho phép chúng tôi tìm kiếm tất cả các cách sử dụng giá trị đó trong mã. Số 7 có thể xuất hiện hàng nghìn lần, nhưng DAYS_PER_WEEK sẽ xảy ra ít hơn đáng kể
Những con số ma thuật được đánh giá quá cao
Gặp phải những con số kỳ diệu trong mã không bao giờ là niềm vui. Điều này dường như tùy ý 2 nghĩa là gì?
Nếu đây là một enum, thì giá trị có thể đã được đặt một cái tên tiết lộ ý định
Sau khi đặt tên riêng cho giá trị này trong một enum, chúng ta có thể thấy ngay giá trị này đang được sử dụng để làm gì. Đặt tên một cái gì đó chính xác trong mã là quan trọng. Nó làm cho mọi thứ dễ đọc, suy luận và dễ hiểu hơn
Như đã nói, việc có các số thô trong mã của chúng tôi không phải lúc nào cũng không thể giải mã được. Một số số phổ biến đến mức chúng tôi không thực sự cần làm nổi bật mục đích của chúng bằng tên, miễn là mã có thể tự giải thích được. Hãy xem xét những điều sau đây
const dailyPay = hourlyRate * 8Ta có thể thấy rõ ràng số 8 tượng trưng cho số giờ làm việc trong một ngày. Giá trị này không nhất thiết đảm bảo được đặt trong một enum
Đảm bảo nó đông lạnh
Một điều cần xem xét khi tạo một enum là đảm bảo rằng đối tượng bị đóng băng. Gọi số nguyên gốc Object.freeze[value] sẽ ngăn sự đột biến của các hằng số mà chúng ta xác định. Chúng tôi không muốn những giá trị này bị thay đổi trong thời gian chạy
Khi chúng ta gọi hàm này, chúng ta cần chuyển vào enum mới của mình và trạng thái hiện tại của nó sẽ bị đóng băng và được trả về. Nguyên mẫu của đối tượng cũng bị đóng băng. Không có thuộc tính nào có thể được sửa đổi, thêm hoặc xóa ngay bây giờ
Choices.ROCK = 'paper' // Returns 'paper'console.log[Choices.ROCK] // Logs 'rock'
Nếu bây giờ chúng ta cố gắng thay đổi đối tượng, giá trị mà chúng ta cố gán sẽ được trả về, nhưng trạng thái của đối tượng sẽ không bị thay đổi. Chúng ta có thể thấy điều này khi cố đăng xuất thuộc tính enum. Thuộc tính ROCK giữ lại giá trị ban đầu của nó là rock, như chúng ta mong đợi
NB. Đóng băng chỉ áp dụng cho các thuộc tính lớp trên cùng. Các đối tượng lồng nhau sẽ vẫn có thể thay đổi
Hãy cẩn thận với các giá trị được sử dụng
Một điều đáng chú ý là đôi khi chúng ta có thể gặp phải một vấn đề tế nhị. Chúng ta nên cảnh giác với việc sử dụng các giá trị giả mạo JavaScript làm giá trị trong enum của mình. Chúng có thể gây ra những cơn đau đầu không cần thiết
Vấn đề ở trên là enum của chúng ta đang sử dụng 0 làm giá trị cho tháng một. Đây là một giá trị giả trong JavaScript, có nghĩa là điều kiện chúng ta có sẽ đánh giá thành true. Tất cả các giá trị giả sẽ dẫn đến ghi nhật ký ở trên. Điều này cũng xảy ra do sự so sánh lỏng lẻo giữa == với. sự so sánh chặt chẽ của ===, đó là một chủ đề khác của riêng nó
Thay vào đó, hãy cố gắng tránh gán các giá trị giả trong enums
Ảnh của Simon Matzinger trên BaptCuối cùng cũng là một kết luận
Sử dụng khái niệm enums trong JavaScript có nhiều lợi ích với ít nhược điểm. Mặc dù nó có thể không phù hợp với mọi trường hợp sử dụng, nhưng nó chắc chắn đạt được phần lớn trong số họ. Vậy tại sao không tận dụng chúng?
Dưới đây là một số tài liệu tham khảo về các tài nguyên có thể thu hút sự quan tâm của bạn, nếu bạn muốn tìm hiểu thêm hoặc bắt đầu triển khai enum vào cơ sở mã của riêng mình, nếu bạn chưa làm như vậy
Đối tượng MDN. Đông cứng[]
Tutorialspoint Enums
Giá trị sai của JavaScript
Cảm ơn bạn đã đọc. Tôi hy vọng bạn thích bài viết và học được điều gì đó. Nếu bạn tình cờ có bất kỳ phản hồi, phê bình hoặc đóng góp nào, vui lòng ghi lại chúng trong phần bình luận bên dưới