１.指定したURLにページ遷移する

以下実装イメージ
(例としてボタン押下時に遷移するようにします)

２.新規タブで指定したURLのページを開く

以下実装イメージ
(例としてボタン押下時に遷移するようにします)

参考文献
・JavaScript コードレシピ集
・Window.open()公式リファレンス(日本語Ver.)
・Window.location 公式リファレンス(日本語Ver.)

JavaScriptを使用して指定したURLにページ遷移させるためにはwindow.location.hrefを使用します。

動きとしてはHTMLのaタグをクリックした時と同じ動作をします。

こちらの実装方法は以下になります。使用の際はURLと記載している箇所に、遷移させたいURLを設定してください。

location = 'URL';

//または
location.href = 'URL';

//または
window.lacation = 'URL';

//または
window.location.href = 'URL';

//実装例：GoogleのTOPへ移動させたい場合
location = 'https://www.google.com';

上記で紹介したように、"window"と"href"は省略可能です。"window"は言わずと知られてますが、グローバルオブジェクトのため省略可能です。 "href"は公式リファレンスに以下のように書いてあるので省略可能です。

引用元：Window.location 公式リファレンス(日本語Ver.)

省略してもしなくても同義とのことです。なぜ同義なのかまではわかりませんでしたが公式さんが一緒だと言っているので省略できるのです。

実際どのような動きをするかは以下のボタンを押して確認してみてください。（変なサイトとかには飛びませんのでご安心ください）

次にJavaScriptを使用して新規タブで指定したURLのページを表示する方法について解説します。

JavaScriptを使用して新規タブを開くにはwindow.open()を使用します。

こちらを使用するとHTMLのaタグにtarget = "_blank"を設定した動きと同じになります。

以下が実装方法です。こちらも使用の際はURLと記載している箇所に、新規タブで開きたいURLを設定してください。

window.open('URL');

//実装例：GoogleのTOPを開きたい場合
window.open('https://www.google.com');

さて、お気づきの方もいるかもしれませんがこのままではTabnabbingを受ける可能性があります。

ここで話すと長くなるので知らない方は"a blank noopener"とかでググってみてください。

結論から言いますと、実装するWebサイト次第ですがwindow.open()をHTMLのaタグでいうところのrel="noopener"で開く必要があると言うことです。

そのため実際に使用するときは以下のように引数を追加して実装するのが安全です。

window.open('URL', '_blank', 'noreferrer');

//実装例：GoogleのTOPを開きたい場合
window.open('https://www.google.com', '_blank', 'noreferrer');

ちなみに"noopener"と話していたにも関わらず"noreferrer"を使用しているのは、"noreferrer"を設定することで "noopener"も付与されるからです。

参考文献：Window.open()公式リファレンス(日本語Ver.)

新規タブでページが開く実際の動きは以下のボタンを押して確認してください。