Javascript coding convention
File
- Khi đặt tên file chỉ được dùng lowercase, dùng dấu
-
để nối các từ trong tên file. - Tên file với đuôi mở rộng sẽ để dấu
.
ngăn cách. Ví dụ.env.example
thay vì đặt là.env-example
- File Encoding phải là UTF-8
Object, Array
- Khai báo object dùng
{}
không sử dụngnew Object()
- Khai báo array dùng
[]
không sử dụngnew Array()
- Không sử dụng các reserved words cho các key của Object
- Khi thêm phần tử vào mảng dùng
push()
không dùngindex
của array
// bad
users[users.length] = 'new user';
// good
users.push('new user');
- Khi muốn copy một array dùng
...
const itemsCopy = [...items];
- Convert từ array sang object sử dụng
Array.prototype.slice
String, Interger, …
- Không dùng từ khóa
var
để khai báo, sử dụnglet
. Dùngconst
cho những biến hằng - Khai báo
string
chỉ dùng'
không nên dùng"
- Convert sang
string
chỉ cộng thêm''
vào trước biến, không cộng vào sau - Khi biến
string
1 dòng không quá 100 kí tự. - Sử dụng
Array#join
để nối chuối trong mảng - Khi nối text với 1 biến sử dụng
prefer-template
function sayHi(name) {
return `How are you, ${name}?`;
}
- Khi ép kiểu sang
int
thì dùngNumber
hoặc dùngparseInt
thì phải thêm param radixparseInt(string, 10)
- Khai báo biến là element html thêm
$
trước tên biến :let $sidebar = $('.sidebar');
- Khai báo biến đều bắt đầu bằng từ khóa tương ứng, không sử dụng
,
để khai báo nhiều biến - Những biết cùng dạng thì khai báo cùng nhau
const goSportsTeam = true;
const items = getItems();
let dragonball;
let i;
let length;
Đặt tên
- Đặt tên biến và tên function sử dụng Camel case
- Đặt tên class sử dụng PascalCase
- Khi đặt tên có tính tự giải thích
- Khi đặt tên biến cho các element với jQuery thêm
$
vào trước tên biến :let $sidebar = $('.sidebar');
- Khi comment nhiều dòng dùng
/** ... */
- Khi comment 1 dòng dùng
//
và comment vào 1 dòng mới. Bên trên phải là 1 dòng trắng
function getType() {
console.log('fetching type...');
// set the default type to 'no type'
var type = this.type || 'no type';
return type;
}
Function
- Không đặt tên param là
arguments
- Khai báo function
{
phải cùng dòng với tên function - Khai báo function sau
()
phải có 1 khoảng trắng trước{
- Không khai báo function trong 1 block, nếu khai báo trong 1 block thì phải gán cho 1 biến
let test;
if (currentUser) {
test = function test() {
console.log('Yup.');
};
}
- Khi function có tham số có giá trị mặc định luôn để ở dưới cùng
// good
function handleThings(name, opts = {}) {
// ...
}
Khoảng trắng
- Sử dụng 2 khoảng trắng tương ứng với 1 tab
- Sau các từ khóa
if
,while
,do
, … phải có 1 khoảng trắng - Trước và sau các biến có khoảng trắng
- Kết thúc 1 block phải có 1 dòng trắng
- Trước và sau các toán tử (= + - * / ) phải có 1 khoảng trắng
- Nếu array có nhiều dòng, trước và sau array có 1 dòng trắng
const arr = [[0, 1], [2, 3], [4, 5]];
const objectInArray = [
{
id: 1,
},
{
id: 2,
}
];
const numberInArray = [
1,
2
];
Các phép toán
- Sử dụng
===
và!==
thay vì dùng==
và!=
- Khi check
booleans
dùng các biểu thức rút gọn :
// bad
if (isValid === true) {
// ...
}
// good
if (isValid) {
// ...
}
// bad
if (name) {
// ...
}
// good
if (name !== '') {
// ...
}
// bad
if (collection.length) {
// ...
}
// good
if (collection.length > 0) {
// ...
}