導入：なぜpreventDefaultが必要なのか？
Web開発をしていると、リンクをクリックした時にページ遷移させたくない、あるいはフォームの送信ボタンを押した時にページをリロードさせたくないという場面に頻繁に遭遇します。ブラウザには、特定の操作に対してあらかじめ「デフォルトの挙動（既定のアクション）」が設定されています。この挙動を意図的にキャンセルし、JavaScriptで独自の処理を走らせるために欠かせないのが「Event.preventDefault」です。これを使いこなすことで、SPA（シングルページアプリケーション）のような滑らかなユーザー体験を実現できます。
基礎知識：デフォルト動作とは何か
ブラウザの「デフォルト動作」とは、HTML要素が持つ本来の役割のことです。例えば、以下のものが該当します。
・aタグ：href属性に指定されたURLへページ遷移する。
・formタグ：submitボタンが押されると、指定されたアクション先へデータを送信し、ページをリロードする。
・checkbox/radioボタン：クリックするとチェック状態が切り替わる。
Event.preventDefaultは、これらのイベントが発生した瞬間に「ブラウザ本来の処理をストップさせる」メソッドです。
実装：preventDefaultの仕組み
イベントリスナー内でイベントオブジェクト（通常はeやeventと命名）を受け取り、そのオブジェクトに対して.preventDefault()を呼び出すだけで実装可能です。このメソッドが実行されると、イベントの伝播は継続されますが、ブラウザ側の既定のアクションだけが実行されなくなります。
サンプルプログラム：フォーム送信を制御する
以下は、フォームの送信時にページをリロードさせず、JavaScriptで入力内容を取得してログに出力する例です。
応用・注意点：現場で気をつけるべきこと
1. passiveイベントリスナーとの併用不可：スクロールパフォーマンスを向上させるための「passive: true」を設定したイベントリスナー内では、preventDefaultは無視されます。タッチイベントなどでスクロールを止めたい場合は注意してください。
2. stopPropagationとの違い：よく混同されますが、preventDefaultは「ブラウザの挙動」を止め、stopPropagationは「イベントの親要素への伝播（バブリング）」を止めます。目的が異なるため、混同しないようにしましょう。
3. バリデーション後の実行：フォーム送信を止める際は、必須チェックなどのバリデーションロジックを先に書き、エラーがある場合のみpreventDefaultを呼ぶようにすると、ユーザーフレンドリーな挙動になります。
このメソッドを正しく理解し、動的なWebアプリケーション開発に役立ててください。