NỘI DUNG BÀI VIẾT
Trong bài viết này, chúng ta sẽ tìm hiểu về dấu chấm phẩy trong JavaScript, tại sao có người thích sử dụng, có người lại không thích sử dụng, nguyên tắc chèn dấu chấm phẩy tự động trong JavaScript nhé!
Sử dụng hoặc không sử dụng dấu chấm phẩy trong JavaScript
Dấu chấm phẩy trong JavaScript phân chia cộng đồng lập trình viên thành 2 thái cực. Một số người luôn luôn thích sử dụng chúng bất kể điều gì. Bộ phận còn lại thì ghét và không muốn sử dụng chúng.
Tôi thực hiện một cuộc thăm dò trên một trang mạng xã hội để kiểm tra xem họ có thích dùng dấu chấm phẩy hay không và không quá ngạc nhiên. Theo như dự đoán và thực tế, số người thích sử dụng dấu chấm phẩy chiếm đa số.
Sau khi sử dụng dấu chấm phẩy trong nhiều năm, vào mùa thu năm 2020, tôi quyết định thử tránh chúng khi có thể. Tôi thiết lập Prettier để tự động xóa dấu chấm phẩy khỏi mã của mình, trừ khi có một cấu trúc mã cụ thể yêu cầu chúng.
Bây giờ tôi thấy thật tự nhiên khi không dùng dấu chấm phẩy và tôi nghĩ mã trông đẹp hơn và dễ đọc hơn.
Điều này là hoàn toàn có thể vì JavaScript không yêu cầu nghiêm ngặt về dấu chấm phẩy. Khi có vị trí cần dấu chấm phẩy, nó sẽ thêm dấu chấm phẩy vào phía sau.
Đây được gọi là chức năng “Chèn dấu chấm phẩy tự động“.
Điều quan trọng là phải biết các quy tắc sử dụng dấu chấm phẩy. Điều này sẽ cho phép bạn tránh việc viết mã sẽ tạo ra lỗi trước khi nó không hoạt động như bạn mong đợi.
Các quy tắc của chèn dấu chấm phẩy tự động trong JavaScript
Trình phân tích cú pháp JavaScript sẽ tự động thêm dấu chấm phẩy khi trong quá trình phân tích cú pháp mã nguồn, nó tìm thấy các tình huống cụ thể sau:
- Khi dòng tiếp theo bắt đầu bằng mã ngắt dòng hiện tại (mã có thể xuất hiện trên nhiều dòng)
- Khi dòng tiếp theo bắt đầu bằng }, đóng khối hiện tại
- Khi đến cuối tệp mã nguồn
- Khi có một câu lệnh return trên chính dòng của nó
- Khi có một câu lệnh break trên chính dòng của nó
- Khi có một câu lệnh throw trên chính dòng của nó
- Khi có một câu lệnh continue trên chính dòng của nó
Ví dụ về chèn dấu chấm phẩy tự động trong JavaScript
Dựa trên các quy tắc trên, đây là một số ví dụ.
const hey = 'hey'const you = 'hey'const heyYou = hey + ' ' + you['h', 'e', 'y'].forEach((letter) => console.log(letter))
Code language: JavaScript (javascript)Bạn sẽ nhận lại lỗi “Uncaught TypeError: Cannot read property ‘forEach’ of undefined” vì dựa trên quy tắc 1, JavaScript cố gắng diễn giải mã là
const hey = 'hey';const you = 'hey';const heyYou = hey + ' ' + you['h', 'e', 'y'].forEach((letter) => console.log(letter))
Code language: JavaScript (javascript)Đoạn mã này:
(1 + 2).toString()
Code language: CSS (css)in ra “3”.
Thay vào đó, nó tạo ra “TypeError: b is not a function”, bởi vì JavaScript cố gắng giải thích nó là
const a = 1 const b = 2 const c = a + b(a + b).toString()
Code language: JavaScript (javascript)Một ví dụ khác dựa trên quy tắc 4:
(() => { return { color: 'white' }})()
Code language: JavaScript (javascript)Bạn mong đợi giá trị trả về của hàm được gọi ngay lập tức này là một đối tượng có chứa thuộc tính màu, nhưng không phải vậy. Thay vào đó, nó là không xác định, bởi vì JavaScript chèn một dấu chấm phẩy sau khi trả về.
(() => { return { color: 'white' }})()
Code language: JavaScript (javascript)Bạn nghĩ rằng mã này hiển thị ‘0’ trong một hộp thoại cảnh báo:
1 + 1 -1 + 1 === 0 ? alert(0) : alert(2)
nhưng thay vào đó nó lại hiển thị 2 vì JavaScript (quy tắc 1) diễn giải nó là:
1 + 1 -1 + 1 === 0 ? alert(0) : alert(2)
Kết luận
Hãy cẩn thận – một số người rất cố chấp về dấu chấm phẩy. Thành thật mà nói, tôi chả quan tâm đâu. Công cụ cung cấp cho chúng ta tùy chọn không sử dụng nó, vì vậy chúng ta có thể tránh dấu chấm phẩy nếu muốn.
Tôi không đề xuất bất cứ điều gì về mặt này hay mặt khác. Chỉ cần đưa ra quyết định của riêng dựa trên những gì phù hợp với bạn. Đối với tôi thì tôi thích chèn dấu chấm phẩy tự động
Hãy cẩn thận với các câu lệnh return. Nếu bạn trả về một thứ gì đó, hãy thêm nó vào cùng dòng với return (kể cả throw, break, continue).
Không bao giờ bắt đầu một dòng bằng dấu ngoặc đơn, vì chúng có thể được nối với dòng trước đó để tạo thành một lệnh gọi hàm hoặc một tham chiếu phần tử mảng
Và cuối cùng, hãy luôn kiểm tra mã của bạn để đảm bảo rằng nó thực hiện những gì bạn muốn.
Cảm ơn bạn đã theo dõi bài viết!
Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.
Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.
TỔNG HỢP TÀI LIỆU HỌC LẬP TRÌNH CƠ BẢN CHO NGƯỜI MỚI BẮT ĐẦU
KHOÁ HỌC BOOTCAMP JAVA/PHP/.NET TRỞ THÀNH LẬP TRÌNH VIÊN TRONG 5-6 THÁNG
