推薦一波原生的js 源碼 大佬寫的 我只能膜拜

const state = {};

// Message alert
const displayMessage = () => {
    setTimeout(() => {
        message = document.querySelector('.message');
        if (message) {
            message.classList.add('delete');
            message.addEventListener('animationend', () => {
                message.parentNode.removeChild(message);
            });
        }
    }, 2000);
};



// for listener like btn, change color when user click icon
book = document.querySelector('.books');
if(book) {
    book.addEventListener('click', event => {
        favButton = event.target.closest('.book__fav-btn');
        if(favButton) {
            favButton.classList.toggle('faved');    // add faved class for change color
            bookid = parseInt(favButton.dataset['bookid']);

            // check the book is like or not
            if(state.like.isLiked(bookid)) {
                state.like.deleteLike(bookid);
            } else {
                state.like.addLike(bookid);
            }
        }
    });
}



// like model
class Like {
    constructor() {
        this.like = [];
    }

    async addLike(bookid) {
        // add bookid form db
        state.like.like.push(bookid);
        const response = await fetch(`/like/toggle/${bookid}/`, {
            method: 'POST'
        });
    }

    async deleteLike(bookid) {
        const index = state.like.like.findIndex(element => element === bookid);
        state.like.like.splice(index, 1);
        const response = await fetch(`/like/toggle/${bookid}/`, {
            method: 'DELETE'
        });
    }

    isLiked(bookid) {
        if(state.like.like.includes(bookid)){
            return true   
        }
        return false
    }

    async getLike() {
        // get like from db
        const response = await fetch('/like');

        if(response.status === 200) {
            const data = await response.json();
            return data       
        }
    }
};


async function renderLike() {

    // get user's like list then store in like.like
    const result = await state.like.getLike();
    
    if(result && result.code === 1) {
        state.like.like = result.books;   // get the list of book's id
        
        // find all the button
        favBtns = document.getElementsByClassName('book__fav-btn');
    
        // get dataset for each button and change color
        for(let i=0; i<favBtns.length; i++) {
            bookid = parseInt(favBtns[i].dataset['bookid']);

            // if bookid in user's like list, change the color
            if(state.like.like.includes(bookid)) {
                favBtns[i].classList.add('faved');  // add faved class to btn 
            }
        }
    }
};

window.addEventListener("load", () => {
    
    displayMessage();

    state.like = new Like();
    renderLike();
});

整個網站就點js，我真的佩服，太優秀了，終究還是自己太菜，有大佬懂的，可否跟我稍微解釋一下