Các lớp JavaScript

Trong hướng dẫn này, bạn sẽ tìm hiểu về các lớp JavaScript với sự trợ giúp của các ví dụ.

Các lớp là một trong những tính năng được giới thiệu trong phiên bản JavaScript ES6 .

Một lớp là một bản thiết kế cho đối tượng. Bạn có thể tạo một đối tượng từ lớp.

Bạn có thể coi lớp học như một bản phác thảo (nguyên mẫu) của một ngôi nhà. Nó chứa tất cả các chi tiết về sàn nhà, cửa ra vào, cửa sổ, v.v. Dựa trên những mô tả này, bạn xây dựng ngôi nhà. Ngôi nhà là đối tượng.

Vì nhiều ngôi nhà có thể được tạo ra từ cùng một mẫu mã, chúng ta có thể tạo nhiều đối tượng từ một lớp.

Tạo lớp JavaScript

Lớp JavaScript tương tự như hàm khởi tạo Javacfscript và nó chỉ đơn thuần là một đường cú pháp.

Hàm khởi tạo được định nghĩa là:

// constructor function
function Person () {
    this.name = 'John',
    this.age = 23
}

// create an object
const person1 = new Person();

Thay vì sử dụng functiontừ khóa, bạn sử dụng classtừ khóa để tạo các lớp JS. Ví dụ,

// creating a class
class Person {
  constructor(name) {
    this.name = name;
  }
}

Các classtừ khóa được sử dụng để tạo ra một lớp. Các thuộc tính được gán trong một hàm khởi tạo.

Bây giờ bạn có thể tạo một đối tượng. Ví dụ,

// creating a class
class Person {
  constructor(name) {
    this.name = name;
  }
}

// creating an object
const person1 = new Person('John');
const person2 = new Person('Jack');

console.log(person1.name); // John
console.log(person2.name); // Jack

Ở đây, person1và person2 là các đối tượng của Personlớp.

Lưu ý : constructor()Phương thức bên trong một lớp được gọi tự động mỗi khi một đối tượng được tạo.

Phương thức lớp Javacfscript

Trong khi sử dụng hàm khởi tạo, bạn xác định các phương thức là:

// constructor function
function Person (name) {

   // assigning  parameter values to the calling object
    this.name = name;

    // defining method
    this.greet = function () {
        return ('Hello'' + ' ' + this.name);
    }
}

Rất dễ dàng để xác định các phương thức trong lớp JavaScript. Bạn chỉ cần cung cấp tên của phương thức theo sau là (). Ví dụ,

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

    // defining method
    greet() {
        console.log(`Hello ${this.name}`);
    }
}

let person1 = new Person('John');

// accessing property
console.log(person1.name); // John

// accessing method
person1.greet(); // Hello John

Lưu ý : Để truy cập phương thức của một đối tượng, bạn cần gọi phương thức bằng cách sử dụng tên của nó theo sau ().

Người nhận và Người định cư

Trong JavaScript, các phương thức getter nhận giá trị của một đối tượng và các phương thức setter đặt giá trị của một đối tượng.

Các lớp JavaScript có thể bao gồm getters và setters . Bạn sử dụng gettừ khóa cho phương thức getter và setphương thức setter. Ví dụ,

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

    // getter
    get personName() {
        return this.name;
    }

    // setter
    set personName(x) {
        this.name = x;
    }
}

let person1 = new Person('Jack');
console.log(person1.name); // Jack

// changing the value of name property
person1.personName = 'Sarah';
console.log(person1.name); // Sarah

Cẩu hàng

Một lớp nên được định nghĩa trước khi sử dụng nó. Không giống như các hàm và các khai báo JavaScript khác, lớp không được đưa vào. Ví dụ,

// accessing class
const p = new Person(); // ReferenceError

// defining class
class Person {
  constructor(name) {
    this.name = name;
  }
}

Như bạn có thể thấy, việc truy cập một lớp trước khi xác định nó sẽ gây ra lỗi.

‘Sử dụng nghiêm ngặt’

Các lớp học luôn tuân theo ‘sử dụng nghiêm ngặt’ . Tất cả mã bên trong lớp được tự động ở chế độ nghiêm ngặt. Ví dụ,

class Person {
  constructor() {
    a = 0;
    this.name = a;
  }
}

let p = new Person(); // ReferenceError: Can't find variable: a

Lưu ý : Lớp JavaScript là một loại hàm đặc biệt. Và typeoftoán tử trả về functioncho một lớp.

Ví dụ,

class Person {}
console.log(typeof Person); // function