Style code trong Javascript, Nodejs Phần 3

Tiếp theo bài Style code trong Javascript, Nodejs mình tiếp tục phần 3 hướng dẫn các bạn các đối tượng khác trong javascript, Nodejs

Các bạn chưa theo dõi hãy xem lại để nắm bắt thêm những thông tin bổ ích

• Style code trong Javascript, Nodejs Phần 1
• Style code trong Javascript, Nodejs Phần 2

I. Functions

1. Sử dụng Function declarations thay vì Function expressions.

Function declarations được đặt tên rõ ràng, do đó có thể xác định nó ở call stacks. Luôn luôn dùng Arrow Functionsvới Function expressions.

```javascript
// không tốt
const foo = function () {
};

// Tốt
function foo() {
}
```

2. Function expressions

// immediately-invoked function expression (IIFE)
(() => {
  console.log('Welcome to the Internet. Please follow me.');
})();

3. Không được khai báo một hàm khi sử dụng các câu điều kiện (if, while, …). Thay vào đó lưu hàm vào một biến cụ thể.

4. Ghi chú: ECMA-262 định nghĩa block như là danh sách các câu lệnh. Read ECMA-262’s note on this issue.

// Không tốt
if (currentUser) {
  function test() {
    console.log('Nope.');
  }
}

// Tốt
let test;
if (currentUser) {
  test = () => {
    console.log('Yup.');
  };
}

5. Không được khai báo các tham số của hàm trùng với arguments

/ Không tốt
function nope(name, options, arguments) {
  // ...stuff...
}

// Tốt
function yup(name, options, args) {
  // ...stuff...
}

6. Không được dùng arguments, dùng ... (Spreads) thay thế.

// Không tốt
function concatenateAll() {
  const args = Array.prototype.slice.call(arguments);
  return args.join('');
}

// Tốt
function concatenateAll(...args) {
  return args.join('');
}

7. Sử dụng cách truyền tham số mặc định

// Không tốt, không bao giờ áp dụng kiểu này
function handleThings(opts) {
  opts = opts || {};
  // ...
}

// Không tốt
function handleThings(opts) {
  if (opts === void 0) {
    opts = {};
  }
  // ...
}

// Tốt
function handleThings(opts = {}) {
  // ...
}

8. Tránh đặt nó là các thông số mặc định.

var b = 1;
// Không tốt
function count(a = b++) {
  console.log(a);
}
count();  // 1
count();  // 2
count(3); // Nó được định nghĩa như là tham số thứ ba, mặc định sẽ không được thực thi (= b++ ไม่ถูกเรียก)
count();  // 3

9.  Luôn đặt tham số mặc định ở cuối

// Không tốt
function handleThings(opts = {}, name) {
  // ...
}

// Tốt
function handleThings(name, opts = {}) {
  // ...
}

10. Không bao giờ dùng cách khởi tạo một hàm bằng cách dùng new Function

Cách này đồng nghĩa với việc dùng eval().

// Không tốt
var add = new Function('a', 'b', 'return a + b');

// Không tốt
var subtract = Function('a', 'b', 'return a - b');

II. Arrow Functions

1. Một khi bạn sử dụng Function expressions (Anonymous function), thì nên dùng Arrow Functions hoặc =>.

// Không tốt
[1, 2, 3].map(function (x) {
  const y = x + 1;
  return x * y;
});

// Tốt
[1, 2, 3].map((x) => {
  const y = x + 1;
  return x * y;
});

2. Nếu chỉ một câu lệnh tính toán thì có thể không dùng {}, nhưng khi có nhiều câu lệnh thì nên dùng {} và dùng return để trả về kết quá cuối cùng.

// Tốt
[1, 2, 3].map(number => `A string containing the ${number}.`);

// Không tốt
[1, 2, 3].map(number => {
  const nextNumber = number + 1;
  `A string containing the ${nextNumber}.`;
});

// Tốt
[1, 2, 3].map(number => {
  const nextNumber = number + 1;
  return `A string containing the ${nextNumber}.`;
});

3.  Khi có nhiều chuỗi có nhiều dòng nên bao chuỗi đó trong dấu ().

// Không tốt
[1, 2, 3].map(number => 'As time went by, the string containing the ' +
  `${number} became much longer. So we needed to break it over multiple ` +
  'lines.'
);

// Tốt
[1, 2, 3].map(number => (
  `As time went by, the string containing the ${number} became much ` +
  'longer. So we needed to break it over multiple lines.'
));

4. Nếu trong hàm chỉ có một câu lệnh duy nhất có thể không cần dùng ()

// Tốt
[1, 2, 3].map(x => x * x);

// Tốt
[1, 2, 3].reduce((y, x) => x + y);

III. Constructors

1. Luôn luôn dùng class. Không nên dùng prototype

// Không tốt
function Queue(contents = []) {
  this._queue = [...contents];
}
Queue.prototype.pop = function() {
  const value = this._queue[0];
  this._queue.splice(0, 1);
  return value;
}


// Tốt
class Queue {
  constructor(contents = []) {
    this._queue = [...contents];
  }
  pop() {
    const value = this._queue[0];
    this._queue.splice(0, 1);
    return value;
  }
}

2. Sử dụng extends để tạo một lớp kế thừa.

// Không tốt
const inherits = require('inherits');
function PeekableQueue(contents) {
  Queue.apply(this, contents);
}
inherits(PeekableQueue, Queue);
PeekableQueue.prototype.peek = function() {
  return this._queue[0];
}

// Tốt
class PeekableQueue extends Queue {
  peek() {
    return this._queue[0];
  }
}

3. Phương thức có thể trả về this

// Không tốt
Jedi.prototype.jump = function() {
  this.jumping = true;
  return true;
};

Jedi.prototype.setHeight = function(height) {
  this.height = height;
};

const luke = new Jedi();
luke.jump(); // => true
luke.setHeight(20); // => undefined

// Tốt
class Jedi {
  jump() {
    this.jumping = true;
    return this;
  }

  setHeight(height) {
    this.height = height;
    return this;
  }
}

const luke = new Jedi();

luke.jump()
  .setHeight(20);

4. Có thể mở rộng phương thức toString()

class Jedi {
  constructor(options = {}) {
    this.name = options.name || 'no name';
  }

  getName() {
    return this.name;
  }

  toString() {
    return `Jedi - ${this.getName()}`;
  }
}