Question 54522 in Javascript Question posted in
A very good W3school tutorial can be found here.

If statements not behaving the way they should – Javascript

I wrote this function, in javascript, that should add and remove objects from an array and alert that it is doing it.

function modifyWatchlist(id, boolean, array)  {
    const isAdding = boolean
    const targetMovie = array.filter(movie => movie.imdbID === id)
    const isRepeated = watchlist.find(movie => movie.imdbID === id)
    
    if (isAdding && isRepeated != undefined) {
        alert('Film already in your watchlist')
    } 
    else if (isAdding && isRepeated === undefined) {
        // watchlist.push(targetMovie[0])
        // localStorage.setItem('watchlist', JSON.stringify(watchlist))
        alert('Film added to your watchlist')
    }
    else if (!isAdding) {
        // const newWatchlist = watchlist.filter(movie => movie.imdbID !== id)
        // localStorage.setItem('watchlist', JSON.stringify(newWatchlist))
        alert('Film removed from your watchlist')
    }   
}

When running the code above, the alert('Film already in your watchlist') statement runs even when isAdding === false. I do not understand the logic behind that and could not find a way to fix it. The alert('Film removed from your watchlist') statement still works as expected but the alert('Film already in your watchlist') always runs first.

That is one way the function is called:

document.addEventListener('click', (e) => {
    const id = e.target.dataset.id
    if (id) {
        modifyWatchlist(id, true, currentMovies)
    }
    else if (e.target.id === 'search-btn') {
        e.preventDefault()
        getMoviesArray()
    }
})

That is an other way this function is called

document.addEventListener('click', (e) => {
                const id = e.target.dataset.id
                if (e.target.dataset.id) {
                    modifyWatchlist(id, false, watchlist)
                    initWatchlist()
                }
            })
Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    The problem had nothing to do with the if statements, it was due to how I organized the my code between .js files and different .HTML files.

    Thanks to everybody that tried to help, I'll be deleting this question soon.


  2. 0

    Instead of using your instinct, why not try console.log your isRepeated variable before entering if else statement? Traditional way works most of the time and worth the hassle 😀.

    For example

    console.log("test1: " + isRepeated != undefined)
console.log("test2: " + isRepeated === undefined)
console.log("test3: " + isAdding)
    Login or Signup to reply.
  3. 0

    Can you show me how you are calling this function? Also, it is a great idea to use console.log for debugging purposes. You can add logs before the if checks to confirm the values. I have tested your code on a separate editor and it seems ‘Film already in your watchlist’ only displaying when isAdding is true.

    Here is how I used your function.

    watchlist = [{"imdbID": 1}]
array = [{"imdbID": 1}]
modifyWatchlist(1, false, array)

    Hope it helps.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search