Không hiểu javascript

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
62

Tại sao?

// 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. dây dẫn.
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    65

    Tại sao?

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

  • Lưu ý rằng cả

    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    63 và
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    59 đều ở phạm vi khối, trong khi
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    60 là phạm vi chức nă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

    Trong đoạn mã trên, bạn có thể thấy rằng tham chiếu

    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    71 và
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    72 sẽ tạo ra ReferenceError, trong khi
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    73 chứa số. Điều này là do
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    71 và
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    72 nằm trong phạm vi khối, trong khi
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    73 nằm trong phạm vi hàm chứa

Các đối tượng

  • Sử dụng cú pháp theo nghĩa đen để tạo đố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
    77

    // bad
    const item = new Object();
    
    // good
    const item = {};

  • Sử dụng tên thuộc tính được tính toán khi tạo đối tượng có tên thuộc tính động

    Tại sao?

    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 tốc ký phương thức đố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
    78

    // 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 tốc ký giá trị thuộc tính. dây dẫn.

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

    Tại sao?

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };

  • Nhóm các thuộc tính tốc ký của bạn khi bắt đầu khai báo đối tượng của bạn

    Tại sao?

    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
    85

    Tại sao?

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

  • Ư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 để lấy 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
    89

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

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
    90

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

  • 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
    4

  • 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
    5

  • Để 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
    93

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

  • 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
    7

  • 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
    8

  • 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
    98

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    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 nháy đơ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;
    01

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    4

  • 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;
    02
    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    03

    Tại sao?

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    6

  • 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;
    05

  • 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;
    06

    Tại sao?

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    7

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 quá 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 chính 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 (_______4_______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;
    }
    0

  • 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;
    }
    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;
    17

    Tại sao? . Ngoài ra, các đối số còn lại là một Mảng thực sự chứ không chỉ giống Mảng như

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    13

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

  • 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;
    }
    3

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

    Tại sao?

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

  • 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;
    20

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

  • 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;
    21

    Tại sao?

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

  • 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;
    23
    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    24

    Tại sao?

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

  • 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;
    25

    Tại sao?

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

  • 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;
    25

    Tại sao? . Nó cũng có thể gây ra các vấn đề tối ưu hóa, đặc biệt là trong V8

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

  • Ư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;
    29

    Tại sao?

    // 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
    0

  • 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;
    32

    // 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
    1

Hàm mũi tên

  • Khi bạn phải sử dụng một hàm ẩn danh (như khi chuyển một hàm gọi lại nội tuyến), hãy sử dụng ký hiệu hàm 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;
    34

    Tại sao?

    Tại sao khô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
    2

  • 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;
    38

    Tại sao? . Nó đọc tốt khi nhiều chức năng được xâu chuỗi lại với nhau

    // 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
    3

  • 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

    Tại sao?

    // 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
    4

  • 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;
    37

    Tại sao?

    // 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
    5

  • Tránh nhầm lẫn 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;
    43

    // 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
    6

  • 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. eslint.

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    44

    // 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
    7

Classes & Constructors

  • Always use

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    45. Avoid manipulating
    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    46 directly

    Why?

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    45 syntax is more concise and easier to reason about

    // 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
    8

  • Use

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    48 for inheritance

    Why? It is a built-in way to inherit prototype functionality without breaking

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    49

    // 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
    9

  • Methods can return

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    35 to help with method chaining

    // bad
    const item = new Object();
    
    // good
    const item = {};
    0

  • It’s okay to write a custom

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    51 method, just make sure it works successfully and causes no side effects

    // bad
    const item = new Object();
    
    // good
    const item = {};
    1

  • Classes have a default constructor if one is not specified. An empty constructor function or one that just delegates to a parent class is unnecessary. eslint.

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    52

    // bad
    const item = new Object();
    
    // good
    const item = {};
    2

  • Avoid duplicate class members. eslint.

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    53

    Why? Duplicate class member declarations will silently prefer the last one - having duplicates is almost certainly a bug

    // bad
    const item = new Object();
    
    // good
    const item = {};
    3

  • Class methods should use

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    35 or be made into a static method unless an external library or framework requires using specific non-static methods. Being an instance method should indicate that it behaves differently based on properties of the receiver. 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

Modules

  • Always use modules (

    // 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) over a non-standard module system. You can always transpile to your preferred module system

    Why? Modules are the future, let’s start using the future now

    // bad
    const item = new Object();
    
    // good
    const item = {};
    5

  • Do not use wildcard imports

    Why? This makes sure you have a single default export

    // bad
    const item = new Object();
    
    // good
    const item = {};
    6

  • And do not export directly from an import

    Why? Although the one-liner is concise, having one clear way to import and one clear way to export makes things consistent

    // bad
    const item = new Object();
    
    // good
    const item = {};
    7

  • Only import from a path in one place. eslint.

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    58

    Why? Having multiple lines that import from the same path can make code harder to maintain

    // bad
    const item = new Object();
    
    // good
    const item = {};
    8

  • Do not export mutable bindings. eslint.

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    59

    Why? Mutation should be avoided in general, but in particular when exporting mutable bindings. While this technique may be needed for some special cases, in general, only constant references should be exported

    // bad
    const item = new Object();
    
    // good
    const item = {};
    9

  • In modules with a single export, prefer default export over named export. eslint.

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    60

    Why? To encourage more files that only ever export one thing, which is better for readability and maintainability

    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,
    };
    0

  • Đặ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;
    62

    Tại sao?

    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,
    };
    1

  • 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;
    64

    Tại sao?

    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,
    };
    2

  • 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;
    65

    Tại sao? . Thích sử dụng cú pháp trình tải trong

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    66

    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,
    };
    3

  • 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;
    67

    Tại sao?

    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,
    };
    4

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;
    70
    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    71

    Tại sao? . Xử lý các hàm thuần túy trả về giá trị dễ lý luận hơn các tác dụng phụ

    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,
    };
    5

  • 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;
    82

    Tại sao?

    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,
    };
    6

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;
    89

    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,
    };
    7

  • Sử dụng ký hiệu ngoặc

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    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,
    };
    8

  • 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;
    92

    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,
    };
    9

Variables

  • 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;
    95
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    61

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    0

  • 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;
    99

    Tại sao? . You can also step through each declaration with the debugger, instead of jumping through all of them at once

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    1

  • Group all your

    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    59s and then group all your
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    63s

    Why? This is helpful when later on you might need to assign a variable depending on one of the previously assigned variables

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    2

  • Assign variables where you need them, but place them in a reasonable place

    Why?

    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 and not function scoped

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    3

  • Don’t chain variable assignments. eslint.

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

    Why? Chaining variable assignments creates implicit global variables

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    4

  • Avoid using unary increments and decrements (

    // 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;
    }
    09

    Why? Per the eslint documentation, unary increment and decrement statements are subject to automatic semicolon insertion and can cause silent errors with incrementing or decrementing values within an application. It is also more expressive to mutate your values with statements like

    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    10 instead of
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    11 or
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    12. Disallowing unary increment and decrement statements also prevents you from pre-incrementing/pre-decrementing values unintentionally which can also cause unexpected behavior in your programs

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    5

  • Avoid linebreaks before or after

    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    13 in an assignment. If your assignment violates
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    14, surround the value in parens. eslint
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    15

    Why? Linebreaks surrounding

    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    13 can obfuscate the value of an assignment

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    6

  • Disallow unused variables. eslint.

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

    Why? Variables that are declared and not used anywhere in the code are most likely an error due to incomplete refactoring. Such variables take up space in the code and can lead to confusion by readers

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    7

Hoisting

  • const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    60 declarations get hoisted to the top of their closest enclosing function scope, their assignment does not.
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    59 and
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    63 declarations are blessed with a new concept called . It’s important to know why typeof is no longer safe

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    8

  • Anonymous function expressions hoist their variable name, but not the function assignment

    // bad
    const atom = {
      value: 1,
    
      addValue: function (value) {
        return atom.value + value;
      },
    };
    
    // good
    const atom = {
      value: 1,
    
      addValue(value) {
        return atom.value + value;
      },
    };
    9

  • Named function expressions hoist the variable name, not the function name or the function body

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    0

  • Function declarations hoist their name and the function body

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    1

  • For more information refer to JavaScript Scoping & Hoisting by Ben Cherry

Comparison Operators & Equality

  • Use
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    21 and
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    22 over
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    23 and
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    24. eslint.
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    25

  • Conditional statements such as the

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    09 statement evaluate their expression using coercion with the
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    27 abstract method and always follow these simple rules

    • Objects evaluate to true
    • Undefined evaluates to false
    • Null evaluates to false
    • Booleans evaluate to the value of the boolean
    • Numbers evaluate to false if +0, -0, or NaN, otherwise true
    • Strings evaluate to false if an empty string
      // bad
      var a = 1;
      var b = 2;
      
      // good
      const a = 1;
      const b = 2;
      00, otherwise true

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    2

  • Use shortcuts for booleans, but explicit comparisons for strings and numbers

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    3

  • For more information see by Angus Croll

  • Use braces to create blocks in

    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    29 and
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    30 clauses that contain lexical declarations (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, and
    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    45). eslint.
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    35

    Why? Lexical declarations are visible in the entire

    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    36 block but only get initialized when assigned, which only happens when its
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    29 is reached. This causes problems when multiple
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    29 clauses attempt to define the same thing

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    4

  • Ternaries should not be nested and generally be single line expressions. eslint.

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

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    5

  • Avoid unneeded ternary statements. eslint.

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

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    6

  • When mixing operators, enclose them in parentheses. The only exception is the standard arithmetic operators.

    // 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, and
    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    91 since their precedence is broadly understood. We recommend enclosing
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    44 and
    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    84 in parentheses because their precedence can be ambiguous when they are mixed. dây dẫn.
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    46

    Tại sao?

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    7

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;
    }
    47

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    8

  • 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
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    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;
    }
    52

    const lukeSkywalker = 'Luke Skywalker';
    
    // bad
    const obj = {
      lukeSkywalker: lukeSkywalker,
    };
    
    // good
    const obj = {
      lukeSkywalker,
    };
    9

  • Nếu 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 có 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;
    }
    61

    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,
    };
    0

Tuyên bố kiểm soát

  • Trong trường hợp tuyên bố 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

    Tại sao? . Điều này cũng cải thiện khả năng đọc bằng cách giúp dễ dàng theo dõi logic phức tạp một cách trực quan.

    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,
    };
    1

  • 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,
    };
    2

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,
    };
    3

  • 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 một 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,
    };
    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;
    }
    66

    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,
    };
    5

  • 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 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;
    }
    70

  • 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 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,
    };
    6

  • 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,
    };
    7

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;
    }
    73

    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,
    };
    8

  • Đặ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;
    24

    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,
    };
    9

  • Đặ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 cách 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;
    }
    77

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

  • 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;
    }
    78

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

  • 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;
    }
    79

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

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

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

  • 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;
    }
    80
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    81

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

  • Để 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
    06

  • 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;
    }
    82

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

  • 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;
    }
    83

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

  • 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;
    }
    84

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

  • 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;
    }
    85

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

  • 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;
    }
    86

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

  • 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;
    }
    14

    Tại sao?

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

  • 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;
    }
    89

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

  • Thực thi khoảng 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;
    }
    90

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

  • 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;
    }
    91

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

  • 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;
    }
    92

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

  • 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;
    }
    93

  • 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;
    }
    83

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

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;
    }
    95

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

  • 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;
    }
    96

    Tại sao? . Ngoài ra, các trình chuyển mã như Babel sẽ xóa dấu phẩy ở cuối bổ sung trong mã được chuyển mã, điều đó có nghĩa là bạn không phải lo lắng về dấu phẩy trong các trình duyệt cũ

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

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

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;
    }
    98

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

  • 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
    01
    // bad
    var count = 1;
    if (true) {
      count += 1;
    }
    
    // good, use the let.
    let count = 1;
    if (true) {
      count += 1;
    }
    98

    Why? The

    // 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 function produces an integer value dictated by interpretation of the contents of the string argument according to the specified radix. Leading whitespace in string is ignored. If radix is
    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    53 or
    // 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
    05, it is assumed to be
    // 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
    06 except when the number begins with the character pairs
    // 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
    07 or
    // 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
    08, in which case a radix of 16 is assumed. This differs from ECMAScript 3, which merely discouraged (but allowed) octal interpretation. Many implementations have not adopted this behavior as of 2013. And, because older browsers must be supported, always specify a radix

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

  • If for whatever reason you are doing something wild 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
    00 is your bottleneck and need to use Bitshift for performance reasons, leave a comment explaining why and what you’re doing

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

  • Note. Be careful when using bitshift operations. Numbers are represented as , but bitshift operations always return a 32-bit integer (). Bitshift can lead to unexpected behavior for integer values larger than 32 bits. Discussion. Largest signed 32-bit Int is 2,147,483,647

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

  • Booleans. eslint.

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

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

Naming Conventions

  • Avoid single letter names. Be descriptive with your naming. 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
    11

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

  • Use camelCase when naming objects, functions, and instances. 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
    12

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

  • Use PascalCase only when naming constructors or classes. 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
    13

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

  • Do not use trailing or leading underscores. 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
    14

    Why? JavaScript does not have the concept of privacy in terms of properties or methods. Although a leading underscore is a common convention to mean “private”, in fact, these properties are fully public, and as such, are part of your public API contract. This convention might lead developers to wrongly think that a change won’t count as breaking, or that tests aren’t needed. tl;dr. if you want something to be “private”, it must not be observably present

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

  • Don’t save references to

    // bad
    var a = 1;
    var b = 2;
    
    // good
    const a = 1;
    const b = 2;
    35. Use arrow functions or Function#bind

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

  • A base filename should exactly match the name of its default export

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

  • Use camelCase when you export-default a function. Your filename should be identical to your function’s name

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

  • Use PascalCase when you export a constructor / class / singleton / function library / bare object

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

  • Acronyms and initialisms should always be all uppercased, or all lowercased

    Why? Names are for readability, not to appease a computer algorithm

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

  • You may optionally uppercase a constant only if it (1) is exported, (2) is a

    const foo = [1, 2];
    const bar = foo;
    
    bar[0] = 9;
    
    console.log(foo[0], bar[0]); // => 9, 9
    59 (it can not be reassigned), and (3) the programmer can trust it (and its nested properties) to never change

    Why? This is an additional tool to assist in situations where the programmer would be unsure if a variable might ever change. UPPERCASE_VARIABLES are letting the programmer know that they can trust the variable (and its properties) not to change

    • 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
    20

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

  • 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
    23

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

  • 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
    40

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. Ví dụ, thay vì

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

    thích hơn

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

jQuery

  • Biến đối tượng jQuery có tiền tố với một

    // 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
    26

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

  • Tra cứu bộ nhớ cache jQuery

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

  • Đối với các truy vấn DOM, hãy sử dụng 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 hoặc 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

  • 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
    29 với các truy vấn đối tượng jQuery có phạm vi

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

Khả năng tương thích ECMAScript 5

  • Tham khảo bảng tương thích ES5 của Kangax

Kiểu ECMAScript 6+ (ES 2015+)

  • Đây là tập hợp các liên kết đến các tính năng khác nhau của ES6+

  • Không sử dụng các đề xuất TC39 chưa đạt đến giai đoạn 3

    Tại sao? . Chúng tôi muốn sử dụng JavaScript và các đề xuất chưa phải là JavaScript

Thư viện tiêu chuẩn

Thư viện tiêu chuẩn chứa các tiện ích bị hỏng chức năng nhưng vẫn tồn tại vì lý do cũ

  • 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
    30 thay vì toàn cầu
    // 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. 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
    32

    Tại sao? . Nếu hành vi này là mong muốn, làm cho nó rõ ràng

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

  • 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
    34 thay vì toàn cầu
    // 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
    32

    Tại sao? . Nếu hành vi này là mong muốn, làm cho nó rõ ràng

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

thử nghiệm

  • Chuẩn rồi

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

  • Không, nhưng nghiêm túc
    • Cho dù bạn sử dụng khung kiểm tra nào, bạn nên viết bài kiểm tra
    • Cố gắng viết nhiều hàm thuần túy nhỏ và giảm thiểu nơi xảy ra đột biến
    • Hãy thận trọng với sơ khai và giả - chúng có thể làm cho bài kiểm tra của bạn trở nên dễ vỡ hơn
    • 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?
  • Loading

Resources

Learning ES6+

  • Latest ECMA spec
  • ExploringJS
  • ES6 Compatibility Table
  • Comprehensive Overview of ES6 Features

Read This

  • Standard ECMA-262

Công cụ

  • 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

Further Reading

  • Understanding JavaScript Closures - Angus Croll
  • Basic JavaScript for the impatient programmer - Dr. Axel Rauschmayer
  • You Might Not Need jQuery - Zack Bloom & Adam Schwartz
  • ES6 Features - Luke Hoban
  • Nguyên tắc giao diện người dùng - Benjamin De Cock

Sách

  • JavaScript. Những Phần Tốt - Douglas Crockford
  • Mẫu JavaScript - Stoyan Stefanov
  • Các mẫu thiết kế JavaScript chuyên nghiệp - Ross Harmes và Dustin Diaz
  • Trang web hiệu suất cao. Kiến Thức Cần Thiết Cho Kỹ Sư Front-End - Steve Souders
  • JavaScript có thể duy trì - Nicholas C. Zakas
  • Ứng dụng web JavaScript - Alex MacCaw
  • Kỹ thuật JavaScript chuyên nghiệp - John Resig
  • đập vỡ nút. js. JavaScript ở mọi nơi - Guillermo Rauch
  • Bí mật của Ninja JavaScript - John Resig và Bear Bibeault
  • JavaScript của con người - Henrik Joreteg
  • Siêu anh hùng. js - Kim Joar Bekkelund, Mads Mobæk, & Olav Bjorkoy
  • JSBooks - Julien Bouquillon
  • JavaScript của bên thứ ba - Ben Vinegar và Anton Kovalyov
  • JavaScript hiệu quả. 68 cách cụ thể để khai thác sức mạnh của JavaScript - David Herman
  • JavaScript hùng hồn - Marijn Haverbeke
  • Bạn không biết JS. ES6 & Hơn thế nữa - Kyle Simpson

Blog

  • JavaScript hàng tuần
  • JavaScript, JavaScript
  • Blog Bocoup
  • Đủ Tốt
  • NCZTrực tuyến
  • Sự hoàn hảo giết chết
  • Ben Alman
  • Dmitry Baranovsky
  • quả óc chó

Podcast

  • Không khí JavaScript
  • Jabber JavaScript

Trong thế giới hoang dã

Đây là danh sách các tổ chức đang sử dụng hướng dẫn phong cách này. Gửi cho chúng tôi yêu cầu kéo và chúng tôi sẽ thêm bạn vào danh sách

  • 123erfast. 123erfasst/javascript
  • 4bộ xúc tác. 4Catalyzer/javascript
  • Aan Zee. AanZee/javascript
  • Airbnb. airbnb/javascript
  • AloPeyk. AloPeyk
  • trường thay thế. AltSchool/javascript
  • Căn hộ. căn hộ/javascript
  • Thường gán. gán/javascript
  • Avant. avantcredit/javascript
  • Axept. axept/javascript
  • Billabong. billabong/javascript
  • Bisk. bisk
  • Bonhomme. bonhommeparis/javascript
  • Brainshark. brainshark/javascript
  • CaseNine. CaseNine/javascript
  • Cerner. Cerner
  • tăng biểu đồ. ChartBoost/javascript-style-guide
  • Bộ tộc Coeur d'Alene. www. cdatribe-nsn. chính phủ
  • So sánh trực tuyến. so sánh trực tuyến/javascript
  • học la bàn. hướng dẫn sử dụng la bàn/javascript-style-guide
  • chuyển động hàng ngày. dailymotion/javascript
  • Làm việc gì đó. DoS Something/eslint-config
  • Digitpaint Digitpaint/javascript
  • drupal. www. drupal. tổ chức
  • hệ sinh thái. sinh thái/javascript
  • Evernote. evernote/javascript-style-guide
  • Trò chơi tiến hóa. tiến hóa-chơi game/javascript
  • EvozonJs. evozonjs/javascript
  • Mục tiêu chính xác. Mục tiêu chính xác/javascript
  • dâu dẻo. Flexberry/javascript-style-guide
  • truyền thông gawker. gawkermedia
  • điện tổng hợp. Điện tổng hợp/javascript
  • Tux thế hệ. Thế hệTux/javascript
  • dữ liệu tốt. gooddata/gdc-js-style
  • đầu bếp xanh. đầu bếp xanh/javascript
  • cá mập rãnh. rãnh/javascript
  • Grupo-Abraxas. Grupo-Abraxas/javascript
  • Happeo. happeo/javascript
  • Mật ong. khoa học mật ong/javascript
  • Chúng tôi thì sao. howaboutwe/javascript
  • HubSpot. HubSpot/javascript
  • siêu. hyperoslo/javascript-playbook
  • Nhóm liên thành phố. intercitygroup/javascript-style-guide
  • mứt3. Jam3/Javascript-Code-Conventions
  • JSSolutions. JSSolutions/javascript
  • Máy tính Kaplan. kaplankomputing/javascript
  • KickorStick. gậy đánh bóng
  • giải pháp động học. động học/javascript
  • LEINWAND. LEINWAND/javascript
  • Hành tinh cô đơn. hành tinh cô đơn/javascript
  • M2GEN. M2GEN/javascript
  • Mùa xuân hùng vĩ. hùng mạnh/javascript
  • TrinPost. TrinPost/javascript
  • MitocNhóm. Nhóm Mitoc/javascript
  • Muber. người chăn bò
  • Hội Địa lý Quốc gia. xã hội tự nhiên
  • NullDev. NullDevCo/JavaScript-Styleguide
  • Nuology. nulogy/javascript
  • Phát triển Đồi Cam. màu cam/javascript
  • Sức khỏe Orion. orionhealth/javascript
  • ngang hàng. Ngang hàng/javascript
  • Cầu tàu 1. Cầu tàu1/javascript
  • Qotto. Qotto/javascript-style-guide
  • Phản ứng.
  • REI. reidev/js-style-hướng dẫn
  • Gợn sóng. ripple/javascript-style-guide
  • Sainsbury’s Supermarkets. jsainsburyplc
  • Shutterfly. shutterfly/javascript
  • Sourcetoad. sourcetoad/javascript
  • Springload. springload
  • StratoDem Analytics. stratodem/javascript
  • ThépPhát triểnKiwi. thépkiwi/javascript
  • Sinh viênSphere. sinh viên/javascript
  • SwoopApp. swoopapp/javascript
  • SysGarage. sysgarage/javascript-style-guide
  • Syzygy Warszawa. syzygypl/javascript
  • Mục tiêu. mục tiêu/javascript
  • thổ địa. địa ngục
  • TheLadders. TheLadder/javascript
  • Mọt sách. thenerdery/javascript-tiêu chuẩn
  • Tomify. tomprats
  • traiti. traitify/eslint-config-traitify
  • Công nghệ T4R. Công nghệ T4R/javascript
  • đô thịSim. thành thị
  • VoxFeed. VoxFeed/javascript-style-guide
  • Phòng thu WeBox. weboxstudio/javascript
  • Weggo. Weggo/javascript
  • zillow. zillow/javascript
  • ZocDoc. ZocDoc/javascript

Dịch

Hướng dẫn phong cách này cũng có sẵn bằng các ngôn ngữ khác

  • Không hiểu javascript
    tiếng Bồ Đào Nha của người brazi. armoucar/javascript-style-guide
  • Không hiểu javascript
    tiếng Bungari. borislavvv/javascript
  • Không hiểu javascript
    tiếng Catalunya. fpmweb/javascript-style-guide
  • Không hiểu javascript
    Tiếng Trung (Giản thể). lin-123/javascript
  • Không hiểu javascript
    Truyền thống Trung Hoa). ghép hình/javascript
  • Không hiểu javascript
    người Pháp. nmussy/javascript-style-guide
  • Không hiểu javascript
    tiếng Đức. timofurrer/javascript-style-guide
  • Không hiểu javascript
    người Ý. sinkswim/javascript-style-guide
  • Không hiểu javascript
    tiếng Nhật. mitsuruog/javascript-style-guide
  • Không hiểu javascript
    Hàn Quốc. ParkSB/javascript-style-guide
  • Không hiểu javascript
    tiếng Nga. leonid lebedev/javascript-airbnb
  • Không hiểu javascript
    người Tây Ban Nha. paolocarrasco/javascript-style-guide
  • Không hiểu javascript
    tiếng Thái. lvarayut/javascript-style-guide
  • Không hiểu javascript
    Thổ Nhĩ Kỳ. eraycetinay/javascript
  • Không hiểu javascript
    tiếng Ukraina. Ivanzusko/javascript
  • Không hiểu javascript
    Việt Nam. dangkyokhoang/javascript-style-guide

Hướng dẫn Hướng dẫn Phong cách JavaScript

  • Thẩm quyền giải quyết

Trò chuyện với chúng tôi về JavaScript

  • Tìm chúng tôi trên gitter

người đóng góp

  • Xem cộng tác viên

Giấy phép

(Giấy phép MIT)

Bản quyền (c) 2012 Airbnb

Theo đây, quyền được cấp miễn phí cho bất kỳ người nào có được bản sao của phần mềm này và các tệp tài liệu liên quan ('Phần mềm'), để xử lý Phần mềm mà không bị hạn chế, bao gồm nhưng không giới hạn các quyền sử dụng, sao chép, sửa đổi, hợp nhất

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

PHẦN MỀM ĐƯỢC CUNG CẤP 'NGUYÊN TRẠNG', KHÔNG CÓ BẢO ĐẢM DƯỚI BẤT KỲ HÌNH THỨC NÀO, RÕ RÀNG HAY NGỤ Ý, BAO GỒM NHƯNG KHÔNG GIỚI HẠN CÁC BẢO ĐẢM VỀ KHẢ NĂNG BÁN ĐƯỢC, TÍNH PHÙ HỢP CHO MỘT MỤC ĐÍCH CỤ THỂ VÀ KHÔNG VI PHẠM. 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

sửa đổi

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