تعلم كيفية التعامل مع معلومات الكتب وعرضها باستخدام JavaScript، بالإضافة إلى بناء واجهة تفاعلية لعرض تفاصيل الكتب.
// Book Class Definition
class Book {
constructor(title, author, pages) {
this.title = title;
this.author = author;
this.pages = pages;
}
getDetails() {
return `${this.title} by ${this.author} - ${this.pages} pages.`;
}
}
// Ebook Class Definition (extends Book)
class Ebook extends Book {
constructor(title, author, pages, fileSize) {
super(title, author, pages);
this.fileSize = fileSize;
}
getEbookDetails() {
return `${this.getDetails()} Available in ebook format with a file size of ${this.fileSize}MB.`;
}
}
// Create Instances of Book and Ebook
const book1 = new Book("The Subtle Art of Not Giving a F*ck", "Mark Manson", 300);
const ebook1 = new Ebook("How to Win Friends and Influence People", "Dale Carnegie", 250, 2.5);
// Get book container element
const bookContainer = document.getElementById("bookContainer");
// Display Books on Page
[book1, ebook1].forEach(book => {
const bookDiv = document.createElement("div");
bookDiv.className = "book";
bookDiv.innerHTML = `
${book instanceof Ebook ? book.getEbookDetails() : book.getDetails()}
`;
bookContainer.appendChild(bookDiv);
});