BFE.devでのAI解答例 - フロントエンド面接質問
125. EventTarget.addEventListener() の第三引数を説明してください

EventTarget.addEventListener()の第三引数は、オプションで、イベントリスナーを追加する際の振る舞いを指定するために使用されます。この引数は、オブジェクトまたはブール値をとることができます。

オブジェクトの場合、下記のようないくつかのプロパティを持つオプションオブジェクトを渡すことができます。

• capture: ブール値。trueの場合、captureフェーズでイベントを処理します。デフォルトはfalseです。
• once: ブール値。trueの場合、リスナーが一度だけ呼び出されます。デフォルトはfalseです。
• passive: ブール値。trueの場合、スクロール等の場面で用いられるタッチアクション等の割込みを禁止し、スクロール処理の滑らかな動作に必要なタイミングの妨げを減らします。このフラグは、非同期で実行されるアクションを取り扱う場合は意味がありません。デフォルトはfalseです。

ブール値を渡す場合は、captureフェーズでの処理を行う場合にtrueを指定し、そうでない場合はfalseを指定します。デフォルトはfalseです。

例えば、以下のようなコードを使用して、キャプチャリスナーを追加することができます。

element.addEventListener('click', myFunction, {capture: true});

また、以下のようなコードを使用して、パッシブリスナーを追加することもできます。

element.addEventListener('touchstart', onTouchStart, {passive: true});