Sự Khác Biệt Giữa Arrow Function và Function Thông Thường trong JavaScript

1. Cú pháp:

• Arrow Function:

  javascript
  Copy
  const add = (a, b) => a + b;

  Ngắn gọn, không cần function hoặc return (nếu là biểu thức 1 dòng).

• Function Thông Thường:

  javascript
  Copy
  function add(a, b) {
    return a + b;
  }
  // Hoặc function expression:
  const add = function(a, b) { return a + b; };

2. Giá trị this:

• Arrow Function:
  Không có this riêng. this được kế thừa từ phạm vi cha (lexical scope).
  Ví dụ:

  javascript
  Copy
  const obj = {
    name: "Alice",
    greet: () => console.log(this.name) // `this` trỏ đến window/global, không phải obj
  };

• Function Thông Thường:
  Có this riêng, phụ thuộc vào ngữ cảnh gọi.
  Ví dụ:

  javascript
  Copy
  const obj = {
    name: "Alice",
    greet: function() { console.log(this.name) } // `this` trỏ đến obj
  };

3. Đối tượng arguments:

• Arrow Function:
  Không có arguments riêng. Muốn truy cập, dùng rest parameters:

  javascript
  Copy
  const showArgs = (...args) => console.log(args);

• Function Thông Thường:
  Có đối tượng arguments chứa tất cả tham số:

  javascript
  Copy
  function showArgs() { console.log(arguments); }

4. Sử dụng new:

• Arrow Function:
  Không thể dùng làm constructor (gây lỗi nếu dùng new):

  javascript
  Copy
  const Person = () => {};
  const p = new Person(); // TypeError: Person is not a constructor

• Function Thông Thường:
  Có thể dùng làm constructor:

  javascript
  Copy
  function Person(name) { this.name = name; }
  const p = new Person("Bob");

5. Phương thức prototype:

• Arrow Function:
  Không có prototype (vì không dùng làm constructor được).

• Function Thông Thường:
  Có thuộc tính prototype để kế thừa.

6. Binding với super và bind/call/apply:

• Arrow Function:
  Không thể dùng super, và không thể rebind this qua bind/call/apply.

• Function Thông Thường:
  Có thể dùng super (trong class) và rebind this.

Tóm Tắt: