If I have a bunch of buttons in HTML and run:

const buttons = document.querySelectorAll('button');

buttons.forEach((btn) => {
  btn.addEventListener('click', (e) => {
    console.log(btn.textContent);
    console.log(e.target.textContent);
  });
});

What is the difference between btn and e.target? I know I could use event delegation to make this cleaner but, want to know if these are the exact same and can be used interchangeably.