Введение
Добро пожаловать в симфонию программирования на JavaScript! Сегодня мы собираемся изучить важную концепцию JavaScript, называемую прототипами. Однако вместо того, чтобы использовать обыденные примеры, мы будем учиться с помощью музыки. Итак, давайте брать правильные ноты и настраиваться на ритм прототипов!
Что такое прототип в JavaScript?
В JavaScript почти все является объектом, и эти объекты связаны друг с другом в то, что мы называем «цепочкой прототипов». Прототип — это, по сути, «родительский» объект, от которого другие объекты наследуют свойства и методы.
Этот механизм является краеугольным камнем объектно-ориентированного программирования (ООП) JavaScript, позволяя объектам совместно использовать методы, что приводит к лучшему использованию памяти и организованной структуре.
Мелодия прототипов: музыкальный пример
Давайте представим, что мы пытаемся создать базовую структуру для музыкальной библиотеки. Мы начнем с определения функции-конструктора для «Песни».
function Song(title, artist, duration) { this.title = title; this.artist = artist; this.duration = duration; }
В нашей музыкальной библиотеке у каждой песни есть название, исполнитель и продолжительность. Но чего-то не хватает — как насчет способности песни играть? Вместо добавления метода play
непосредственно в конструктор (что означало бы, что каждый объект песни будет иметь свою собственную копию), мы можем добавить его в прототип Song
:
Song.prototype.play = function() { console.log(`Playing: ${this.title} by ${this.artist}`); }
Теперь каждая песня, которую мы создаем с помощью конструктора Song
, будет иметь доступ к методу play
:
let song1 = new Song("Bohemian Rhapsody", "Queen", "5:55"); song1.play(); // Logs: "Playing: Bohemian Rhapsody by Queen"
Дирижирование оркестром: сила прототипического наследования
Прототипы действительно сияют, когда мы говорим о наследовании. Представьте, что мы хотим добавить в нашу библиотеку особый тип песни: «LiveSong». Концертная песня обладает всеми свойствами обычной песни, но также имеет location
место, где она исполнялась вживую.
Вот как мы можем создать конструктор LiveSong
, который наследуется от Song
:
function LiveSong(title, artist, duration, location) { Song.call(this, title, artist, duration); this.location = location; } LiveSong.prototype = Object.create(Song.prototype); LiveSong.prototype.constructor = LiveSong;
Объекты LiveSong
могут использовать метод play
, но у них также есть уникальный метод where
:
LiveSong.prototype.where = function() { console.log(`This song was played live in ${this.location}`); } let liveSong1 = new LiveSong("Hotel California (Live)", "Eagles", "7:12", "Washington"); liveSong1.play(); // Logs: "Playing: Hotel California (Live) by Eagles" liveSong1.where(); // Logs: "This song was played live in Washington"
Ваша очередь: создание музыкального плейлиста
Задача: создать конструктор Playlist
с массивом объектов Song
. Этот Playlist
должен иметь два метода:
addSong(song)
: Добавляет песню в список воспроизведения.playAll()
: Воспроизведение всех песен в списке воспроизведения в том порядке, в котором они были добавлены.
Подсказка: не забывайте использовать прототипы для методов!
Заключение
Подобно симфонии, язык JavaScript