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ụ.
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 từ cùng một mô tả, 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 Javascript 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 function
từ khóa, bạn sử dụng class
từ khóa để tạo các lớp JS. Ví dụ,
// creating a class class Person ( constructor(name) ( this.name = name; ) )
Các class
từ 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, person1
và person2 là các đối tượng của Person
lớ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 Javascript
Trong khi sử dụng hàm 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); ) )
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 ()
. 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 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 get
từ khóa cho phương thức getter và set
phươ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
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, 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à typeof
toán tử trả về function
cho một lớp.
Ví dụ,
class Person () console.log(typeof Person); // function