☰

パラメータ e (イベント) とは何ですか? また、なぜそれを JavaScript 関数に渡すのですか? 質問する

tag-icon • tag-icon javascript events dom-events
パラメータ e (イベント) とは何ですか? また、なぜそれを JavaScript 関数に渡すのですか? 質問する

さて、私が JavaScript を学習したとき、私が読んだすべての本やインターネットの記事には、次のコード ブロックのように、JavaScript イベントを処理する関数にパラメーターを渡すコードが示されていましeた。

function myEvent(e) {
    var evtType = e.type
    alert(evtType)
    // displays click, or whatever the event type was
}

私はこれまでずっとそれをありのままに受け入れてきましたが、今はいくつか疑問があります（私にとっては非常に混乱しています）。

  1. これはどこeから来ているのでしょうか? JavaScript ファイル全体を見ると、eまったく存在しないようです。
  2. なぜこのパラメータをe関数に渡すのですか? 渡さないと関数は動作しなくなりますかe?

  3. 以下のコード ブロックについて考えてみましょう。e匿名の内部関数に渡されるイベント変数 ( ) があります。匿名関数の外部 (おそらく行の上または下の行element.onkeypress) でイベント オブジェクトを使用したいとします。どうすればよいでしょうか。

    element.onkeypress = function(e) {
    if(e.keyCode) {
        element.keyCode = e.keyCode;
    } else {
        element.keyCode = e.charCode;
    }
};

ベストアンサー1

はの略eですevent

イベントを作成する最も簡単な方法は、ページ上のどこかをクリックすることです。

クリックすると、clickイベントがトリガーされます。これはevent実際には、発生したアクションに関する情報を含むオブジェクトです。この例の場合、イベントには、クリックの座標 (event.screenX例)、クリックした要素 ( event.target) などの情報が含まれます。

さて、イベントは常に起こっていますが、あなたは起こるすべてのイベントに興味があるわけではありません。はしかし、イベントリスナーを要素に追加してイベントを発生させる場合、イベントに関心があるかどうかはわかりません[1]。たとえば、ユーザーが「購読」ボタンをクリックしたときそしてあなたは何かをするこのイベントが発生したとき。

このイベントについて何かを行うには、イベントハンドラ関心のあるボタンに を追加します。ハンドラーを要素にバインドする方法は、 を実行することですelement.addEventListener(eventName, handler)。

eventNameは文字列で、関心のあるイベントの名前です。この場合は'click'(「クリック」イベントの場合) になります。

ハンドラーは単に関数イベントが発生したときに何かを行う（実行される）。デフォルトでは、ハンドラ関数は実行されるとeventオブジェクトが渡される（興味のあるイベント/アクションが発生したときに作成されたもの）議論として。

ハンドラ関数のパラメータとして を定義することはeventオプションですが、場合によっては（ほとんどの場合）、ハンドラ関数がイベントの発生を知ることが役立ちます。する定義するこれはeあなたが言及したような機能で見られるものです覚えておいてください、 はevent、多くのプロパティを持つ通常の JavaScript オブジェクトです。

お役に立てれば幸いです。

詳細は以下をご覧くださいイベントの作成とトリガー

3 番目の質問については、イベントが発生したときにのみ存在するため、これを行うことはできないことがわかっているはずです。実行時にオブジェクトにアクセスできるハンドラー関数を用意して、それをグローバル変数に格納し、それに対して作業を行うことeができます。e

[1] これは正確には正しくありませんが、理解しやすくなります。より正確には、「イベントが流れることがわかっている要素にイベントリスナーを追加する」ということです。これ詳細については

おすすめ記事