setInterval i clearInterval

Cześć, w mojej apce Vue chciałbym ustawić takiego toggla do interwałów, żeby nigdy dwa nie działały razem, ale mam kłopot, bo uruchamiając taki skrypt nie działa jak należy i na drugiego clicka włączają się oba. Moja metoda:

data() {
     return {
       switcher: false,
   }
}

methods: {
intervals() {
    this.switcher = !this.switcher;

                if(this.switcher) {
                    let firstInterval = setInterval(() => {
                        console.log('tutaj pierwsze klikniecie')
                    }, 1000)

                    firstInterval;

                    if(this.switcher === false) clearInterval(firstInterval);
                }

                
                if(!this.switcher) {
                    let secondInterval = setInterval(() =>{
                        console.log('Tutaj drugie kliknięcie')
                    }, 1000);

                    secondInterval;
                    
                    if(this.switcher === true) clearInterval(secondInterval);
                }

    }
}

Ktoś mógłby pomóc?

if (this.switcher) {
  let firstInterval = /* ... */;

  firstInterval; // co ta instrukcja robi?

  if (this.switcher === false) /* ... */ // w jakiej sytuacji ten `if` się spełni? (uwzględniając instrukcję warunkową wyżej, która jest przeciwieństwem tego ifa)
}

A możesz szerzej opisać problem? Co dokładnie robią te interwały? Przyznam, że ten kod wygląda dziwnie :)