Javascriptでの変数の挙動について

Question

お世話になっております。

参考書を見ながら勉強しているのですが

初歩的な質問失礼します

let resizeTimer;

window.addEventListener('resize',() =>{

if(resizeTimer != null) {
clearTimeout(resizeTimer);
}

resizeTimer = setTimeout(() => {
 onResize();
},1000);


});

fuction onResize() {}

上記のコードなのですがウィンドウズをresizeは処理負担が高いので一度だけ呼び出せるように
resizeがTick感覚で呼ばれないようにresizeイベントが終了して1秒後にresizeメソットを呼び出すようにな処理をしているみたいなのですが
->どこでresizeメソットが終了したのか確認しているのでしょうか

Comments

[m.ts10806]

＞メソット
methodなので強いて日本語で表記するなら「メソッド」です。

Answer 1

一度だけresizeを呼び出しているのではなく、resize検知の都度一秒後に処理を実行するようにタイマー設定しています
ただし、新しくタイマーを設定する際に事前に登録されたタイマー処理があればそれを実行させないように解除しています

1. resize検知
2. 1秒後にonResize()をするように設定（タイマー）
3. resize検知
4. タイマーがあれば解除し、新たに1秒後にonResize()をするように設定（新しいタイマー）

の繰り返しをしているだけです