Quy ước đặt tên tệp javascript là gì? [đóng cửa]

283

Các tập tin nên được đặt tên là một cái gì đó với hyphens.js, camelCasing.js hoặc cái gì khác?

Tôi không tìm thấy câu trả lời cho câu hỏi này ở đây .

javascript naming-conventions

— ripper234
nguồn

2

Một quy ước đặt tên tốt là đặt tên tệp khi bạn thấy thực thể đó trong mã. Cả MyPluginlớp sẽ vào MyPlugin.js. Thành MenuItemphần React sẽ đi vào MenuItem.js. Các nhà phát triển khác sẽ yêu cầu / nhập 'your-cool-module' và sử dụng nhiều biểu tượng từ nó, vì vậy hãy đặt tên cho nó cool-module.js. -

— Dan Dascalescu

1

Bài này không dựa trên tùy chọn. Trong thực tế nó là quan trọng. Tại đây, bạn có một hướng dẫn được tạo bởi Google - google.github.io/styleguide/jsguide.html#file-name . (Hướng dẫn về Phong cách Google JavaScript)

— zwitterion

184

Một quy ước đặt tên có thể là sử dụng một cái gì đó tương tự như lược đồ đặt tên mà jQuery sử dụng. Nó không được áp dụng phổ biến nhưng nó khá phổ biến.

product-name.plugin-ver.sion.filetype.js

trong đó cặp product-name+ plugincũng có thể biểu thị một không gian tên và mô-đun . Các versionvà filetypethường không bắt buộc.

filetypecó thể là một cái gì đó liên quan đến cách nội dung của tập tin. Thường thấy là:

min cho các tập tin rút gọn
custom cho các tập tin được xây dựng hoặc sửa đổi tùy chỉnh

Ví dụ:

jquery-1.4.2.min.js
jquery.plugin-0.1.js
myapp.invoice.js

— Bryan Menard
nguồn

31

Tôi đồng ý với những gì bạn nói. Nhưng có một điều tôi hiện đang vật lộn với: nếu 'plugin' chứa hai từ thì sao? Phân chia chúng bằng dấu chấm? jquery.myPlugin-1.0.0.js hoặc jquery.my.plugin-1.0.0.js hoặc jquery.my_plugin-1.0.0.js hoặc jquery.myplugin-1.0.0.js hoặc thậm chí jquery.my-plugin- 1.0.0.js? Có lẽ bạn có thể hoàn thành ví dụ của bạn với điều đó, cảm ơn!

— mayrs

4

Còn các mô-đun AMD thì sao? Nếu bạn sử dụng phiên bản trong tên tệp, bạn phải thay đổi rất nhiều tệp nếu số phiên bản thay đổi.

— knut

3

@ Quân, đây là một bài viết cũ, nhưng một tìm kiếm nhanh hơn cho thấy các plugin jquery không tuân theo bất kỳ quy ước cụ thể nào. Dường như (1) đẩy các từ lại với nhau, (2) sử dụng trường hợp cột sống và (3) sử dụng camelCase đều được sử dụng với tần suất gần tương đương.

— bholben

Đừng quên rằng một số hệ thống phiên bản và tệp có vấn đề để nhận ra sự khác biệt giữa một từ viết thường và cùng một từ un trên hoặc camelCase (ví dụ: "ThisWord" giống như "từ này" trong một số môi trường). Một số điều cần lưu ý khi sử dụng quy ước camelCase.

— amypellegrini 11/07/2015

@knut bạn không nên tải thông qua tên phiên bản, nhưng ánh xạ tên mô-đun vào một tệp phiên bản cụ thể.

— dinois

132

Tôi không biết về bất kỳ quy ước cụ thể nào đối với các tệp javascript vì chúng không thực sự độc đáo trên web so với các tệp css hoặc tệp html hoặc bất kỳ loại tệp nào khác như thế. Có một số điều "an toàn" bạn có thể làm khiến ít có khả năng bạn sẽ vô tình gặp phải sự cố đa nền tảng:

Sử dụng tất cả tên tệp chữ thường. Có một số hệ điều hành không phân biệt chữ hoa chữ thường và sử dụng tất cả chữ thường ngăn ngừa việc vô tình sử dụng hai tệp chỉ khác nhau trong trường hợp có thể không hoạt động trên một số hệ điều hành.
Đừng sử dụng khoảng trắng trong tên tệp. Trong khi về mặt kỹ thuật này có thể được thực hiện để làm việc, có rất nhiều lý do tại sao không gian trong tên tệp có thể dẫn đến các vấn đề.
Một dấu gạch nối là OK cho một dấu tách từ. Nếu bạn muốn sử dụng một số loại dấu phân cách cho nhiều từ thay vì dấu cách hoặc dấu cách như trong various-scripts.jsdấu gạch nối, dấu gạch nối là dấu phân cách an toàn và hữu ích và thường được sử dụng.
Hãy suy nghĩ về việc sử dụng số phiên bản trong tên tệp của bạn. Khi bạn muốn nâng cấp tập lệnh của mình, hãy lập kế hoạch cho các hiệu ứng của bộ nhớ đệm trình duyệt hoặc CDN. Cách đơn giản nhất để sử dụng bộ nhớ đệm dài hạn (cho tốc độ và hiệu quả), nhưng nâng cấp ngay lập tức và an toàn khi bạn nâng cấp tệp JS là đưa số phiên bản vào tên tệp hoặc đường dẫn được triển khai (như jQuery làm với jquery-1.6.2.js ) và sau đó bạn tăng / thay đổi số phiên bản đó bất cứ khi nào bạn nâng cấp / thay đổi tệp. Điều này sẽ đảm bảo rằng không có trang nào yêu cầu phiên bản mới hơn được phục vụ phiên bản cũ hơn từ bộ đệm.

— bạn bè
nguồn

56

Không có quy ước chính thức, phổ quát , để đặt tên các tệp JavaScript.

Có một số tùy chọn khác nhau:

scriptName.js
script-name.js
script_name.js

là tất cả các quy ước đặt tên hợp lệ, tuy nhiên tôi thích quy ước đặt tên được đề xuất của jQuery (đối với các plugin jQuery, mặc dù nó hoạt động cho bất kỳ JS nào)

jquery.pluginname.js

Cái hay của quy ước đặt tên này là nó mô tả rõ ràng sự ô nhiễm không gian tên toàn cầu đang được thêm vào.

foo.js thêm window.foo
foo.bar.js thêm window.foo.bar

Bởi vì tôi đã bỏ phiên bản: nên đặt sau tên đầy đủ, tốt nhất là được phân tách bằng dấu gạch nối, với các khoảng thời gian giữa các phiên bản chính và phụ:

foo-1.2.1.js
foo-1.2.2.js
...
foo-2.1.24.js

— zzzzov
nguồn

10

+1 cho The beauty to this naming convention is that it explicitly describes the global namespace pollution being added., không bao giờ nhận thấy rằng

— Adrien Be

2

Câu hỏi duy nhất của tôi là phải làm gì nếu bạn có một tập tin mà tạo ra Foohoặc myFoo, bạn chỉ cần đặt tên cho tập tin Foo.jshoặc myFoo.jstương ứng?

— dấu chấm phẩy

13

Câu hỏi trong liên kết bạn đã nói về cách đặt tên biến JavaScript, không phải về cách đặt tên tệp, vì vậy hãy quên câu hỏi đó cho bối cảnh bạn đặt câu hỏi.

Đối với việc đặt tên tập tin, nó hoàn toàn là một vấn đề sở thích và hương vị. Tôi thích đặt tên tệp bằng dấu gạch nối vì sau đó tôi không phải lấy phím shift, như tôi làm khi xử lý tên tệp camelCase; và bởi vì tôi không phải lo lắng về sự khác biệt giữa tên tệp Windows và Linux (tên tệp Windows không phân biệt chữ hoa chữ thường, ít nhất là qua XP).

Vì vậy, câu trả lời, giống như rất nhiều, là "nó phụ thuộc" hoặc "tùy thuộc vào bạn."

Một quy tắc bạn nên tuân theo là nhất quán trong quy ước bạn chọn.

— Pete Wilson
nguồn

6

+1 cho lý do gạch nối so với camelCase.

— cellepo

6

Tôi thường thích các dấu gạch ngang với chữ thường, nhưng có một điều chưa được đề cập là đôi khi thật tuyệt khi có tên tệp khớp chính xác với tên của một mô-đun hoặc chức năng tức thời có trong.

Ví dụ: tôi có một mô-đun tiết lộ được khai báo var knockoutUtilityModule = function() {...}trong tệp riêng của mình có tên là knockoutUtilityModule.js, mặc dù về mặt khách quan, tôi thích loại trực tiếp-Utility-module.js.

Tương tự, vì tôi đang sử dụng cơ chế đóng gói để kết hợp các tập lệnh, tôi đã thực hiện để xác định các hàm khả thi (mô hình chế độ xem theo khuôn mẫu, v.v.) mỗi tệp trong tệp riêng của họ, kiểu C #, để duy trì. Ví dụ: ProductDescriptorViewModel tự tồn tại bên trong ProductDescriptorViewModel.js (Tôi sử dụng chữ hoa cho các hàm khả dụng).

— Hội trường Tom W
nguồn