```javascript
// Không tốt
var a = 1;
var b = 2;
// Tốt
const a = 1;
const b = 2;
```
3 nó chỉ có nghĩa trong một phạm vi xác định nhất [Phạm vi khối], không giống như ```javascript
// Không tốt
var a = 1;
var b = 2;
// Tốt
const a = 1;
const b = 2;
```
6 có nghĩa trong một hàm [Phạm vi chức năng] Đối với những ai chưa biết, Google đã cho ra mắt Hướng dẫn về phong cách viết code Javascript chỉ ra cách [Google tin là] sẽ làm cho code viết ra sạch sẽ và dễ hiểu hơn
Đây là những hướng dẫn để duy trì phong cách phù hợp trong tệp nguồn chứ không phải là những quy tắc khó hoặc nhanh để viết mã Javascript khả dụng. Điều này khá phù hợp với Javascript – một ngôn ngữ linh hoạt cho phép nhiều sự lựa chọn phong phú
Google và Airbnb có 2 trong những Style guide nổi tiếng nhất. Các bạn nên xem qua cả 2 nếu đang dành nhiều thời gian để viết code Javascript
Bên dưới là 13 điều khiển được cho là thú vị và thích hợp nhất từ Google’s JS Style Guide. Họ nhắc đến mọi thứ từ những vấn đề đang tranh cãi gay gắt [như tab vs dấu cách, dấu chấm phẩy. ] đến một vài vấn đề chuyên biệt khác nhau khiến tác giả phải ngạc nhiên. Họ chắc chắn đã thay đổi cách viết mã JS sau điều này
Với mỗi quy định tác giả sẽ tóm tắt lại, theo sau đó là một dòng trích dẫn mô tả chi tiết quy định đó trong Style Guide. Những nơi cần thiết, tác giả cũng sẽ cung cấp ví dụ giả thực tiễn và so sánh nó với mã không viết theo hướng dẫn để các bạn có góc nhìn tổng quan hơn
Use space chứ không sử dụng tab
Bên cạnh các dãy kết thúc dòng, ký tự không gian theo bảng ASCII [0x20] là ký tự khoảng trắng duy nhất xuất hiện bất cứ nơi nào trong tệp nguồn. Điều này có nghĩa là. Tab ký tự không được sử dụng để canh lề
Hướng dẫn này sẽ chỉ cho bạn cách sử dụng 2 lần phím cách [chứ không phải 4] để canh lề
// bad
function foo[] {
∙∙∙∙let name;
}// bad
function bar[] {
∙let name;
}// good
function baz[] {
∙∙let name;
}
Dấu chấm phẩy [;] là bắt buộc
Mỗi câu lệnh đều phải kết thúc bằng dấu ;
Unsigned character character ;
Mặc dù tôi [- tác giả] không tưởng tượng nổi tại sao nhiều người lại bất đồng với ý kiến này, việc sử dụng dấu ; . Google chắc chắn đang chọn sử dụng dấu ;
// bad
let luke = {}
let leia = {}
[luke, leia].forEach[jedi => jedi.father = 'vader']
// good
let luke = {};
let leia = {};
[luke, leia].forEach[[jedi] => {
jedi.father = 'vader';
}];
Please [tạm thời] not used ES6 Module
Vui lòng [tạm thời] chưa sử dụng các mô-đun ES6 [tức là các từ khóa đầu vào] bởi vì nghĩa của chúng vẫn chưa được giải quyết xong. Lưu ý là điều này sẽ được xem xét lại ngay khi ngữ nghĩa đã được định nghĩa
// Don't do this kind of thing yet://------ lib.js ------
export
function
square[x]
{
return
x
*
x;
}
export
function
diag[x,
y]
{
return
sqrt[square[x]
+
square[y]];
}
//------ main.js ------
import
{
square,
diag
}
from
'lib';
Căn ngang không được khuyến khích [nhưng cũng không bị cấm]
Điều khoản này được cho phép nhưng Google Style không khuyến khích nó. Thôi chí việc duy trì căn ngang ở những nơi đã từng được căn ngang còn không bắt buộc
Căn ngang là việc thêm vào mã của bạn những khoảng trống để đảm bảo các mã thông báo xuất hiện trực tiếp bên dưới các mã thông báo khác của dòng trước
// bad
{
tiny: 42,
longer: 435,
};
// good
{
tiny: 42,
longer: 435,
};
Don't use var more
Khai báo tất cả các biến cục bộ với const hoặc let. Sử dụng const theo mặc định, ngoại trừ khi một biến cần được gán lại. Không thể sử dụng từ khóa var
Tôi vẫn còn thấy mọi người sử dụng var trong các mẫu mã trên StackOverflow và những nơi khác. Tôi không thể nói rằng vẫn có những người ngoài kia đang sử dụng nó hay đó cũng chỉ là trường hợp của một thói quen đang chết dần thôi
________số 8Nên sử dụng arrow function
Arrow function cung cấp một cú pháp thu gọn và sửa đổi nhiều khó khăn khi viết cú pháp. Nên sử dụng chức năng mũi tên thay vì từ khóa chức năng, đặc biệt là cho các chức năng lồng nhau
Thú thực là tôi chỉ nghĩ là chức năng mũi tên tuyệt vời vì họ nhìn ngắn gọn và dễ chịu hơn, hóa ra thì họ giải quyết được rất nhiều vấn đề
// bad
[1, 2, 3].map[function [x] {
const y = x + 1;
return x * y;
}];// good
[1, 2, 3].map[[x] => {
const y = x + 1;
return x * y;
}];
Use template string instead of concatenation
Sử dụng các chuỗi mẫu [được phân định bằng `] thay vì các chuỗi nối phức tạp, đặc biệt khi có nhiều chuỗi ký tự. Chuỗi mẫu có thể trải rộng trên nhiều dòng
```javascript
// Không tốt
var a = 1;
var b = 2;
// Tốt
const a = 1;
const b = 2;
```
0Không sử dụng các dòng liên tục đối với các chuỗi dài
Không sử dụng các dòng liên tục [ nghĩa là, kết thúc 1 dòng bên trong 1 chuỗi ký tự với một \] trong bất kể cả ký tự chuỗi mẫu hay bình thường. Mặc dù ES5 cho phép điều này nhưng nó có thể dẫn đến các lỗi nếu bất kỳ khoảng trắng nào theo dấu gạch chéo và ít rõ ràng hơn so với người đọc
Thật thú vị và quy định này Google và Airbnb lại không đồng ý với nhau [theo hướng dẫn Airbnb]
Trong khi Google khuyến mãi nối lại các chuỗi dài hơn [như bên dưới] thì Airbnb lại nhấn mạnh rằng không nên làm gì cả và cho phép các chuỗi cứ kéo dài đến khi nào cần
```javascript
// Không tốt
var a = 1;
var b = 2;
// Tốt
const a = 1;
const b = 2;
```
1"vì. of” được khuyến mãi hơn “for loop”
Với ES6, ngôn ngữ hiện tại có 3 loại khác nhau của các vòng lặp for. Tất cả đều có thể sử dụng, mặc dù vòng lặp for-of nên được sử dụng khi có thể
Điều này có vẻ hơi kỳ lạ nếu bạn hỏi tôi, nhưng tôi nghĩ mình vẫn nên đề cập đến vì thực sự thú vị là Google tuyên bố có một dạng tốt hơn của vòng lặp for
Tôi luôn bị ấn tượng rằng vì. in loops better than for objects, while for. of the reason better with the value in array [mảng]. Đây là một trường hợp điển hình của “công việc của mọi người”
Tuy Google không thực sự chỉ ra ngoài đối xứng với ý tưởng này nhưng vẫn thực sự thú vị khi biết rằng họ có sở thích sử dụng vòng lặp này hơn
Không sử dụng eval[]
Don't used eval or is Function[…string] [ngoại trừ code loader]. Những tính năng này khá nguy hiểm và không hoạt động trong môi trường CSP
Trang MDB cho eval[] even also has 1 section call is “ Don't use eval”
// bad0
let luke = {}
let leia = {}
[luke, leia].forEach[jedi => jedi.father = 'vader']
Hằng số phải đạt được tên trong ALL_UPPERCASE, được tách ra bởi gạch dưới
Tên các hằng số sử dụng CONSTANT_USE. Tất cả các ký tự phải viết hoa với các khoảng cách nhau bằng dấu gạch dưới
Nếu bạn chắc chắn rằng một biến không nên thay đổi, bạn có thể chỉ ra điều này bằng cách viết hoa tên hằng số. Điều này làm bất biến của hằng số trở nên hiển nhiên khi nó được sử dụng xuyên suốt mã của bạn
Lưu ý là quy định này không áp dụng với các hằng số trong phạm vi chức năng. Trong trường hợp này, nó nên được viết bằng camelCase
// bad1
let luke = {}
let leia = {}
[luke, leia].forEach[jedi => jedi.father = 'vader']
Một biến trên khai báo
Mỗi khai báo biến cục bộ chỉ khai báo 1 biến. những khai báo như let a = 1, b = 2 không nên sử dụng
// bad2
let luke = {}
let leia = {}
[luke, leia].forEach[jedi => jedi.father = 'vader']
Use ‘ chứ không phải “
Các chuỗi ký tự thông thường thường được phân cách bằng dấu ‘ hơn là dấu ‘’
Lời khuyên. if a string has contains dấu ‘. Vui lòng xem xét sử dụng chuỗi bảng nhóm để tránh phải thoát
// bad3
let luke = {}
let leia = {}
[luke, leia].forEach[jedi => jedi.father = 'vader']
Ghi chú cuối cùng
Như tôi đã nói ngay từ đầu, đây không phải là mệnh lệnh. Google chỉ là một trong những công ty công nghệ lớn và những điều trên chỉ là đề xuất thôi. Tuy nhiên, cũng phải nói rằng thực sự thú vị khi đọc các đề xuất phong cách được xuất bản bởi các công ty như Google – nơi đã tuyển dụng rất nhiều người tài năng – đã dành nhiều thời gian để viết ra những đoạn mã tuyệt vời này
Bạn có thể code theo những quy định này nếu bạn muốn theo sự chỉ dẫn viết mã nguồn của Google, tuy nhiên cũng sẽ có rất nhiều người không tán thành, và bạn cứ tự nhiên gạt hết đi nhưng thứ không phù hợp với bản thân.
Cá nhân tôi nghĩ là có nhiều trường hợp sách hướng dẫn của Airbnb hấp dẫn hơn so với Google. Bất kể lập trường của bạn như thế nào, điều quan trọng nhất vẫn là phải giữ được 1 kiểu hệ thống nhất khi viết bất kỳ dòng mã nào