Nazwane procedury obsługi zdarzeń w JavaScript

W poprzednich lekcjach używaliśmy jako procedur obsługi zdarzeń anonimowych funkcji. W rzeczywistości nie jest to konieczne - funkcja może być również zwyczajna, z nazwą. Załóżmy na przykład, że mamy taką funkcję:

function func() {
	console.log('!!!');
}

Załóżmy również, że istnieje przycisk:

<input id="button" type="submit">

Sprawmy, aby po kliknięciu przycisku wykonała się nasza funkcja func. W tym celu parametrem addEventListener przekażemy nazwę naszej funkcji, w ten sposób:

let button = document.querySelector('#button');
button.addEventListener('click', func);

function func() {
	console.log('!!!');
}

Dany jest następujący kod HTML:

<input id="button1" type="submit" value="button1">
<input id="button2" type="submit" value="button2">

Dane są następujące funkcje:

function func1() {
	console.log(1);
}

function func2() {
	console.log(2);
}

Spraw, aby po kliknięciu pierwszego przycisku wykonała się funkcja func1, a po kliknięciu drugiego - funkcja func2.