THÔNG DỤNG
OOP
ES6
ES(X)
CÁC CHỦ ĐỀ
BÀI MỚI NHẤT
Dự án mới của mình là gamehow.net, mời anh em ghé thăm và góp ý ạ.

Cấp độ private / protected của class trong Javascript

Trong bài này chúng ta sẽ tìm hiểu ba cấp độ truy cập đến thuộc tính và phương thức của class trong javascript, đó là cấp độ private / protected / public.

Qua bài này bạn sẽ hiểu và biết khi nào thì nên sử dụng private, khi nao thì sử dụng protected và khi nào thì sử dụng public. Đây là kiến thức quan trọng trong lập trình hướng đối tượng, vì nó giúp đảm bảo dữ liệu trong các đối tượng được an toàn.

banquyen png
Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

1. Private / protected và public trong javascript là gì?

Private / protected và public là ba mức độ truy cập đến các thuộc tính và phương thức trong class. Nó giúp ta bảo vệ được dữ liệu bên trong các class, chỉ chia sẻ những dữ liệu cần thiết, hoặc cho phép chia sẻ đến các lớp con kế thừa từ nó.

Private là cấp độ bảo mật nhất, nó chỉ cho phép sử dụng bên trong class, còn bên ngoài không truy cập được.

Protected là cấp độ bảo mật thứ hai, nó chỉ cho phép sử dụng bên trong class và cả class kế thừa. Bên ngoài không truy cập được.

Mưc này thì rất khó cài đặt, bởi bản thân Javascript không hỗ trợ. Vì vậy, ta sẽ sử dụng getter và setter để tạo ra một thuộc tính protected.

Public thì khác, bạn có thể truy cập ở bất kì đâu. Đây là mức dễ dàng nhất.

Bây giờ chúng ta sẽ tìm hiểu từng loại một cách cụ thể hơn nhé.

2. Cấp độ public trong Javascript

Public là cấp độ lỏng lẻo nhất. Các thuộc tính và phương thức đều có thể truy cập được dù ở bên trong lớp hay bên ngoài lớp.

class Human{
    name = ""
    sayHi(){
        // this.name là truy cập trong lớp
        console.log(`Xin chào, tôi là ${this.name}`);
    }
}

let cuong = new Human();

// Truy cập ngoài lớp
cuong.name = "Cường";
cuong.sayHi();

Những ví dụ mà từ trước đến giờ các bạn đã học đều thuộc dạng public.

3. Cấp độ protected trong Javascript

Cấp độ protected thì khác, bạn chỉ được phép truy cập ở bên trong lớp đó và cả bên trong lớp kế thừa.

Vì javascript không hỗ tợ cấp độ này, vì vậy ta phải kết hợp một mẹo khá đơn giản.

  • Đặt quy ước cho protected là thuộc tính sẽ bắt đầu bằng dấu gạch dưới _. Theo quy ước thì khi sử dụng thuộc tính thì bạn phải bỏ đi dấu gạch dưới.
  • Ta sẽ tạo một getter, nhưng không tạo setter, để ở bên ngoài class có sử dụng setter thì sẽ không có tác dụng.

Quy ước: Để khai báo protected thì ta đặt dấu gạch dưới đằng trước thuộc tính và phương thức.

class className{
    
    // _name là protected
    _name = "Cường"
    
    // sayHi là protected
    _sayHi(){
        // code
    }
}       

Ví dụ: Tạo hai class Human và Student để demo cho protected.

class Human {
    _name;

    constructor(name) {
        this._name = name;
    }

    get name() {
        return this._name;
    }
    
    sayHi(){
        console.log(`Xin chào, tôi là ${this._name}`);
    }
}

let h = new Human("Cường");
h.sayHi(); // Tôi là Cường
h.name = "Nguyễn";
h.sayHi(); // Tôi là Cường

Như bạn thấy, mặc dù mình đã thiết lập giá trị mới cho h.name nhưng vẫn không có tác dụng.

Nhưng nếu bạn cố tình thiết lập như thế này h._name = "Nguyễn"; thì sẽ có tác dụng đấy nhé. Vì vậy, đây chỉ là một quy ước chung mà thôi.

4. Cập độ private trong Javascript

Private là cấp độ bảo mật cao nhất, nó chỉ cho phép sử dụng bên trong lớp mà thôi. Ngay cả lớp kế thừa cũng không đươc phép sử dụng.

Để khai báo một thuộc tính là private thì ta thêm dấu thăng đằng trước.

class className{
    #protected_property = ""
    
    #protected_method(){
        
    }
}   

Cấp độ này chỉ xuất hiện từ ES9.

Ví dụ: thuộc tính #name là private nên không được phép sử dụng ở bên ngoài, ngay cả lớp kế thừa Student cũng không được phép.

class Human{
    // Protected
    #name = ""
    
    constructor(name){
        // Lệnh này đúng, vì nó là lớp con 
        // nên được phép truy cập đến thuộc tính private
        this.#name = name;
    }
    
    // Public
    sayHi(){
        // Lệnh này đúng, vì đang truy cập trong lớp
        console.log(`Xin chào, tôi là ${this.#name}`);
    }
}

class Student extends Human{
    sayGoodbye(){
        // Lệnh này sai, vì #name là private
        console.log(`${this.#name} tạm biệt mọi người nhé`);
    }
}

let cuong = new Student("Cường");


cuong.sayHi();  // Lệnh này đúng
cuong.#name;    // Lệnh này sai

Lời kết: Như vậy là chúng ta đã tìm hiểu xong 3 cấp độ truy cập trong javascript, đó là protected / private và public. Qua bài này thì ta thấy javascipt đang dần hoàn thiện theo thời gian để trở thành ngôn ngữ lập trình cấp cao.

Cùng chuyên mục:

Cách gộp hai object javascript lại với nhau

Cách gộp hai object javascript lại với nhau

Cách lấy chiều dài của object trong Javascript

Cách lấy chiều dài của object trong Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Cách dùng nextSibling trong javascript

Cách dùng nextSibling trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng innerHTML trong Javascript

Cách dùng innerHTML trong Javascript

Cách dùng insertBefore trong javascript

Cách dùng insertBefore trong javascript

Cách dùng insertAfter trong Javascript

Cách dùng insertAfter trong Javascript

Cách dùng parentNode trong Javascript

Cách dùng parentNode trong Javascript

Cách dùng parentElement trong Javascript

Cách dùng parentElement trong Javascript

Tính tổng các phần tử trong mảng javascript

Tính tổng các phần tử trong mảng javascript

Tính tổng hai số bằng Javascript (cộng hai số)

Tính tổng hai số bằng Javascript (cộng hai số)

Cách gán giá trị cho thẻ input trong javascript

Cách gán giá trị cho thẻ input trong javascript

Để gán giá trị cho thẻ input thì ta có hai cách, thứ nhất là…

Cách kiểm tra số nguyên âm trong javascript

Cách kiểm tra số nguyên âm trong javascript

Cách kiểm tra số nguyên dương trong javascript

Cách kiểm tra số nguyên dương trong javascript

Hàm closure trong javascript

Hàm closure trong javascript

Closure là một khái niệm không phải ai cũng ..

Biểu thức chính quy RegEx trong Javascript

Biểu thức chính quy RegEx trong Javascript

Bài này chúng ta sẽ tìm hiểu đến chuỗi và cách sử dụng biểu thức…

Cách dùng Import / Export Module trong javascript

Cách dùng Import / Export Module trong javascript

Khi bạn xây dựng một ứng dụng nhỏ thì việc đặt

Cơ chế hoạt động của hoisting trong Javascript

Cơ chế hoạt động của hoisting trong Javascript

Hoisting là vấn đề liên quan đến cách khai báo biến trong Javascript. Nó liên…

Cách dùng static trong Javascript (thuộc tính và phương thức tĩnh)

Cách dùng static trong Javascript (thuộc tính và phương thức tĩnh)

Trong bài này chúng ta sẽ tìm hiểu cách sử dụng từ ..

Top