0

・あるサイトで下記のように書いてあったのですが、内容について教えてください

addEventListenerで登録したイベントリスナの第一引数に、イベントオブジェクトが自動的に渡されます

質問
・何のために自動的に渡されるのでしょうか?
・試しに第一引数を利用せず「event.preventDefault()」と書いたらイベントキャンセルされたのですが…
・下記の違いは?

・自動的に渡される引数を使用

function hoge(evt) {
  evt.preventDefault();
}

・eventを使用

function hoge() {
  event.preventDefault();
}

2 件の回答 2

5

・リスナがなんのイベントを処理してるか知るためです。
たとえば、複数の種類のイベントを1つのリスナで処理したい場合などです。inputイベントとchangeイベントで同じリスナを使いたいけどちょっとだけ処理を変えたいとか、WindowでのblurイベントとDocumentでのblurイベントでだいたい同じような処理をしたいけど、ちょっとだけ違う処理をしたいとか。evt.typeでイベントの種類、evt.targetでイベントが発火したオブジェクトを参照できます。

・引数を使わないでeventを参照する方法は非標準です
Firefoxで動きません。IEの独自拡張で、WebKit系でもIEとの互換性のために動くようになっています。

0
function hoge(){
    ここに処理
}

function fuga(){
    hoge(引数1);
}

この場合、fuga()で渡された「引数1」を使用したい場合にどうするでしょうか?

function hoge(evt){
    evt.preventDefault();
}

function fuga(){
    hoge(引数1);
}

として、hoge()の受け取る引数に名前を付けてあげるか、

function hoge(){
    argments[0].preventDefault();
}

function fuga(){
    hoge(引数1);
}

としてargmentsを使用するかのどちらかだと思います。

function hoge() {
    event.preventDefault();
}

だと「event」は何者?ということになってしまいます。


  • 何のために自動的に渡されるのでしょうか?

「addEventListener」では渡されたイベントオブジェクトによって処理を分岐したいことがあるからではないでしょうか?

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。