title: Prevent addEventListener() run
body: <p>I have a function that runs speech recognition when I click button <code>start</code>, when speech recognition is over some actions should be started. I use <code>addEventListener('audioend', ()=&gt;...)</code> to track the event. Everything work as expected, but now I am adding another functionality to stop listening when I click the same button and the function should be completed also. But I faced an issue with <code>addEventListener</code> that runs despite the <code>return</code> key word.</p>
  <pre><code>const recognition = new SpeechRecognition.getRecognition()
  const [isPlaying, setIsPlaying] = useState(false)
  
    function playSong() {
      setIsPlaying(!isPlaying) //when I click 'Play' button again it changes to 'Stop'
      if (listening) { //verify if speech recognition listening 
        SpeechRecognition.stopListening()
        console.log('Should stop here') 
        return   //I try to use return but it doesn't help, in any case addEventListener runs next
      }else if {
        recognition.addEventListener('audioend', () =&gt; {
        console.log('Some other actions')
      }
     ........
  }
  </code></pre>