1. Static trong JavaScript là gì?

Static là từ khóa giúp ta khai báo những phương thức tĩnh hoặc thuộc tính tĩnh trong các class của Js. Khi được khai báo static thì phương thức và thuộc tính đó có thể được gọi đến mà không cần phải sử dụng từ khóa new để khởi tạo đối tượng. Các phương thức và thuộc tính của lớp tĩnh được định nghĩa trên chính lớp đó. Ta không thể gọi một phương thức static trên một đối tượng. Ta chỉ gọi được trên một lớp đối tượng.

Cú pháp: ta chỉ cần đặt từ khóa static lên trước thuộc tính hoặc phương thức là được

class className {    
    // thuộc tính tĩnh
    static name = "";
     
    //phương thức tĩnh
    static functionName(){
         
    }
}

Ví dụ:

<script>
class Car {
  constructor(name) {
    this.name = name;
  }
  static hello() {
    return "Hello!!";
  }
}

let myCar = new Car("Ford");

document.write(Car.hello());
// document.write(myCar.hello());
</script>

2. Phương thức tĩnh trong JavaScipt

Phương thức tĩnh – Static Method là những phương thức có từ khóa static phía trước. Các phương thức như vậy được gọi là Static Method . Chúng ta có thể gọi hoặc gán một phương thức từ chính class mà không cần phải tạo đối tượng của class đó, không phải cho nguyên mẫu của nó.

Ví dụ:

class User {
  static staticMethod() {
    alert(this === User);
  }
}
// Không cần phải khởi tạo
User.staticMethod(); // true

Nó cũng giống như việc mà ta sẽ gán nó trực tiếp như một thuộc tính:

class User { }

User.staticMethod = function() {
  alert(this === User);
};

User.staticMethod(); // true

This trong lệnh gọi User.staticMethod() là contructor riêng của lớp User (quy tắc “đối tượng trước khi chấm” ). Thông thường, các phương thức tĩnh được sử dụng để thực hiện các hàm thuộc về lớp, nhưng không thuộc về bất kỳ đối tượng cụ thể nào của nó.

Tuy nhiên, ta không thể sử dụng từ khóa this để gọi đến một phương thức không phải là static .

class User {
    sayHi() {
        console.log("Xin chào");
    }
    static staticMethod() {
        // Sai, vì sayHi không phải là static
        this.sayHi();
    }
}
// Không cần phải khởi tạo
User.staticMethod(); // true

3. Thuộc tính tĩnh trong JavaScript

Các thuộc tính tĩnh cũng có thể giống như phương thức tĩnh ở trên, chúng trông giống như các thuộc tính của lớp thông thường, nhưng được có thêm static . Những thuộc tính như vậy ta có thể truy cập đến mà không cần phải khởi tạo đối tượng.

class Article {
  static publisher = "Thành Nguyễn";
}
 
alert( Article.publisher ); // Thành Nguyễn

4. Sử dụng this để truy cập thuộc tính static

Nếu ta sử dụng this để truy cập đến một thuộc tính static thì nó sẽ trả về undefined . Bởi vì một thuộc tính static sẽ không nằm trong danh sách thuộc tính của class , mà nó được lưu trữ trong constructor của class .

class Article {
    static publisher = "Thành Nguyễn"
    show() {
        // Xuất ra undefined
        alert(this.publisher);
    }
}
 
let a = new Article();
a.show(); // kết quả là undefined

Lúc này thuộc tính static publisher đã được lưu trữ trong constructor . Vì vậy, nếu muốn sử dụng this để truy cập đến nó thì phải sử dụng cú pháp this.constructor.publisher

class Article {
    static publisher = "Thành Nguyễn"
    show() {
        alert(this.constructor.publisher);
    }
}
 
let a = new Article();
a.show(); // Thành Nguyễn

5. Thuộc tính static có giá trị duy nhất

Thuộc tính và phương thức static trong Js là duy nhất. Vì nó được lưu trữ trong constructor của class , mà dữ liệu trong constructor là duy nhất, nghĩa là những thay đổi bên trong constructor là ảnh hưởng đến đối tượng chứ không phải instance .