Bạn có thể triển khai kế thừa bằng javascript không?

chào mọi người. Trong bài viết ngắn này, chúng ta sẽ nói về kế thừa nguyên mẫu trong JavaScript và ý nghĩa của nó là gì

Mục lục

giới thiệu

Bạn đã bao giờ tự hỏi làm thế nào các chuỗi, mảng hoặc đối tượng “biết” các phương thức mà mỗi chúng có chưa?

Câu trả lời là các phương thức này được tích hợp sẵn trong từng loại cấu trúc dữ liệu nhờ một thứ gọi là kế thừa nguyên mẫu

Trong JavaScript, một đối tượng có thể kế thừa các thuộc tính của một đối tượng khác. Đối tượng từ đó các thuộc tính được kế thừa được gọi là nguyên mẫu. Nói tóm lại, các đối tượng có thể kế thừa các thuộc tính từ các đối tượng khác - các nguyên mẫu

Chắc bạn đang thắc mắc. tại sao cần phải thừa kế ở nơi đầu tiên? . Bằng cách kế thừa, các đối tượng có thể chia sẻ các thuộc tính và phương thức mà không cần phải đặt các thuộc tính và phương thức đó theo cách thủ công trên từng đối tượng

Cách truy cập các thuộc tính và phương thức của nguyên mẫu trong JavaScript

Khi chúng ta cố gắng truy cập một thuộc tính của một đối tượng, thuộc tính đó không chỉ được tìm kiếm trong chính đối tượng đó. Nó cũng được tìm kiếm trong nguyên mẫu của đối tượng, trong nguyên mẫu của nguyên mẫu, v.v. – cho đến khi tìm thấy một thuộc tính khớp với tên hoặc đạt đến điểm cuối của chuỗi nguyên mẫu

Nếu thuộc tính hoặc phương thức không được tìm thấy ở bất kỳ đâu trong chuỗi nguyên mẫu, thì chỉ khi đó JavaScript mới trả về

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

7

Mọi đối tượng trong JavaScript đều có một thuộc tính bên trong gọi là

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

0

Nếu chúng ta tạo một mảng và ghi nó vào bảng điều khiển như thế này

const arr = [1,2,3]
console.log[arr]

Chúng ta sẽ thấy điều này

Dấu ngoặc vuông kép bao quanh

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

0 biểu thị rằng đó là thuộc tính nội bộ và không thể truy cập trực tiếp trong mã

Để tìm

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

0 của một đối tượng, chúng ta sẽ sử dụng phương thức

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

3

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

Đầu ra sẽ bao gồm một số thuộc tính và phương thức tích hợp

Hãy nhớ rằng các nguyên mẫu cũng có thể được thay đổi và sửa đổi thông qua các phương pháp khác nhau

Chuỗi nguyên mẫu

Ở cuối chuỗi nguyên mẫu là

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

4. Tất cả các đối tượng kế thừa các thuộc tính và phương thức của

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

5. Bất kỳ nỗ lực tìm kiếm nào ngoài phần cuối của chuỗi đều dẫn đến

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

6

Nếu bạn tìm nguyên mẫu của nguyên mẫu của một mảng, một hàm hoặc một chuỗi, bạn sẽ thấy đó là một đối tượng. Và đó là bởi vì trong JavaScript, tất cả các đối tượng đều là hậu duệ hoặc phiên bản của

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

4, là đối tượng đặt thuộc tính và phương thức cho tất cả các loại dữ liệu JavaScript khác

const arr = [1,2,3]
console.log[arr]

0

Mỗi loại nguyên mẫu [ví dụ nguyên mẫu mảng] định nghĩa các phương thức và thuộc tính riêng của nó và trong một số trường hợp sẽ ghi đè các phương thức và thuộc tính của

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

4 [đó là lý do tại sao mảng có các phương thức mà các đối tượng .

Nhưng bên trong và đi lên bậc thang của chuỗi nguyên mẫu, mọi thứ trong JavaScript đều được xây dựng dựa trên

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

4

Nếu chúng tôi cố gắng xem xét nguyên mẫu của

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

4, chúng tôi sẽ nhận được

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

6

const arr = [1,2,3]
console.log[arr]

5

Ngôn ngữ dựa trên nguyên mẫu

JavaScript là ngôn ngữ dựa trên nguyên mẫu, có nghĩa là các thuộc tính và phương thức của đối tượng có thể được chia sẻ thông qua các đối tượng tổng quát có khả năng được nhân bản và mở rộng

Khi nói đến tính kế thừa, JavaScript chỉ có một cấu trúc. các đối tượng

Mỗi đối tượng có một thuộc tính riêng [được gọi là

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

0 của nó] duy trì một liên kết đến một đối tượng khác được gọi là nguyên mẫu của nó. Đối tượng nguyên mẫu đó có nguyên mẫu riêng của nó, v.v. cho đến khi đạt được đối tượng có nguyên mẫu là

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

6

Theo định nghĩa,

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

6 không có nguyên mẫu và đóng vai trò là liên kết cuối cùng trong chuỗi nguyên mẫu này

Điều này được gọi là kế thừa nguyên mẫu và khác với kế thừa lớp. Trong số các ngôn ngữ lập trình hướng đối tượng phổ biến, JavaScript tương đối độc đáo, vì các ngôn ngữ nổi bật khác như PHP, Python và Java là các ngôn ngữ dựa trên lớp, thay vào đó định nghĩa các lớp là bản thiết kế cho các đối tượng.

Tại thời điểm này, bạn có thể nghĩ "Nhưng chúng ta CÓ THỂ triển khai các lớp trên JavaScript. ". Và vâng, chúng ta có thể, nhưng dưới dạng đường cú pháp. 🤫🤔

Lớp Javascript

Các lớp là một cách để thiết lập một kế hoạch chi tiết để tạo các đối tượng với các thuộc tính và phương thức được xác định trước. Bằng cách tạo một lớp với các thuộc tính và phương thức cụ thể, sau này bạn có thể khởi tạo các đối tượng từ lớp đó, lớp này sẽ kế thừa tất cả các thuộc tính và phương thức mà lớp đó có

Trong JavaScript, chúng ta có thể tạo các lớp theo cách sau

const arr = [1,2,3]
console.log[arr]

9

Và sau đó chúng ta có thể khởi tạo một đối tượng từ lớp đó như thế này

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

0

Các lớp được sử dụng như một cách để làm cho mã có tính mô-đun hơn, có tổ chức và dễ hiểu hơn và được sử dụng nhiều trong lập trình OOP

Nhưng hãy nhớ rằng JavaScript không thực sự hỗ trợ các lớp như các ngôn ngữ khác. Từ khóa

const arr = [1,2,3]
console.log[arr]

05 đã được giới thiệu với ES6 dưới dạng đường cú pháp tạo điều kiện thuận lợi cho cách tổ chức mã này

Để hình dung điều này, hãy xem điều tương tự mà chúng ta đã làm bằng cách xác định trước đây một

const arr = [1,2,3]
console.log[arr]

05, chúng ta có thể làm điều đó bằng cách xác định một hàm và chỉnh sửa nguyên mẫu theo cách sau

const arr = [1,2,3]
console.log[Object.getPrototypeOf[arr]]

3

Bất kỳ hàm nào cũng có thể được gọi dưới dạng hàm tạo với từ khóa

const arr = [1,2,3]
console.log[arr]

07 và thuộc tính nguyên mẫu của hàm đó được sử dụng để đối tượng kế thừa các phương thức từ. Trong JavaScript, “lớp” chỉ được sử dụng về mặt khái niệm để mô tả thực tiễn trên – về mặt kỹ thuật, chúng chỉ là các hàm. 😑

Mặc dù điều này không nhất thiết tạo ra nhiều khác biệt [chúng ta vẫn có thể triển khai hoàn hảo OOP và sử dụng các lớp như trong hầu hết các ngôn ngữ lập trình khác], nhưng điều quan trọng cần nhớ là JavaScript được xây dựng với sự kế thừa nguyên mẫu ở cốt lõi của nó

làm tròn

Vậy là xong nhé mọi người. Như mọi khi, tôi hy vọng bạn thích bài viết này và học được điều gì đó mới. Nếu muốn, bạn cũng có thể theo dõi tôi trên LinkedIn hoặc Twitter

Xin chào và hẹn gặp lại trong số tiếp theo. =D

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

Đức Cocca

Tôi là một nhà phát triển toàn diện [javascript. bản đánh máy. phản ứng. phản ứng tự nhiên. node] và sinh viên khoa học máy tính. Ở đây tôi viết về những điều tôi học được trên con đường trở thành nhà phát triển tốt nhất mà tôi có thể trở thành

Nếu bạn đọc đến đây, hãy tweet cho tác giả để cho họ thấy bạn quan tâm. Tweet một lời cảm ơn

Học cách viết mã miễn phí. Chương trình giảng dạy mã nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có được việc làm với tư cách là nhà phát triển. Bắt đầu

Làm cách nào để viết kế thừa trong JavaScript?

Loại kế thừa nào được sử dụng trong JavaScript?

Làm cách nào để triển khai đa kế thừa trong JavaScript?

JavaScript xử lý kế thừa trong các đối tượng như thế nào?