HostListener

import { ..., HostListener } from '@angular/core';

@Component({...})
export class SomeComponent  {
  @HostListener('window:beforeunload', ['$event'])
  clearLocalStorage(event) {
    this.storageService.removeItem('아이템이름');
  }
}

HostListner는 이벤트를 수신할때 사용할 수 있다
첫 번째 파라미터로는 이벤트 이름을 문자열로 받고,
두 번째 파라미터로는 이벤트가 발생될 때 발생하는 파라미터들을 받는다.
둘 다 옵셔널하다.

window.beforeunload

브라우저가 닫히기 전에 실행하고 싶을 때 사용

---

새로고침과 브라우저종료를 구분하기

• beforeunload는 새로고침 / 브라우저 종료를 구분할 수 없습니다.
  이때 활용하는 것이 sessionStorage 입니다!

• localStorage와 sessionStorage의 유일한 차이점은 만료시 삭제 여부입니다.

• localStorage : 만료 시간이 없어 사용자가 데이터를 수동으로 삭제할 때까지 유지
• sessionStorage : 세션이 만료되면 데이터가 삭제됩니다.(새로고침 시 데이터 유지)