CodeGym /Các khóa học /Frontend SELF VI /Các Constructor và phương thức

Các Constructor và phương thức

Frontend SELF VI
Mức độ , Bài học
Có sẵn

6.1 Constructor của lớp

Constructor và phương thức của lớp là những thành phần chính của lập trình hướng đối tượng trong JavaScript. Chúng cho phép tạo và khởi tạo các đối tượng, cũng như xác định hành vi của chúng. Dưới đây, tụi mình sẽ cùng tìm hiểu, cách mà constructor và phương thức của lớp hoạt động, và cách sử dụng chúng.

Constructor là gì?

Constructor là một phương thức đặc biệt của lớp, được gọi khi tạo một instance mới của lớp. Nó được sử dụng để khởi tạo đối tượng, thiết lập các giá trị cho thuộc tính của nó và thực hiện các tác vụ ban đầu khác.

Xác định constructor

Constructor được xác định bằng cách sử dụng từ khóa constructor. Bên trong constructor, bạn có thể sử dụng từ khóa this để tham chiếu đến các thuộc tính và phương thức của đối tượng.

Cú pháp:

    
      class ClassName {
        constructor(tham số) {
          // Khởi tạo đối tượng
        }
      }
    
  

Ví dụ:

Trong lớp Person phương thức constructor nhận hai tham số: nameage.

Các tham số này được sử dụng để khởi tạo những thuộc tính nameage của đối tượng được tạo ra.

JavaScript
    
      class Person {
        constructor(name, age) {
          this.name = name;
          this.age = age;
        }
      }

      const person1 = new Person('Alice', 30);
      const person2 = new Person('Bob', 25);

      console.log(person1.name); // In ra: Alice
      console.log(person2.age);  // In ra: 25
    
  

Constructor mặc định

Nếu constructor không được định nghĩa rõ ràng, JavaScript tự động tạo ra một constructor trống mặc định.

Ví dụ:

JavaScript
    
      class Animal {}

      const animal = new Animal();
      console.log(animal); // In ra nội dung của lớp Animal {}
    
  

4.2 Phương thức của lớp

Phương thức của lớp được xác định bên trong thân của lớp và cung cấp chức năng cho các đối tượng được tạo ra từ lớp đó. Phương thức tự động được thêm vào prototype của lớp, cho phép mọi instance của lớp thừa hưởng và sử dụng chúng.

Cú pháp:

    
      class ClassName {
        constructor(tham số) { // Khởi tạo đối tượng } 
        phươngThức1() { // Thân phương thức } 
        phươngThức2() { // Thân phương thức }
      }
    
  

Ví dụ:

JavaScript
    
      class Car {
        constructor(brand, model) {
          this.brand = brand;
          this.model = model;
          this.mileage = 0;
        }

        drive(distance) {
          this.mileage += distance;
          console.log(`${this.brand} ${this.model} drove ${distance} miles. Total mileage: ${this.mileage}`);
        }

        getDetails() {
          return `${this.brand} ${this.model}, Mileage: ${this.mileage}`;
        }
      }

      const myCar = new Car('Toyota', 'Camry');
      myCar.drive(50); // "Toyota Camry drove 50 miles. Total mileage: 50"

      console.log(myCar.getDetails()); // "Toyota Camry, Mileage: 50"
    
  

Giải thích:

  • Trong lớp Car có hai phương thức được định nghĩa: drive()getDetails()
  • Phương thức drive() tăng số km của xe và in ra thông tin về khoảng cách đã đi
  • Phương thức getDetails() trả về một chuỗi thông tin về xe

6.3 Phương thức riêng tư

Với sự xuất hiện của các đặc tả ECMAScript mới, khả năng tạo phương thức và thuộc tính riêng tư, không thể truy cập từ bên ngoài lớp đã được bổ sung. Để làm điều này, sử dụng ký hiệu # như một phần của tên.

Ví dụ về phương thức và thuộc tính riêng tư:

JavaScript
    
      class BankAccount {
        #balance = 0;

        constructor(initialBalance) {
          this.#balance = initialBalance;
        }

        #validateAmount(amount) {
          if (amount <= 0) {
            throw new Error('Amount must be positive.');
          }
        }

        deposit(amount) {
          this.#validateAmount(amount);
          this.#balance += amount;
          console.log(`Deposited ${amount}. New balance: ${this.#balance}`);
        }

        withdraw(amount) {
          this.#validateAmount(amount);
          if (amount > this.#balance) {
            throw new Error('Insufficient funds.');
          }
          this.#balance -= amount;
          console.log(`Withdrew ${amount}. New balance: ${this.#balance}`);
        }

        getBalance() {
          return this.#balance;
        }
      }

      const account = new BankAccount(100);
      account.deposit(50); // In ra: Deposited 50. New balance: 150
      account.withdraw(30); // In ra: Withdrew 30. New balance: 120
      console.log(account.getBalance()); // In ra: 120

      // Thử truy cập vào phương thức hoặc thuộc tính riêng tư sẽ gây lỗi
      account.#balance; // SyntaxError
      account.#validateAmount(50); // SyntaxError
    
  
1
Khảo sát/đố vui
, cấp độ , bài học
Không có sẵn
Làm quen với các class
Làm quen với các class
Bình luận
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION