Não entendi o segundo parâmetro do addEvenetListener, a function(event)

Olá,

No parâmetro event são passados dados do evento disparado, como por exemplo:

• bubbles: true
• cancelBubble: false
• cancelable: true
• composed: false
• currentTarget: form.form
• defaultPrevented: false
• eventPhase: 2
• isTrusted: true
• path: (5) [form.form, body.container, html, document, Window]
• returnValue: true
• srcElement: form.form
• submitter: button.btn.btn-primary
• target: form.form
• timeStamp: 25224.41500000423
• type: "submit"

Esses dados podem ser utilizados pela função adicionada pelo addEventListener.

Então event é um "objeto genérico" já definido pelo javascript como o único parâmetro de uma function que por sua vez também é parâmetro da função addEventListener?

To achando isso bem confuso...

Pensa da seguinte forma, você já tem um escutador de evento em um elemento, isso por si só já é alguma coisa que precisa ser armazenado em algum local, este local é o event, já pré determinado pelo java script para nos ajudar, então se você deseja fazer alguma coisa com esta informação, este dado recebido do DOM, basta passar ele por parâmetro em uma função e realizar o que deseja, por exemplo event.preventDefault().

Felipe,

A sua definição está correta!

Nesse caso, o que o addEventListener nos diz é que ele precisa uma função como parâmetro da sua chamada e que quando, internamente, ele chamar essa função que foi passada como parâmetro pra ele, ele vai enviar um parâmetro, esse parâmetro é o event, que possui os dados do evento.

Passar uma função como parâmetro é bem comum, veja um exemplo abaixo:

[1, 2, 3, 4].forEach(function(i) { console.log(i) });
//1
//2
//3
//4

O que acontece no caso acima é que o forEach precisa de uma função que vai ser executada para cada item do array e próprio forEach vai mandar para essa função como parâmetro o item que ele está trabalhando.

Abraços!