230331

📌this 가 동작하는 원리와 용법을 아는대로 설명해주세요. 평소 코드 중에서는 어떤 부분에서 가장 큰 차이가 생기나요?

• this란?
  • 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수.
  • 현재 실행 중인 함수의 객체를 참조.
  • this의 값은 함수 호출 방식에 따라 달라진다.
• this의 동작 원리
  • 일반 함수 호출에서 this는 전역 객체를 가리킨다.
  • 객체의 메소드로 호출된 함수에서 this는 해당 객체를 가리킨다.
  • 생성자 함수에서 this는 생성된 객체를 가리킨다.
  • call() 또는 apply() , bind() 메소드 사용 시 메소드에 첫 번째 인수로 전달하는 객체에 바인딩된다.

💡참고

https://velog.io/@wjddms0501/This-%EB%8F%99%EC%9E%91%EC%9B%90%EB%A6%AC-%EC%9A%A9%EB%B2%95-%EC%B0%A8%EC%9D%B4%EC%A0%90

This의 동작원리와 용법

https://hanamon.kr/javascript-this%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%BC%EA%B9%8C/

[JavaScript] this 란 무엇일까? - 하나몬

https://velog.io/@realryankim/JavaScript-this%EB%9E%80

[JavaScript] this란?

https://wormwlrm.github.io/2019/03/04/You-should-know-JavaScript-this.html.html

JavaScript 개발자라면 꼭 알아야 할 this - 재그지그의 개발 블로그

 

---

📌브라우저 저장소에 대해서 차이점을 설명해주세요.(local storage, session storage, cookie)

• 웹 스토리지 (Web Storage) 
  • 웹 데이터를 클라이언트에 저장하기 위해 만들어진 key:value 형식의 저장소.
  • 로컬 스토리지 (Local Storage)와 세션 스토리지 (Session Storage)로 나눌 수 있음
  • 두 스토리지의 차이점은 영구성과 범위.
  • Local Storage
    • 브라우저를 종료해도 데이터를 보관(영구성)
    • 도메인만 같으면 전역적으로 데이터 공유
    •  window.lacalStorage 객체를 사용
  • Session Storage
    • 브라우저가 종료되면 데이터 삭제(비영구성)
    • 도메인이 같아도 브라우저가 다르면(탭 브라우저, 다른 브라우저) 브라우저 컨텍스트가 다르기 때문에 각각의 세션 스토리지가 형성되어 데이터가 공유되지 않음.
    •  window.sessionStorage 객체를 사용
  • 지속적으로 필요한 정보를 저장할 때는 Local Storage, 잠시 동안 필요한 정보를 저장할 때는 Session Storage
• 쿠키 (Cookie)
  • 서버와 클라이언트가 지속적으로 데이터 교환을 하기 위해 만들어짐.
  •  HTTP의 일종으로 사용자가 어떠한 웹 사이트를 방문 할 경우 그 사이트가 사용하고 있는 서버에서 사용자의 컴퓨터에 저장하는 작은 기록 정보 파일
  • 4KB의 용량 제한, 한 사이트 당 20개의 쿠키, 만료기한 지정 가능
  • 쿠키의 목적
    • 세션 관리 : 서버가 알아야 될 정보 (로그인 및 사용자 정보, 접속 시간)
    • 개인화 : 사용자에 맞는 페이지 제공
    • 트래킹 : 사용자 행동 및 패턴 분석
• 웹 스토리지와 쿠키의 차이
  • 웹 스토리지는 쿠키와 달리 서버에 전송되지 않고 명시적으로만 전송 가능해 서버 부담 X
  • 웹 스토리지는 용량에 제한이 없고 쿠키는 제한이 있음.
  • 쿠키는 만료 일자를 설정하지 않으면 세션 쿠키, 설정하면 지속적 쿠키로 간주.
    세션 쿠키의 경우 메모리에 저장 되어 브라우저나 탭이 닫히면 삭제되고 지속적 쿠키는 디스크에 저장되어 임의로 삭제하거나 만료일이 도래하기 전까지는 데이터가 저장된다.
    웹 스토리지는 만료 기한 설정이 없음.

💡참고

https://ryuhojin.tistory.com/10

브라우저 저장소( 로컬 스토리지, 세션 스토리지, 쿠키 )