JavaScriptのhistory.go()メソッドは、ブラウザの履歴内を移動するための便利な機能です。このメソッドを使うことで、ユーザーがブラウザの「戻る」「進む」ボタンを押したような動作を、プログラムから実現できます。

history.go()の基本的な使い方

// 1つ前のページに戻る
history.go(-1);

// 1つ先のページに進む
history.go(1);

// 2つ前のページに戻る
history.go(-2);

パラメータの説明

history.go()メソッドは、整数値を引数として受け取ります:

  • 負の数:指定した数だけ前のページに戻ります
  • 正の数:指定した数だけ次のページに進みます
  • 0:現在のページを再読み込みします

よく使用されるショートカットメソッド

history.go()の代わりに、以下のショートカットメソッドも利用できます:

// 1つ前に戻る
history.back();

// 1つ先に進む
history.forward();

実装例

// 戻るボタンの実装
const backButton = document.getElementById('backButton');
backButton.addEventListener('click', () => {
    history.go(-1);
});

// 進むボタンの実装
const forwardButton = document.getElementById('forwardButton');
forwardButton.addEventListener('click', () => {
    history.go(1);
});

注意点

1. セキュリティ上の制限により、異なるドメイン間での履歴移動はできません。

2. 履歴が存在しない場合(これ以上戻れない・進めない場合)は、何も起こりません。

3. ブラウザの設定によっては、動作が制限される場合があります。

ブラウザ互換性

history.go()メソッドは、主要なモダンブラウザ(Chrome、Firefox、Safari、Edge)で広くサポートされています。

まとめ

history.go()メソッドは、JavaScriptでブラウザの履歴操作を行う際の基本的な機能です。シンプルな実装で履歴のナビゲーションを実現できる便利なメソッドですが、セキュリティやブラウザの制限には注意が必要です。

実際の開発では、SPAフレームワークのルーティング機能と組み合わせて使用することも多く、ユーザー体験を向上させるための重要な要素となっています。