Lồng nhau nếu javascript

Trong bài này chúng ta sẽ tìm hiểu cách sử dụng lệnh if other trong Javascript, đây là lệnh dùng để rẻ chương trình thành nhiều luồng khác nhau

Bài viết này đã được đăng tại freetuts. net , không được sao chép dưới mọi hình thức.

Câu lệnh if trong Javascript dùng để kiểm tra việc loại bỏ mệnh đề nào đúng hay không, nếu đúng thì thực hiện các câu lệnh bên trong và đảo ngược nếu sai thì nó sẽ vượt qua các câu lệnh đó. Bây giờ ta sẽ tìm hiểu chi tiết nó nhé

1. Ra lệnh nếu trong javascript

Nội dung thực thi của lệnh nếu sẽ được bao quanh bởi cặp trích đoạn đóng mở {}. Cú pháp chuẩn của lệnh nếu như sau

Cú pháp up if

if (condition){
    // statment
}

Trong đó

var a = 12;
var b = 12;

if (a == b){
    alert('a và b bằng nhau');
}

0 là mệnh điều kiện và luôn luôn phải có một trong hai giá trị là

var a = 12;
var b = 12;

if (a == b){
    alert('a và b bằng nhau');
}

1 hoặc giá trị tương đương như

Bài viết này đã được đăng tại [free tuts. net]

NULL => Sai
Rot => Sai
Number other 0 => TRUE
Số 0 => SAI

Ví dụ lệnh if RUN

var a = 12;
var b = 12;

if (a == b){
    alert('a và b bằng nhau');
}

Kết quả sẽ có thông báo bật lên "a và b bằng nhau"

Trường hợp nếu các câu lệnh bên trong là câu lệnh đơn (chỉ có một câu lệnh) thì ta có thể bỏ cặp dấu ngoặc kép. Như với ví dụ trên thì ta sẽ viết lại như sau

var a = 12;
var b = 12;

if (a == b)
    alert('a và b bằng nhau');

2. Ra lệnh if other trong javascript

Lệnh khác sẽ được thực thi nếu lệnh không được thực hiện, tức là điều kiện ở điều kiện sẽ có giá trị là SAI. Như vậy khi sử dụng lệnh khác thì bắt buộc phải có lệnh nếu đứng trước nó

Cú pháp lệnh if else như sau

if (condition){
    // Code cho lệnh if
}
else{
    // Code cho lệnh else
}

Ví dụ RUN

var a = 12;
var b = 10;

if (a == b){
    alert('a và b bằng nhau');
}
else{
    alert('a và b khác nhau');
}

Trong ví dụ này thì chương trình sẽ chạy trong lệnh else vì điều kiện thực thi lệnh if không thỏa

Bạn hãy lưu ý nhé, điều kiện chạy command if is (a == b), which a = 12 and b = 10 nên biểu thức (12 == 10) sẽ có giá trị là FALSE

3. Kết hợp nhiều lệnh if other trong javascript

Ta có thể kết hợp nhiều lệnh nếu để xử lý bài toán, bằng cách thêm nhiều lệnh khác nếu phía sau. Cú pháp của nó như sau

Cú pháp nhiều lệnh if

if (condition1){
    // Code cho lệnh if 1
}
else if (condition2){
    // Code cho lệnh if 2
}
else{
    // Code cho lệnh else
}

Nếu khối lệnh if (condition1) sai và chạy thì chương trình sẽ không biên dịch các lệnh nếu phía bên dưới. Hay nói cách khác, Javascript sẽ thoát khỏi toàn bộ khối lệnh nếu có lệnh nếu lệnh đó được chạy

Ví dụ RUN

________số 8_______

Kết quả sẽ chạy ở cuối cùng của lệnh khác vì lệnh nếu bên trên không có điều kiện. Bây giờ bạn thử đổi giá trị của a thành

var a = 12;
var b = 12;

if (a == b){
    alert('a và b bằng nhau');
}

2 thì câu lệnh thứ 2 khác nếu sẽ được thực hiện

Với bài tập này, bạn cũng có thể sử dụng hai khối lệnh nếu thích sau

var a = 12;

// Khối 1
if (a > 12){
    alert('a > 12');
}

// Khối 2
if (a < 12){
    alert('a < 12');
}
else{
    alert('a = 12');
}

Tuy nhiên, về mặt tốc độ thì sẽ không tốt, vì Javascript sẽ biên dịch cho cả hai khối dù cho lệnh khối nếu ở khối 1 chạy

4. Lệnh if other lồng nhau trong javascript

Cũng giống như các ngôn ngữ lập trình khác, ta có thể lồng các câu lệnh nếu lùi lại với nhau, nghĩa là bên trong câu lệnh nếu sẽ chứa câu lệnh nếu khác

Ví dụ RUN

var a = 13;
 
// Nếu a > 12
if (a > 12)
{
    // Khai báo biến b
    var b = 20;
     
    // Nếu a bằng b
    if (a == b)
    {
        alert(' a = b ');
    }
    else { // ngược lại a khác b
        alert(' a != b ');
    }
}

5. Hàm if in HTML has not?

Đây là câu hỏi mà có một bạn đã inbox cho mình, và mình xin trả lời là không có hàm if trong HTML nha các bạn. Thay vào đó, nếu bạn muốn xử lý cách hiển thị HTML, thì có thể sử dụng lệnh nếu khác, hoặc sử dụng máy chủ ngôn ngữ phía sau như PHP, ASP, JSP

Lời kết. Vì mình đã hướng dẫn xong cách sử dụng lệnh if other trong Javascript, đây là lệnh rất hay, dùng để giảm giá chương trình thành nhiều nhánh khác nhau. Bài này mình dừng ở đây nhé, hẹn gặp lại các bạn ở bài tiếp theo

Sử dụng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

59 cho tất cả các tài liệu tham khảo của bạn; . dây dẫn.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

61,

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

Nếu bạn phải chỉ định lại tài liệu tham khảo, hãy sử dụng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63 thay vì

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

60. eslint.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Why?

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63 is block-scoped rather than function-scoped like

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Note that both

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63 and

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

59 are block-scoped, whereas

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

60 is function-scoped

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

In the above code, you can see that referencing

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

71 and

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

72 will produce a ReferenceError, while

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

73 contains the number. This is because

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

71 and

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

72 are block scoped, while

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

73 is scoped to the containing function

Objects

Use the literal syntax for object creation. eslint.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

// bad
const item = new Object();

// good
const item = {};

Use computed property names when creating objects with dynamic property names

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Use object method shorthand. eslint.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Use property value shorthand. eslint.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Group your shorthand properties at the beginning of your object declaration

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Chỉ trích dẫn thuộc tính là số nhận dạng không hợp lệ. dây dẫn.
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
80
Tại sao? . Nó cải thiện khả năng làm nổi bật cú pháp và cũng được nhiều công cụ JS tối ưu hóa dễ dàng hơn
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
0

Không gọi trực tiếp các phương thức

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

81, chẳng hạn như

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

82,

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

83 và

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

84. dây dẫn.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Ưu tiên cú pháp trải rộng đối tượng hơn

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

88 hơn đối tượng sao chép nông. Sử dụng cú pháp tham số phần còn lại của đối tượng để nhận một đối tượng mới với các thuộc tính nhất định bị bỏ qua. dây dẫn.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Mảng

Sử dụng cú pháp chữ để tạo mảng. dây dẫn.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng Array#push thay vì gán trực tiếp để thêm các mục vào một mảng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng trải rộng mảng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

91 để sao chép mảng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Để chuyển đổi một đối tượng có thể lặp lại thành một mảng, hãy sử dụng chênh lệch

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

91 thay vì

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

93 để chuyển đổi một đối tượng dạng mảng thành một mảng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

93 thay vì trải rộng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

91 để ánh xạ qua các lần lặp, vì nó tránh tạo mảng trung gian

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng các câu lệnh trả về trong các cuộc gọi lại phương thức mảng. Có thể bỏ qua phần trả về nếu thân hàm bao gồm một câu lệnh trả về một biểu thức mà không có tác dụng phụ, như sau. dây dẫn.
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
97
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
9

Sử dụng ngắt dòng sau khi mở và trước khi đóng dấu ngoặc mảng nếu một mảng có nhiều dòng
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
0

hủy diệt

Sử dụng phá hủy đối tượng khi truy cập và sử dụng nhiều thuộc tính của một đối tượng. dây dẫn.
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
98
Tại sao? . Việc lặp lại quyền truy cập đối tượng tạo ra nhiều mã lặp lại hơn, yêu cầu đọc nhiều hơn và tạo ra nhiều cơ hội mắc lỗi hơn. Phá hủy các đối tượng cũng cung cấp một trang định nghĩa duy nhất về cấu trúc đối tượng được sử dụng trong khối, thay vì yêu cầu đọc toàn bộ khối để xác định những gì được sử dụng.
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
1

Sử dụng phá hủy mảng. dây dẫn.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

Sử dụng phá hủy đối tượng cho nhiều giá trị trả về, không phá hủy mảng
Tại sao?
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
3

Dây

Sử dụng dấu ngoặc đơn

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

00 cho chuỗi. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

Các chuỗi khiến dòng dài hơn 100 ký tự không được viết trên nhiều dòng bằng cách sử dụng nối chuỗi
Tại sao?
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
5

Khi xây dựng chuỗi theo chương trình, hãy sử dụng chuỗi mẫu thay vì nối. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

Không bao giờ sử dụng

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

04 trên một chuỗi, nó mở ra quá nhiều lỗ hổng. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

Không thoát các ký tự trong chuỗi một cách không cần thiết. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

Chức năng

Sử dụng các biểu thức hàm được đặt tên thay vì khai báo hàm. dây dẫn.
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
07
Tại sao? . Điều này gây hại cho khả năng đọc và bảo trì. Nếu bạn thấy rằng định nghĩa của một hàm đủ lớn hoặc phức tạp đến mức cản trở việc hiểu phần còn lại của tệp, thì có lẽ đã đến lúc giải nén nó vào mô-đun của riêng nó. Đừng quên đặt tên rõ ràng cho biểu thức, bất kể tên đó có được suy ra từ biến chứa hay không (điều này thường xảy ra trong các trình duyệt hiện đại hoặc khi sử dụng các trình biên dịch như Babel). Điều này giúp loại bỏ bất kỳ giả định nào về ngăn xếp cuộc gọi của Lỗi. (Thảo luận)
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
8

Gói các biểu thức hàm được gọi ngay lập tức trong ngoặc đơn. dây dẫn.
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
08
Tại sao? . Lưu ý rằng trong một thế giới có các mô-đun ở khắp mọi nơi, bạn hầu như không bao giờ cần IIFE
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
9

Không bao giờ khai báo một chức năng trong một khối không có chức năng (_______16_______09,
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
10, v.v.). Thay vào đó, hãy gán chức năng cho một biến. Các trình duyệt sẽ cho phép bạn làm điều đó, nhưng tất cả chúng đều diễn giải nó theo cách khác nhau, đó là tin xấu. dây dẫn.
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
11

Ghi chú. ECMA-262 định nghĩa một

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

12 là một danh sách các câu lệnh. Một khai báo hàm không phải là một câu lệnh

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Không bao giờ đặt tên cho một tham số

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

13. Điều này sẽ được ưu tiên hơn đối tượng

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

13 được cung cấp cho mọi phạm vi chức năng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Không bao giờ sử dụng

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

13, thay vào đó hãy chọn sử dụng cú pháp nghỉ ngơi

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

91. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Sử dụng cú pháp tham số mặc định thay vì thay đổi đối số hàm

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Tránh tác dụng phụ với các tham số mặc định

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Luôn đặt thông số mặc định cuối cùng. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Không bao giờ sử dụng hàm tạo Hàm để tạo một hàm mới. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Khoảng cách trong chữ ký hàm. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Không bao giờ thay đổi tham số. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Không bao giờ chỉ định lại các thông số. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Ưu tiên sử dụng cú pháp trải rộng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

91 để gọi các hàm biến thiên. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Các hàm có chữ ký nhiều dòng hoặc lời gọi phải được thụt lề giống như mọi danh sách nhiều dòng khác trong hướng dẫn này. với mỗi mục trên một dòng, với dấu phẩy ở cuối mục cuối cùng. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Hàm mũi tên

Khi bạn phải sử dụng một chức năng ẩn danh (như khi chuyển một cuộc gọi lại nội tuyến), hãy sử dụng ký hiệu chức năng mũi tên. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

33,

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Nếu thân hàm bao gồm một câu lệnh trả về một mà không có tác dụng phụ, hãy bỏ qua dấu ngoặc nhọn và sử dụng hàm trả về ngầm định. Nếu không, hãy giữ dấu ngoặc nhọn và sử dụng câu lệnh

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

36. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

37,

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Trong trường hợp biểu thức kéo dài trên nhiều dòng, hãy đặt nó trong dấu ngoặc đơn để dễ đọc hơn

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Luôn bao gồm các dấu ngoặc đơn xung quanh các đối số để rõ ràng và nhất quán. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Tránh nhầm lẫn giữa cú pháp hàm mũi tên (

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

40) với các toán tử so sánh (

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

41,

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

42). dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Thực thi vị trí của các thân hàm mũi tên với lợi nhuận ngầm định. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Lớp & Constructor

Luôn sử dụng

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

45. Tránh thao tác trực tiếp với

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Sử dụng

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

48 để thừa kế

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

Các phương thức có thể trả về

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

35 để giúp xâu chuỗi phương thức

// bad
const item = new Object();

// good
const item = {};

Bạn có thể viết một phương thức
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
51 tùy chỉnh, chỉ cần đảm bảo rằng nó hoạt động thành công và không gây tác dụng phụ
```
// bad
const item = new Object();

// good
const item = {};
```
1

Các lớp có một hàm tạo mặc định nếu không được chỉ định. Hàm tạo trống hoặc hàm chỉ ủy quyền cho lớp cha là không cần thiết. dây dẫn.
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
52
```
// bad
const item = new Object();

// good
const item = {};
```
2

Tránh các thành viên lớp trùng lặp. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
const item = new Object();

// good
const item = {};

Các phương thức của lớp nên sử dụng
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
35 hoặc được tạo thành một phương thức tĩnh trừ khi thư viện hoặc khung bên ngoài yêu cầu sử dụng các phương thức không tĩnh cụ thể. Là một phương thức thể hiện nên chỉ ra rằng nó hoạt động khác nhau dựa trên các thuộc tính của người nhận. dây dẫn.
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
55
```
// bad
const item = new Object();

// good
const item = {};
```
4

mô-đun

Luôn sử dụng mô-đun (

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

56/

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

57) trên hệ thống mô-đun không chuẩn. Bạn luôn có thể dịch mã sang hệ thống mô-đun ưa thích của mình

// bad
const item = new Object();

// good
const item = {};

Không sử dụng nhập ký tự đại diện

// bad
const item = new Object();

// good
const item = {};

Và không xuất trực tiếp từ nhập

// bad
const item = new Object();

// good
const item = {};

Chỉ nhập từ một đường dẫn ở một nơi. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
const item = new Object();

// good
const item = {};

Không xuất các ràng buộc có thể thay đổi. dây dẫn.
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
59
Tại sao? . Mặc dù kỹ thuật này có thể cần thiết cho một số trường hợp đặc biệt, nhưng nói chung, chỉ nên xuất các tham chiếu cố định
```
// bad
const item = new Object();

// good
const item = {};
```
9

Trong các mô-đun có một lần xuất, ưu tiên xuất mặc định hơn xuất có tên. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Đặt tất cả các

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

56 ở trên câu lệnh không nhập khẩu. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Nhập nhiều dòng phải được thụt vào giống như mảng nhiều dòng và đối tượng bằng chữ. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Không cho phép cú pháp trình tải Webpack trong câu lệnh nhập mô-đun. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Không bao gồm phần mở rộng tên tệp JavaScript eslint.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Trình vòng lặp và Trình tạo

Không sử dụng vòng lặp. Thích các hàm bậc cao hơn của JavaScript thay vì các vòng lặp như

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

68 hoặc

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

69. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

Sử dụng

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

72 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

73 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

74 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

75 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

76 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

77 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

78 /. để lặp lại các mảng và

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

79 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

80 /

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

81 để tạo các mảng để bạn có thể lặp lại các đối tượng

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Hiện tại không sử dụng máy phát điện
Tại sao?

Nếu bạn phải sử dụng trình tạo hoặc nếu bạn bỏ qua , hãy đảm bảo chữ ký chức năng của chúng được đặt đúng khoảng cách. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Của cải

Sử dụng ký hiệu dấu chấm khi truy cập thuộc tính. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Sử dụng ký hiệu ngoặc _______16_______90 khi truy cập các thuộc tính có biến

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Sử dụng toán tử lũy thừa

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

91 khi tính toán lũy thừa. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};

Biến

Luôn sử dụng

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

59 hoặc

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63 để khai báo biến. Không làm như vậy sẽ dẫn đến các biến toàn cầu. Chúng tôi muốn tránh làm ô nhiễm không gian tên toàn cầu. Captain Planet đã cảnh báo chúng tôi về điều đó. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Sử dụng một khai báo

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

59 hoặc

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63 cho mỗi biến hoặc phép gán. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Nhóm tất cả các

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

59 của bạn và sau đó nhóm tất cả các

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63 của bạn

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Gán các biến ở nơi bạn cần, nhưng đặt chúng ở nơi hợp lý

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Không gán chuỗi biến. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Tránh sử dụng số tăng và giảm đơn vị (

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

07,

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

08). eslint

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Tránh ngắt dòng trước hoặc sau

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

13 trong bài tập. Nếu bài tập của bạn vi phạm

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

14, hãy bao quanh giá trị trong dấu ngoặc. eslint

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Không cho phép các biến không sử dụng. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

cẩu

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

60 khai báo được nâng lên đầu phạm vi chức năng kèm theo gần nhất của chúng, nhiệm vụ của chúng không. Các khai báo của

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

59 và

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63 được ban phước với một khái niệm mới gọi là. Điều quan trọng là phải biết tại sao typeof không còn an toàn

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Các biểu thức hàm ẩn danh nâng tên biến của chúng, nhưng không gán chức năng

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

Các biểu thức hàm được đặt tên kéo theo tên biến, không phải tên hàm hoặc thân hàm

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Khai báo hàm nâng tên của chúng và thân hàm

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Để biết thêm thông tin, hãy tham khảo JavaScript Scoping & Hoisting của Ben Cherry

Toán tử so sánh & Bình đẳng

Sử dụng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

21 và

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

22 thay vì

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

23 và

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

24. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Các câu điều kiện chẳng hạn như câu lệnh
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
09 đánh giá biểu thức của chúng bằng cách ép buộc với phương pháp trừu tượng
```
// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}
```
27 và luôn tuân theo các quy tắc đơn giản này
- Các đối tượng đánh giá là đúng
- Không xác định đánh giá sai
- Null đánh giá là sai
- Booleans đánh giá giá trị của boolean
- Các số đánh giá là sai nếu +0, -0 hoặc NaN, nếu không thì đúng
- Các chuỗi đánh giá là sai nếu một chuỗi rỗng
```
// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;
```
  00, nếu không thì đúng
```
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};
```
2

Sử dụng phím tắt cho booleans, nhưng so sánh rõ ràng cho chuỗi và số

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Để biết thêm thông tin, xem bởi Angus Croll

Sử dụng dấu ngoặc nhọn để tạo các khối trong mệnh đề

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

29 và

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

30 có chứa khai báo từ vựng (e. g.

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

63,

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

59,

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

58 và

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

45). dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Các bộ ba không được lồng vào nhau và thường là các biểu thức một dòng. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Tránh báo cáo ternary không cần thiết. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Khi trộn các toán tử, hãy đặt chúng trong ngoặc đơn. Ngoại lệ duy nhất là các toán tử số học tiêu chuẩn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

41,

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

42 và

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

91 vì quyền ưu tiên của chúng được hiểu rộng rãi. Chúng tôi khuyên bạn nên đặt

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

44 và

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

84 trong ngoặc đơn vì thứ tự ưu tiên của chúng có thể không rõ ràng khi chúng được trộn lẫn. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

khối

Sử dụng dấu ngoặc nhọn với tất cả các khối nhiều dòng. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Nếu bạn đang sử dụng các khối nhiều dòng với

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

09 và

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

49, hãy đặt ____22_______49 trên cùng một dòng với dấu ngoặc nhọn đóng của khối

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

09 của bạn. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  lukeSkywalker: lukeSkywalker,
};

// good
const obj = {
  lukeSkywalker,
};

Nếu một khối

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

09 luôn thực thi câu lệnh

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

36, thì khối

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

49 tiếp theo là không cần thiết. Một

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

36 trong một khối

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

57 theo sau một khối

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

09 chứa một

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

36 có thể được tách thành nhiều khối

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

09. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Tuyên bố kiểm soát

Trong trường hợp câu lệnh kiểm soát của bạn (

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

09,

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

10, v.v. ) quá dài hoặc vượt quá độ dài dòng tối đa, mỗi điều kiện (được nhóm) có thể được đưa vào một dòng mới. Toán tử logic nên bắt đầu dòng

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Không sử dụng toán tử lựa chọn thay cho câu lệnh điều khiển

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Bình luận

Sử dụng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

64 cho nhận xét nhiều dòng

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Sử dụng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

65 cho nhận xét một dòng. Đặt nhận xét một dòng trên một dòng mới phía trên chủ đề của nhận xét. Đặt một dòng trống trước nhận xét trừ khi nó nằm trên dòng đầu tiên của khối

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Bắt đầu tất cả các bình luận với một khoảng trắng để dễ đọc hơn. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Tiền tố nhận xét của bạn bằng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

67 hoặc

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

68 giúp các nhà phát triển khác nhanh chóng hiểu được liệu bạn đang chỉ ra một vấn đề cần được xem xét lại hay nếu bạn đang đề xuất một giải pháp cho vấn đề cần được triển khai. Những nhận xét này khác với các nhận xét thông thường vì chúng có thể thực hiện được. Các hành động là

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

69 hoặc

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Sử dụng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

71 để chú thích các vấn đề

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Sử dụng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

72 để chú thích các giải pháp cho vấn đề

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Khoảng trắng

Sử dụng các tab mềm (ký tự khoảng trắng) được đặt thành 2 dấu cách. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Đặt 1 dấu cách trước dấu ngoặc nhọn. dây dẫn.

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

const anakinSkywalker = 'Anakin Skywalker';
const lukeSkywalker = 'Luke Skywalker';

// bad
const obj = {
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  lukeSkywalker,
  episodeThree: 3,
  mayTheFourth: 4,
  anakinSkywalker,
};

// good
const obj = {
  lukeSkywalker,
  anakinSkywalker,
  episodeOne: 1,
  twoJediWalkIntoACantina: 2,
  episodeThree: 3,
  mayTheFourth: 4,
};

Đặt 1 dấu cách trước dấu ngoặc đơn mở trong câu lệnh điều khiển (

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

09,

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

10, v.v. ). Không đặt khoảng trắng giữa danh sách đối số và tên hàm trong lời gọi hàm và khai báo. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Tắt các toán tử có dấu cách. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Kết thúc tệp bằng một ký tự dòng mới. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng thụt đầu dòng khi tạo chuỗi phương thức dài (hơn 2 chuỗi phương thức). Sử dụng dấu chấm ở đầu, nhấn mạnh rằng dòng này là lời gọi phương thức, không phải câu lệnh mới. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Để lại một dòng trống sau các khối và trước câu lệnh tiếp theo

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Không đệm các khối của bạn bằng các dòng trống. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Không sử dụng nhiều dòng trống để đệm mã của bạn. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Không thêm khoảng trắng bên trong dấu ngoặc đơn. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Không thêm dấu cách vào trong ngoặc. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Thêm khoảng trắng bên trong dấu ngoặc nhọn. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Tránh các dòng mã dài hơn 100 ký tự (bao gồm cả khoảng trắng). Ghi chú. per , các chuỗi dài được miễn quy tắc này và không được chia nhỏ. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Yêu cầu khoảng cách nhất quán bên trong mã thông báo khối mở và mã thông báo tiếp theo trên cùng một dòng. Quy tắc này cũng thực thi khoảng cách nhất quán bên trong mã thông báo khối gần và mã thông báo trước đó trên cùng một dòng. dây dẫn.
```
// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}
```
88
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
13

Tránh khoảng trắng trước dấu phẩy và yêu cầu khoảng trắng sau dấu phẩy. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Thực thi giãn cách bên trong dấu ngoặc thuộc tính được tính. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Tránh khoảng cách giữa các chức năng và lời gọi của chúng. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Thực thi khoảng cách giữa các khóa và giá trị trong các thuộc tính bằng chữ của đối tượng. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Tránh dấu cách ở cuối dòng. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

Tránh nhiều dòng trống, chỉ cho phép một dòng mới ở cuối tệp và tránh một dòng mới ở đầu tệp. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

dấu phẩy

dấu phẩy hàng đầu. Không. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Thêm dấu phẩy sau. Chuẩn rồi. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

dấu chấm phẩy

Chuẩn rồi. dây dẫn.
```
// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}
```
97
Tại sao? . Tuy nhiên, ASI chứa một vài hành vi lập dị và mã của bạn sẽ bị hỏng nếu JavaScript hiểu sai ngắt dòng của bạn. Các quy tắc này sẽ trở nên phức tạp hơn khi các tính năng mới trở thành một phần của JavaScript. Việc chấm dứt rõ ràng các câu lệnh của bạn và định cấu hình trình nói dối của bạn để bắt các dấu chấm phẩy bị thiếu sẽ giúp bạn không gặp phải sự cố
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
22
.

Loại đúc và ép buộc

Thực hiện ép kiểu ở đầu câu lệnh

Dây. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Số. Sử dụng

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

99 để truyền kiểu và

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

00 luôn có cơ số để phân tích chuỗi. dây dẫn.

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Nếu vì bất kỳ lý do gì mà bạn đang làm điều gì đó hoang dã và

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

00 là nút cổ chai của bạn và cần sử dụng Bitshift vì lý do hiệu suất, hãy để lại nhận xét giải thích lý do và việc bạn đang làm

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Ghi chú. Hãy cẩn thận khi sử dụng các hoạt động bitshift. Các số được biểu diễn dưới dạng , nhưng các thao tác chuyển đổi bit luôn trả về một số nguyên 32 bit (). Bitshift có thể dẫn đến hành vi không mong muốn đối với các giá trị số nguyên lớn hơn 32 bit. Thảo luận. Int 32 bit có chữ ký lớn nhất là 2.147.483.647
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
26

Booleans. dây dẫn.

// bad
var count = 1;
if (true) {
  count += 1;
}

// good, use the let.
let count = 1;
if (true) {
  count += 1;
}

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

quy ước đặt tên

Tránh những tên có một chữ cái. Hãy mô tả với tên của bạn. dây dẫn.

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng camelCase khi đặt tên đối tượng, chức năng và phiên bản. dây dẫn.

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Chỉ sử dụng PascalCase khi đặt tên cho hàm tạo hoặc lớp. dây dẫn.

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Không sử dụng dấu gạch dưới hoặc dấu gạch dưới ở đầu. dây dẫn.
```
// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1
```
14
Tại sao? . Mặc dù dấu gạch dưới ở đầu là một quy ước phổ biến có nghĩa là “riêng tư”, trên thực tế, các thuộc tính này hoàn toàn công khai và do đó, là một phần trong hợp đồng API công khai của bạn. Quy ước này có thể khiến các nhà phát triển nghĩ sai rằng một thay đổi sẽ không được tính là vi phạm hoặc không cần kiểm tra. tl;dr. nếu bạn muốn một cái gì đó là "riêng tư", nó không được hiện diện rõ ràng
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
31

Không lưu tham chiếu đến

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

35. Sử dụng các chức năng mũi tên hoặc Hàm # liên kết

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Tên tệp cơ sở phải khớp chính xác với tên xuất mặc định của nó

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sử dụng camelCase khi bạn xuất hàm mặc định. Tên tệp của bạn phải giống với tên hàm của bạn
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
34

Sử dụng PascalCase khi bạn xuất hàm tạo/lớp/thư viện hàm đơn/hàm/đối tượng trần
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
35

Các từ viết tắt và viết tắt phải luôn luôn là chữ hoa hoặc tất cả chữ thường
Tại sao?
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
36

Bạn có thể tùy ý viết hoa một hằng số chỉ khi nó (1) được xuất, (2) là
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
59 (không thể gán lại nó) và (3) lập trình viên có thể tin tưởng nó (và các thuộc tính lồng nhau của nó) sẽ không bao giờ thay đổi
Tại sao? . UPPERCASE_VARIABLES đang cho lập trình viên biết rằng họ có thể tin tưởng biến (và các thuộc tính của nó) sẽ không thay đổi
- Thế còn tất cả các biến
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
  59 thì sao? . Tuy nhiên, nó nên được sử dụng cho các hằng số đã xuất
- Đối với các đối tượng đã xuất thì sao? . g.
```
// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1
```
  18) và duy trì rằng tất cả các thuộc tính lồng nhau không thay đổi
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
37

phụ kiện

Hàm truy cập cho các thuộc tính không bắt buộc

Không sử dụng JavaScript getters/setters vì chúng gây ra tác dụng phụ không mong muốn và khó kiểm tra, bảo trì và lý do hơn. Thay vào đó, nếu bạn tạo các hàm truy cập, hãy sử dụng

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

19 và

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Nếu thuộc tính/phương pháp là một

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

51, hãy sử dụng

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

22 hoặc

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Bạn có thể tạo các hàm

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

24 và

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

25, nhưng phải nhất quán

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Sự kiện

Khi đính kèm tải trọng dữ liệu vào sự kiện (dù là sự kiện DOM hay thứ gì đó độc quyền hơn như sự kiện Xương sống), hãy chuyển một đối tượng theo nghĩa đen (còn được gọi là "hàm băm") thay vì giá trị thô. Điều này cho phép người đóng góp tiếp theo thêm nhiều dữ liệu hơn vào tải trọng sự kiện mà không cần tìm và cập nhật mọi trình xử lý cho sự kiện. For example, instead of
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
41
prefer
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```
42

jQuery

Prefix jQuery object variables with a

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Cache jQuery lookups

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

For DOM queries use Cascading

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

27 or parent > child

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

28. jsPerf

Use

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

29 with scoped jQuery object queries

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

ECMAScript 5 Compatibility

Refer to Kangax’s ES5 compatibility table

ECMAScript 6+ (ES 2015+) Styles

This is a collection of links to the various ES6+ features

Do not use TC39 proposals that have not reached stage 3
Why? They are not finalized, and they are subject to change or to be withdrawn entirely. We want to use JavaScript, and proposals are not JavaScript yet

Standard Library

The Standard Library contains utilities that are functionally broken but remain for legacy reasons

Use

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

30 instead of global

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

31. eslint.

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Use

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

34 instead of global

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

35. dây dẫn.

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

Testing

Yup

const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9

No, but seriously

Whichever testing framework you use, you should be writing tests
Strive to write many small pure functions, and minimize where mutations occur
Be cautious about stubs and mocks - they can make your tests more brittle

We primarily use

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

38 and

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

39 at Airbnb.

// const and let only exist in the blocks they are defined in.
{
  let a = 1;
  const b = 1;
  var c = 1;
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // Prints 1

40 is also used occasionally for small, separate modules

100% test coverage is a good goal to strive for, even if it’s not always practical to reach it
Whenever you fix a bug, write a regression test. A bug fixed without a regression test is almost certainly going to break again in the future

Performance

On Layout & Web Performance
String vs Array Concat
Try/Catch Cost In a Loop
Bang Function
jQuery Find vs Context, Selector
innerHTML vs textContent for script text
Long String Concatenation

Are JavaScript functions like

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

72,

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

77, and

// bad
var a = 1;
var b = 2;

// good
const a = 1;
const b = 2;

74 optimized for traversing arrays?

Resources

Learning ES6+

Latest ECMA spec
ExploringJS
ES6 Compatibility Table
Comprehensive Overview of ES6 Features

Read This

Standard ECMA-262

Tools

Code Style Linters
- ESlint - Airbnb Style . eslintrc
- JSHint - Airbnb Style . jshintrc
Neutrino Preset - @neutrinojs/airbnb

Other Style Guides

Google JavaScript Style Guide
Google JavaScript Style Guide (Old)
jQuery Core Style Guidelines
Principles of Writing Consistent, Idiomatic JavaScript
StandardJS

Other Styles

Naming this in nested functions - Christian Johansen
Conditional Callbacks - Ross Allen
- JeongHoon Byun
Multiple var statements in JavaScript, not superfluous - Ben Alman

In the Wild

This is a list of organizations that are using this style guide. Send us a pull request and we'll add you to the list

123erfasst. 123erfasst/javascript
4bộ xúc tác. 4Catalyzer/javascript
Aan Zee. AanZee/javascript
Airbnb. airbnb/javascript
AloPeyk. AloPeyk
AltSchool. AltSchool/javascript
Apartmint. apartmint/javascript
Ascribe. gán/javascript
tiên phong. tín dụng tiên phong/javascript
Axept. axept/javascript
Billabong. billabong/javascript
Bisk. bisk
Bonhomme. bonhommeparis/javascript
Brainshark. brainshark/javascript
CaseNine. CaseNine/javascript
Cerner. Cerner
Chartboost. ChartBoost/javascript-style-guide
Coeur d'Alene Tribe. www. cdatribe-nsn. gov
ComparaOnline. comparaonline/javascript
Compass Learning. compasslearning/javascript-style-guide
DailyMotion. dailymotion/javascript
DoSomething. DoSomething/eslint-config
Digitpaint Digitpaint/javascript
Drupal. www. drupal. org
Ecosia. ecosia/javascript
Evernote. evernote/javascript-style-guide
Evolution Gaming. evolution-gaming/javascript
EvozonJs. evozonjs/javascript
ExactTarget. ExactTarget/javascript
Flexberry. Flexberry/javascript-style-guide
Gawker Media. gawkermedia
General Electric. GeneralElectric/javascript
Generation Tux. GenerationTux/javascript
GoodData. gooddata/gdc-js-style
GreenChef. greenchef/javascript
Grooveshark. grooveshark/javascript
Grupo-Abraxas. Grupo-Abraxas/javascript
Happeo. happeo/javascript
Honey. honeyscience/javascript
How About We. howaboutwe/javascript
HubSpot. HubSpot/javascript
Hyper. hyperoslo/javascript-playbook
InterCity Group. intercitygroup/javascript-style-guide
Jam3. Jam3/Javascript-Code-Conventions
JSSolutions. JSSolutions/javascript
Kaplan Komputing. kaplankomputing/javascript
KickorStick. kickorstick
Kinetica Solutions. kinetica/javascript
LEINWAND. LEINWAND/javascript
Lonely Planet. lonelyplanet/javascript
M2GEN. M2GEN/javascript
Mighty Spring. mightyspring/javascript
MinnPost. MinnPost/javascript
MitocGroup. MitocGroup/javascript
Muber. muber
National Geographic Society. natgeosociety
NullDev. NullDevCo/JavaScript-Styleguide
Nulogy. nulogy/javascript
Orange Hill Development. orangehill/javascript
Orion Health. orionhealth/javascript
Peerby. Peerby/javascript
Pier 1. Pier1/javascript
Qotto. Qotto/javascript-style-guide
React.
REI. reidev/js-style-guide
Ripple. ripple/javascript-style-guide
Sainsbury’s Supermarkets. jsainsburyplc
Shutterfly. shutterfly/javascript
Sourcetoad. sourcetoad/javascript
Springload. springload
StratoDem Analytics. stratodem/javascript
SteelKiwi Development. steelkiwi/javascript
StudentSphere. studentsphere/javascript
SwoopApp. swoopapp/javascript
SysGarage. sysgarage/javascript-style-guide
Syzygy Warsaw. syzygypl/javascript
Target. target/javascript
Terra. terra
TheLadders. TheLadders/javascript
Mọt sách. thenerdery/javascript-tiêu chuẩn
Tomify. tomprats
Traitify. traitify/eslint-config-traitify
T4R Technology. T4R-Technology/javascript
UrbanSim. urbansim
VoxFeed. VoxFeed/javascript-style-guide
WeBox Studio. weboxstudio/javascript
Weggo. Weggo/javascript
Zillow. zillow/javascript
ZocDoc. ZocDoc/javascript

Translation

This style guide is also available in other languages

Brazilian Portuguese. armoucar/javascript-style-guide
Bulgarian. borislavvv/javascript
Catalan. fpmweb/javascript-style-guide
Chinese (Simplified). lin-123/javascript
Chinese (Traditional). jigsawye/javascript
French. nmussy/javascript-style-guide
German. timofurrer/javascript-style-guide
Italian. sinkswim/javascript-style-guide
Japanese. mitsuruog/javascript-style-guide
Korean. ParkSB/javascript-style-guide
Russian. leonidlebedev/javascript-airbnb
Spanish. paolocarrasco/javascript-style-guide
Thai. lvarayut/javascript-style-guide
Turkish. eraycetinay/javascript
Ukrainian. ivanzusko/javascript
Vietnam. dangkyokhoang/javascript-style-guide

The JavaScript Style Guide Guide

Reference

Chat With Us About JavaScript

Find us on gitter

Contributors

View Contributors

License

(The MIT License)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions

Thông báo bản quyền ở trên và thông báo cấp phép này sẽ được bao gồm trong tất cả các bản sao hoặc phần quan trọng của Phần mềm

THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. TRONG BẤT KỲ TRƯỜNG HỢP NÀO TÁC GIẢ HOẶC NGƯỜI GIỮ BẢN QUYỀN SẼ KHÔNG CHỊU TRÁCH NHIỆM PHÁP LÝ VỀ BẤT KỲ KHIẾU NẠI, THIỆT HẠI HOẶC TRÁCH NHIỆM PHÁP LÝ KHÁC NÀO, DÙ TRONG MỘT HÀNH ĐỘNG HỢP ĐỒNG, NGOẠI TỆ HOẶC CÁCH NÀO KHÁC, PHÁT SINH TỪ, NGOÀI HOẶC LIÊN QUAN ĐẾN PHẦN MỀM HOẶC VIỆC SỬ DỤNG HOẶC CÁC GIAO DỊCH KHÁC TRONG

Amendments

Chúng tôi khuyến khích bạn rẽ nhánh hướng dẫn này và thay đổi các quy tắc để phù hợp với hướng dẫn phong cách của nhóm bạn. Dưới đây, bạn có thể liệt kê một số sửa đổi đối với hướng dẫn phong cách. Điều này cho phép bạn cập nhật định kỳ hướng dẫn phong cách của mình mà không phải xử lý xung đột hợp nhất

programming javascript

Lồng nhau nếu javascript

1. Ra lệnh nếu trong javascript

2. Ra lệnh if other trong javascript

3. Kết hợp nhiều lệnh if other trong javascript

4. Lệnh if other lồng nhau trong javascript

5. Hàm if in HTML has not?

Objects

Mảng

hủy diệt

Dây

Chức năng

Hàm mũi tên

Lớp & Constructor

mô-đun

Trình vòng lặp và Trình tạo

Của cải

Biến

cẩu

Toán tử so sánh & Bình đẳng

khối

Tuyên bố kiểm soát

Bình luận

Khoảng trắng

dấu phẩy

dấu chấm phẩy

Loại đúc và ép buộc

quy ước đặt tên

phụ kiện

Sự kiện

jQuery

ECMAScript 5 Compatibility

ECMAScript 6+ (ES 2015+) Styles

Standard Library

Testing

Performance

Resources

In the Wild

Translation

The JavaScript Style Guide Guide

Chat With Us About JavaScript

Contributors

License

Amendments

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội