Hướng dẫn why do we use camelcase in javascript? - tại sao chúng ta sử dụng camelcase trong javascript?


Luôn luôn sử dụng các quy ước mã hóa tương tự cho tất cả các dự án JavaScript của bạn.


Quy ước mã hóa JavaScript

Các quy ước mã hóa là hướng dẫn phong cách để lập trình. Họ thường bao gồm:style guidelines for programming. They typically cover:

  • Đặt tên và quy tắc khai báo cho các biến và chức năng.
  • Các quy tắc cho việc sử dụng không gian trắng, thụt lề và bình luận.
  • Thực tiễn lập trình và nguyên tắc.

Quy ước mã hóa Chất lượng an toàn:secure quality:

  • Cải thiện khả năng đọc mã
  • Làm cho bảo trì mã dễ dàng hơn

Các quy ước mã hóa có thể được ghi lại các quy tắc cho các nhóm tuân theo, hoặc chỉ là thực hành mã hóa cá nhân của bạn.

Trang này mô tả các quy ước mã JavaScript chung được sử dụng bởi W3Schools. Bạn cũng nên đọc chương tiếp theo "Thực tiễn tốt nhất" và học cách tránh những cạm bẫy mã hóa.
You should also read the next chapter "Best Practices", and learn how to avoid coding pitfalls.


Tên biến

Tại W3Schools, chúng tôi sử dụng Camelcase cho tên định danh (biến và hàm).camelCase for identifier names (variables and functions).

Tất cả tên bắt đầu bằng một lá thư.letter.

Ở cuối trang này, bạn sẽ tìm thấy một cuộc thảo luận rộng hơn về các quy tắc đặt tên.

firstName = "john"; lastName = "doe";
lastName = "Doe";

Giá = 19,90; thuế = 0,20;
tax = 0.20;

fullprice = price + (giá * thuế);


Không gian xung quanh các nhà khai thác

Luôn đặt khoảng trắng xung quanh các toán tử (= + - * /) và sau dấu phẩy:

Examples:

Đặt x = y + z; const myarray = ["volvo", "saab", "fiat"];
const myArray = ["Volvo", "Saab", "Fiat"];



Mã thụt mã

Luôn luôn sử dụng 2 không gian để thụt vào các khối mã:

Functions:

hàm tocelsius (fahrenheit) {& nbsp; trở lại (5/9) * (Fahrenheit - 32); }
  return (5 / 9) * (fahrenheit - 32);
}

Không sử dụng các tab (Tabulators) để thụt vào. Các biên tập viên khác nhau giải thích các tab khác nhau.


Quy tắc tuyên bố

Các quy tắc chung cho các tuyên bố đơn giản:

  • Luôn kết thúc một tuyên bố đơn giản với một dấu chấm phẩy.

Examples:

const cars = ["Volvo", "saab", "fiat"];

const person = {& nbsp; tên đầu tiên: "John", & nbsp; Tên cuối cùng: "doe", & nbsp; Tuổi: 50, & NBSP; Eyecolor: "màu xanh"};
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

Các quy tắc chung cho các tuyên bố phức tạp (hợp chất):

  • Đặt khung mở ở cuối dòng đầu tiên.
  • Sử dụng một không gian trước khung mở.
  • Đặt khung đóng trên một dòng mới, không có không gian hàng đầu.
  • Không kết thúc một tuyên bố phức tạp với một dấu chấm phẩy.

Functions:

hàm tocelsius (fahrenheit) {& nbsp; & nbsp; return (5/9) * (fahrenheit - 32); }
  return (5 / 9) * (fahrenheit - 32);
}

Loops:

for (let i = 0; i <5; i ++) {& nbsp; & nbsp; x+= i;}
  x += i;
}

Conditionals:

if (thời gian <20) {& nbsp; & nbsp; chào hỏi = "ngày tốt";} khác {& nbsp; Lời chào = "Chào buổi tối";}
  greeting = "Good day";
} else {
  greeting = "Good evening";
}


Quy tắc đối tượng

Quy tắc chung cho định nghĩa đối tượng:

  • Đặt khung mở trên cùng một dòng với tên đối tượng.
  • Sử dụng Đại tràng cộng với một không gian giữa mỗi thuộc tính và giá trị của nó.
  • Sử dụng báo giá xung quanh các giá trị chuỗi, không phải xung quanh các giá trị số.
  • Không thêm dấu phẩy sau cặp giá trị tài sản cuối cùng.
  • Đặt giá đỡ đóng trên một dòng mới, không có không gian hàng đầu.
  • Luôn luôn kết thúc & nbsp; một định nghĩa đối tượng với dấu chấm phẩy.

Thí dụ

const person = {& nbsp; tên đầu tiên: "John", & nbsp; Tên cuối cùng: "doe", & nbsp; Tuổi: 50, & NBSP; Eyecolor: "màu xanh"};
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

Các quy tắc chung cho các tuyên bố phức tạp (hợp chất):

Đặt khung mở ở cuối dòng đầu tiên.


Sử dụng một không gian trước khung mở.

Đặt khung đóng trên một dòng mới, không có không gian hàng đầu.

Không kết thúc một tuyên bố phức tạp với một dấu chấm phẩy.

Thí dụ

Các đối tượng ngắn có thể được viết, trên một dòng, chỉ sử dụng khoảng trắng giữa các thuộc tính, như thế này:
"Hello Dolly.";

const person = {firstName: "john", lastName: "doe", tuổi: 50, eyecolor: "blue"};


Chiều dài dòng

Để dễ đọc, tránh các dòng dài hơn 80 ký tự.

  • Nếu một câu lệnh JavaScript không phù hợp trên một dòng, thì nơi tốt nhất để phá vỡ nó, là sau một nhà điều hành hoặc dấu phẩy.camelCase
  • Document.getEuityById ("Demo"). Internhtml = "Xin chào Dolly.";UPPERCASE (We don't, but it's quite common)
  • Hãy tự mình thử »UPPERCASE

Đặt tên quy ướchyp-hens, camelCase, or under_scores in variable names?

Luôn luôn sử dụng cùng một quy ước đặt tên cho tất cả các mã của bạn. Ví dụ:

Tên biến và chức năng được viết dưới dạng Camelcase

Các biến toàn cầu được viết bằng chữ hoa (chúng tôi không, nhưng nó khá phổ biến)

Hằng số (như PI) được viết bằng chữ hoa

Bạn có nên sử dụng Hens, Camelcase hoặc Under_scores trong các tên biến?

Underscores:

Đây là một lập trình viên câu hỏi thường thảo luận. Câu trả lời phụ thuộc vào người bạn hỏi:

Hyphens trong HTML và CSS:

PascalCase:

Các thuộc tính HTML5 có thể bắt đầu với dữ liệu- (lượng tử dữ liệu, giá dữ liệu).

camelCase:

CSS sử dụng dấu gạch nối trong tên thuộc tính (kích thước phông chữ).

Hyphens có thể bị nhầm lẫn là những nỗ lực trừ. HNELPHEN không được phép trong tên JavaScript.


Nhiều lập trình viên thích sử dụng dấu gạch dưới (DATE_OF_BIRTH), đặc biệt là trong cơ sở dữ liệu SQL.

Dấu gạch dưới thường được sử dụng trong tài liệu PHP.

Pascalcase thường được các lập trình viên C ưa thích.


Camelcase được sử dụng bởi chính JavaScript, bởi JQuery và các thư viện JavaScript khác.

Không bắt đầu tên với một dấu hiệu $. Nó sẽ đưa bạn vào mâu thuẫn với nhiều tên thư viện JavaScript.

Đang tải JavaScript trong HTML

Sử dụng cú pháp đơn giản để tải các tập lệnh bên ngoài (thuộc tính loại là không cần thiết):

const obj = getElementById("demo")

Truy cập các yếu tố HTML

Ghé thăm Hướng dẫn kiểu HTML.


Tiện ích mở rộng tệp

Các tệp HTML nên có phần mở rộng .html (.htm được cho phép)..html extension (.htm is allowed).

Các tập tin CSS nên có phần mở rộng .CSS..css extension.

Các tệp JavaScript nên có phần mở rộng .js..js extension.


Sử dụng tên tệp chữ thường

Hầu hết các máy chủ web (Apache, UNIX) đều nhạy cảm với tên tệp:

London.jpg không thể được truy cập như London.jpg.

Các máy chủ web khác (Microsoft, IIS) không nhạy cảm với trường hợp:

London.jpg có thể được truy cập dưới dạng London.jpg hoặc London.jpg.

Nếu bạn sử dụng hỗn hợp trên và chữ thường, bạn phải cực kỳ nhất quán.

Nếu bạn chuyển từ một trường hợp không nhạy cảm, sang một máy chủ nhạy cảm với trường hợp, ngay cả các lỗi nhỏ cũng có thể phá vỡ trang web của bạn.

Để tránh những vấn đề này, luôn luôn sử dụng tên tệp chữ thường (nếu có thể).


Màn biểu diễn

Các quy ước mã hóa không được sử dụng bởi máy tính. Hầu hết các quy tắc có ít tác động đến việc thực hiện các chương trình.

Thắng và không gian thêm không có ý nghĩa trong các kịch bản nhỏ.

Đối với mã trong phát triển, khả năng đọc nên được ưu tiên. Các kịch bản sản xuất lớn hơn nên được giảm thiểu.



Các chức năng JavaScript có nên là Camelcase không?

Đối với tên chức năng, sử dụng Camelcase, bắt đầu với ký tự chữ thường.Sử dụng các tên ngắn gọn, có thể đọc được và ngữ nghĩa khi thích hợp.. Use concise, human-readable, and semantic names where appropriate.

JavaScript có được viết trong Camelcase không?

Camelcase được sử dụng bởi chính JavaScript, bởi JQuery và các thư viện JavaScript khác.Không bắt đầu tên với một dấu hiệu $.Nó sẽ đưa bạn vào mâu thuẫn với nhiều tên thư viện JavaScript.. Do not start names with a $ sign. It will put you in conflict with many JavaScript library names.

Tại sao Camelcase lại tốt?

Vỏ Camelcase Pro Camel dễ dàng hơn để gõ và gạch dưới rất khó để gõ.Trường hợp lạc đà ngắn hơn.Trường hợp lạc đà được sử dụng bởi quy ước trong rất nhiều ngôn ngữ và thư viện chính.(Bạn không được phép sử dụng đối số này khi bỏ phiếu!)easier to type, and underscores are hard to type. Camel case is shorter. Camel case is used by convention in a lot of major languages and libraries. (You weren't allowed to use this argument when voting!)