JavaScriptでリサイズの度にページを更新する関数を実行したい

前提・実現したいこと

現在JavaScriptにてページを読み込んだ際に背景画像が遷移するスライドショーを実装しようとしており、実際にモバイル版とPC、タブレット版に分けて画像を変えて実装したのですが、手動で画面幅をリサイズした際にスライドショーが始まらない現象が起こっている（リサイズ後に更新すれば正常に動作する）のを修正し、手動でリサイズした際にJavaScriptの仕組みとして更新するように処理し、スライドショーを開始させたいです。

試したこと

上記のような機能を実装するため、
function reload (){ //ページを更新するための関数
document.location.reload;
};
という関数を定義し、
window.onresize =reload;
の構文を用いてリサイズされた際にページを更新するような処理を記述したのですが、変わらずリサイズしてもスライドショーが始まらないです。

該当のソースコード

JavaScript
1
2// スライドショー関連
3// 宣言
4const images =[ 
5  'img/image05.png',
6  'img/image01.png',
7  'img/image06.png',
8  'img/image02.png',
9  'img/image04.png',
10  'img/image03.png'
11];
12const spImages =[
13  'img/spimage03.png',
14  'img/spimage01.png',
15  'img/spimage04.png',
16  'img/spimage02.png'
17]
18let counter =0;
19const mainImage =document.getElementById('mainImage');
20const spImage =document.getElementById('spImage');
21function reload (){ //ページを更新するための関数
22  document.location.reload;
23};
24// 以下スライドショーのための処理
25if (matchMedia('(max-width: 600px)').matches) { //ウィンドウサイズが600px以下（スマホ版）の時
26  window.addEventListener('load' , function slideChange2(){	// 定期的に画像を更新する関数
27    if (counter == spImages.length-1){	// 最後の画像まで表示したのなら
28        counter=0;	// 最初の画像に戻す
29        spImage.classList.add('fadein-out');
30        setInterval(() => {
31          spImage.classList.remove('fadein-out')
32        }, 1000);
33      }
34      else{	// 最後の画像まで表示していないのなら
35        counter++;	// 次の画像へ
36        spImage.classList.add('fadein-out');
37        setInterval(() => {
38          spImage.classList.remove('fadein-out')
39        }, 1000);
40      }	
41      setTimeout( slideChange2 , 10000);	// 10秒周期に画像を更新する
42      spImage.src = spImages[counter];	// 次の画像を表示する )
43      });
44    // window.addEventListener('resize' , reload ());
45    } else { // それ以外(PC版とタブレット版)
46      window.addEventListener('load' , function slideChange(){
47        if (counter == images.length-1){	// 最後の画像まで表示したのなら
48          counter=0;	// 最初の画像に戻す
49          mainImage.classList.add('fadein-out');
50          setInterval(() => {
51            mainImage.classList.remove('fadein-out')
52          }, 1000);
53        }
54        else{	// 最後の画像まで表示していないのなら
55          counter++;	// 次の画像へ
56          mainImage.classList.add('fadein-out');
57          setInterval(() => {
58            mainImage.classList.remove('fadein-out')
59          }, 1000);
60        }	
61        setTimeout( slideChange , 10000);	// 10秒周期に画像を更新する
62        mainImage.src = images[counter];	// 次の画像を表示する
63      });
64      // window.addEventListener('resize' , reload ());
65    };
66window.onresize =reload;