ES6 - classes cấu trúc và cách sử dụng

3rd Nov 2022
ES6 - classes cấu trúc và cách sử dụng
Table of contents

ES6 Classes

  • Classes là một dạng function đặc biệt, thay vì sử dụng từ function thì chúng ta sử dụng class và thuộc tính được gán bên trong phương thức constructor().
  • Classes có tính kế thừa (inheritance), dễ dàng kế thừa tất cả phương thức từ Classes đã có trước đó.
  • Cấu trúc cơ bản của một Classes như sau:
class Member {
  constructor() {
    this.name = "Dương Minh Trí";
  }
}
var x = new Member();
console.log(x.name); /* ouput: "Dương Minh Trí" */
  • Member Tên Classes.
  • constructor() hàm khởi tạo đối tượng cho một class, mỗi class chỉ chứa một hàm khởi tạo duy nhất.
  • this.name với name là tham số đặt bất kỳ.
  • var x = new Member() cần khai báo Classes trước khi dùng.

Classes - sử dụng với method

class Member {
  constructor() {
    this.name = "Dương Minh Trí";
  }

  memberName() {
    return this.name;
  }
}
var x = new Member();
console.log(x.memberName()); /* ouput: "Dương Minh Trí" */

Classes - tính kế thừa (inheritance)

Classes sử dụng từ khóa extends để kế thừa các Classes đã có.

class Member {
  constructor() {
    this.name = "Dương Minh Trí";
  }

  memberName() {
    return this.name;
  }
}

class User extends Member {
  constructor(name, age) {
    super(name);
    this.age = 4;
  }

  memberInfo() {
    return this.memberName() + 'Tuổi:' + this.age;
  }
}
var x = new User();
console.log(x.memberInfo()); /* ouput: "Dương Minh Trí" Tuổi:4 */
  • User extends Member Classes User kế thừa phương thức của Member.
  • name đây là tham số được sử dụng trong Member.
  • super(name); khai báo này cần thiết để gọi các tham số đã có trong Member.
  • this.memberName() sử dụng lại phương thức của Member.
  • var x = new User() cần khai báo Classes User trước khi dùng.

Theo https://hocwebchuan.com

Theo Học Web chuẩn.

Bạn thấy bài viết này như thế nào?
2 reactions

Add new comment

Image CAPTCHA
Enter the characters shown in the image.

Related Articles

Props là các biến, data được truyền từ component cha và có thể truy cập được ở cả các component con.

Để dễ làm việc, quản lý các chức năng file javascript, chúng ta thường tách các phần riêng biệt ra riêng từng file khác

Destructuring (phá vỡ cấu trúc) cho phép chúng ta dễ dàng sử dụng các giá trị phần tử của Array hoặc Object.

Đại diện này được ký hiệu bằng khai báo ...name (cẩn thận coi chừng nhầm lẫn với spread syntax).