Using splice inside a map function in javascript

Question

im doing a codewars kata where you have to remove the vowels from a string

This is the solution i was trying (I was able to solve the kata using filter, but wanted to know why was this way wrong)

function disemvowel(str) {
  let vowels = ["a","e","i","o","u","A","E","I","O","U"]
  var strArray = str.split("")
  strArray.map(function(x){
    if (vowels.includes(x)) {
      strArray.splice(strArray.indexOf(x),1) 
  }})
  console.log(strArray)
  return strArray.join("");
}

the problem i get is that some vowels don't get removed, the majority of them do, but just some don't and I dont know why. Sorry if it's a little confusing, english is not my native language.