Trích dẫn đơn JavaScript

Chủ đề về việc sử dụng các trích dẫn đơn ' hoặc kép " trong JavaScript xuất hiện thường xuyên đến mức tôi nghĩ rằng mình nên tạo một chút kết hợp các mục xung quanh chủ đề này để tham khảo trong tương lai

Hôm nay, nó đã xuất hiện khi ai đó gửi PR đến kho lưu trữ cấu hình eslint tiêu chuẩn nội bộ của chúng tôi và có một số điểm khác nhau được đưa ra mà không có giải pháp hoặc giải pháp vững chắc cuối cùng thực sự

Trong bài đăng này, tôi (rất tiếc) sẽ không viết bất cứ điều gì thú vị hay sâu sắc hay thậm chí là độc đáo. Chỉ muốn tổng hợp một số ưu/nhược điểm như tôi đã thấy rải rác ở nhiều vị trí khác nhau trên web về chủ đề này

Điểm quan trọng nhất hoặc TL; DR

• Xác định một tiêu chuẩn và tuân theo nó. Không sử dụng một trong một tệp và một tệp khác trong một tệp khác hoặc thậm chí đặc biệt tránh trộn các trích dẫn trong cùng một tệp nếu có thể

Những phẩm chất cơ bản mà cả hai đều chia sẻ

• Cả hai đều đại diện cho chuỗi (yay. dây. )
• Cái nào bạn bắt đầu, phải giống cái bạn kết thúc chuỗi bằng
• Cuối cùng thực sự không có sự khác biệt giữa việc sử dụng dấu ngoặc đơn hoặc dấu ngoặc kép, nghĩa là cuối cùng cả hai đều đại diện cho một chuỗi. Hệ thống không thực sự quan tâm bạn sử dụng cái nào (nhưng bạn có thể?)
• Không cần thoát khỏi ký tự khác trong một chuỗi. Vì vậy, một chuỗi trích dẫn kép có thể có các trích dẫn đơn mà không thoát khỏi chúng và một chuỗi trích dẫn đơn có thể có các trích dẫn kép bên trong nó mà không cần phải thoát chúng
  • "Double quotes with a single ( ' ) quote in the middle"
  • 'Single quotes with a double ( " ) quote in the middle'
• Mỗi loại phải thoát khỏi loại riêng của họ
  • ________số 8_______
  • 'single quotes ( \' ) must escape a single quote'
• Trên bàn phím tiếng Đức, tiếng Hungary, tiếng Áo và nhiều bàn phím khác, bạn phải sử dụng phím Shift cho cả dấu ngoặc đơn hoặc dấu ngoặc kép
• Trên bàn phím Q của Thổ Nhĩ Kỳ, rõ ràng là ngược lại (cần để trích dẫn đơn so với trích dẫn kép)

Ưu điểm cho dấu nháy đơn

• Một đối số phổ biến cho các trích dẫn đơn là khi bạn phải viết html trong javascript
  • Nếu bạn sử dụng dấu ngoặc đơn, bạn có thể viết var html = '
    '
  • Nếu bạn sử dụng dấu ngoặc kép, bạn phải thoát khỏi mỗi dấu ngoặc kép lồng nhau " EX. var html = "
    " có thể gây khó chịu. Hoặc bạn có thể sử dụng các trích dẫn đơn trong chuỗi html, nhưng tôi không muốn bao gồm các trích dẫn cho html ở đây (điều đó sẽ gây hại)
• Các trích dẫn đơn thường có thể trông đẹp hơn khi bạn sử dụng chúng để biểu thị một chuỗi trống "0 so với "1 (có quá nhiều dấu nhỏ ở phần sau và có thể khó đọc - ahhh)

Nhược điểm cho dấu nháy đơn

Tôi chỉ có thể nghĩ ra trò lừa đảo thực sự là sao chép/dán giữa các tệp JSON và JavaScript - các trích dẫn đơn không được hỗ trợ trong các tệp JSON, vì vậy bạn phải thực hiện một loạt tìm kiếm/thay thế (và thoát khỏi các trích dẫn kép)

Ưu điểm cho dấu ngoặc kép

• JSON chỉ cho phép dấu ngoặc kép (trừ khi bạn kiểm soát dữ liệu và có thể sử dụng thư viện tự do hơn khi phân tích cú pháp JSON - nhưng tệp JSON có dấu ngoặc đơn không thực sự là tệp JSON)
• Nhiều khả năng những người mới làm quen với JS sẽ quen với dấu ngoặc kép từ các ngôn ngữ lập trình trước đây của họ
• Dấu ngoặc kép loại bỏ sự cần thiết phải thoát khỏi dấu nháy đơn khi viết câu tiếng Anh

Nhược điểm cho dấu ngoặc kép

• Phải bấm thêm phím khi muốn dùng dấu ngoặc kép

đến cuối cùng

Tôi đề nghị trích dẫn đơn như một tiêu chuẩn vững chắc. Trừ khi bạn đang sao chép các đối tượng JSON trong JavaScript và dán chúng vào các tệp JS rất nhiều - đó thường là sở thích cá nhân của tôi

Bạn đã thấy cả 'single quotes' và "double quotes" được sử dụng để viết chuỗi trong JavaScript. Bạn đang băn khoăn không biết chúng có gì khác biệt. Có một sở thích hơn khác?

Họ là những điều tương tự

Trong JavaScript, chuỗi là một dãy các ký tự được đặt trong dấu nháy đơn hoặc kép. Việc lựa chọn phong cách trích dẫn là tùy thuộc vào lập trình viên và một trong hai phong cách không có ngữ nghĩa đặc biệt so với phong cách kia. Không có loại cho một ký tự trong JavaScript - mọi thứ luôn là một chuỗi

'abc' === "abc"

Chiến lược lựa chọn ký tự trích dẫn có thể giúp bạn thoát khỏi các ký tự ' hoặc " bên trong chuỗi. Ví dụ: khi lưu trữ một đoạn mã HTML trong một biến, bạn có thể sử dụng " cho các giá trị thuộc tính HTML nếu bạn sử dụng ' để đặt chuỗi JavaScript

const div = '
...
'

Hãy nhớ rằng trong JSON, ký tự trích dẫn duy nhất được phép là dấu ngoặc kép

{
    "in_json": "you_use_only_double_quotes"
}

Dấu nháy đơn phổ biến hơn

Kiểm tra một vài kho lưu trữ nguồn của các dự án JavaScript phổ biến cho thấy rằng dấu nháy đơn được ưa chuộng hơn dấu nháy kép

ProjectDominant quote stylelodash'- 99% trích dẫnphấn'- 100% trích dẫnphản ứng'- 90% yêu cầu trích dẫn'- 97% trích dẫnchỉ huy. js'- 97% trích dẫn khoảnh khắc'- 90% trích dẫn express'- 92% trích dẫnstslib"- 100% trích dẫngỡ lỗi'- 97% trích dẫnnode-fs-extra'- 98% trích dẫnaxios'- 81% trích dẫnSử dụng ký tự trích dẫn trong các dự án phổ biến

Thực tế là các thư viện giao diện người dùng có nhiều dấu ngoặc kép hơn các thư viện khác có thể liên quan đến sự hiện diện của các đoạn HTML

Nhìn vào một số hướng dẫn về phong cách cho thấy một cách tiếp cận hỗn hợp, khoảng một nửa đề xuất dấu nháy đơn và nửa còn lại đề xuất dấu ngoặc kép

• ủng hộ đẹp hơn " dấu ngoặc kép theo mặc định
• gjslint (Google Closure Linter) ủng hộ ' dấu nháy đơn
• tiêu chuẩn (gói NPM), ủng hộ dấu nháy đơn '
• jslint ủng hộ " dấu ngoặc kép theo mặc định
• eslint ủng hộ " dấu ngoặc kép theo mặc định
• Người đóng góp TypeScript Nguyên tắc mã hóa ủng hộ dấu ngoặc kép _________

Gắn bó với một và giữ cho nó phù hợp

Để tránh phải lựa chọn mỗi khi sắp viết một chuỗi, bạn nên chọn một phong cách và gắn bó với phong cách đó. Nếu nhóm của bạn vẫn đang quyết định - hãy chọn các trích dẫn đơn, chúng phổ biến hơn. Trong ES6, bạn sẽ có tùy chọn thứ ba để đính kèm chuỗi - chuỗi

{
    "in_json": "you_use_only_double_quotes"
}

6

Những bài viết liên quan

• Giải thích cẩu biến
• Tôi có nên sử dụng toán tử so sánh đẳng thức === hoặc == trong JavaScript không?
• Hiểu thuộc tính nguyên mẫu trong JavaScript

Nút không đợi cuộc gọi cơ sở dữ liệu của bạn kết thúc?

Tìm hiểu cách cuộc gọi không đồng bộ hoạt động và làm cho ứng dụng của bạn chạy như bạn dự định. Nhận khóa học email ngắn về tính không đồng bộ và hai chương từ Hoàn thiện ứng dụng nút của bạn

Chúng tôi có thể sử dụng trích dẫn đơn trong JavaScript không?

Làm cách nào để xử lý trích dẫn đơn và trích dẫn kép trong JavaScript?

Làm cách nào để đặt trích dẫn đơn bên trong trích dẫn đơn trong JavaScript?

Làm cách nào để lấy chuỗi giữa các dấu nháy đơn trong JavaScript?