Sử dụng inheritance(kế thừa) trong Javascript

Bài viết này mình sẽ chia sẻ cách sử dụng inheritance trong ES6, trong ES6 nó sử dụng các từ khóa extends và super để biểu diễn sự kế thừa. Hãy xem ví dụ bên dưới: classAnimal{constructor(legs){this.legs = legs;}walk(){ console.log(`walking on ${this.legs} legs`);}}classBirdextendsAnimal{constructor(legs){super(legs);}fly(){ console.log('flying');}}let bird =newBird(2); bird.walk(); bird.fly(); Output: walking on 2 legs index.html:24 flying

Bài viết này mình sẽ chia sẻ cách sử dụng inheritance trong ES6, trong ES6 nó sử dụng các từ khóa extends và super để biểu diễn sự kế thừa.
Hãy xem ví dụ bên dưới:

classAnimal{constructor(legs){this.legs = legs;}walk(){
			console.log(`walking on ${this.legs} legs`);}}classBirdextendsAnimal{constructor(legs){super(legs);}fly(){
			console.log('flying');}}let bird =newBird(2);
	bird.walk();
	bird.fly();

Output:

walking on 2 legs
index.html:24 flying

Cách sử dụng:
Đầu tiên, mình tạo class Bird kế thừa class Animal bằng sử dụng từ khóa extends.

classBirdextendsAnimal{// ...}

Class Animal ở ví dụ trên được gọi là base class hoặc parent class, khi đó class Bird được hiểu là child class. Do đó
class Bird sẽ kế thừa tất cả các phương thức và thuộc tính của class Animal.
Tiếp theo, constructor trong Bird sẽ sử dụng hàm super() để gọi constructor trong Animal và truyền theo đối số là legs.
JavaScript yêu cầu child class gọi super () nếu nó có sử dụng constructor. Nếu child class không sử dụng constructor thì bạn chỉ cần viết code như dưới trong lớp Bird.

classBirdextendsAnimal{fly(){
        console.log('flying');}}

Ví dụ bạn muốn thêm một thuộc tính color trong class Bird, bạn có thể làm như bên dưới:

classBirdextendsAnimal{constructor(legs, color){super(legs);this.color = color;}fly(){
			console.log('flying');}getColor(){returnthis.color;}}let pegion =newBird(2,'Green');
	console.log(pegion.getColor());

Output:

Green

Nguồn: viblo.asia

Bài viết liên quan

Tấn Công Ứng Dụng Web: Mối Đe Dọa Hàng Đầu – Phần 2

viết lại nội dung này ” Phát hiện các cuộc tấn công Cross Site Scripting (XSS)

AI Chatbot 2025: Xu Hướng Tất Yếu Cho Doanh Nghiệp Dẫn Đầu

Giới thiệu AI chatbots đã trải qua một hành trình đáng kể, từ những công cụ t

Tấn Công Ứng Dụng Web: Mối Đe Dọa Hàng Đầu – Phần 1

Tấn công web là gì? Ứng dụng web là các ứng dụng cung cấp dịch vụ cho người

SEO Mũ Trắng, Mũ Đen, Mũ Xám: Hiểu Biết và Lựa Chọn Phù Hợp

SEO Mũ Trắng, Mũ Đen, Mũ Xám: Hiểu Biết và Lựa Chọn Phù Hợp Trong kỷ nguyên s