this / local storage, session storage, cookie

새양말·2023년 3월 31일
0

내일배움캠프TIL

목록 보기
68/74
post-thumbnail

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

자바스크립트에서 코드가 실행되고 있는 현재 개체를 참조하는 this는 개체 메서드를 정의하고 사용하면 보다 유연하고 재사용 가능한 코드를 작성할 수 있습니다.

  • 함수와 메서드에서 쓰일 때 this는 차이가 있습니다.
  • 함수는 그 자체로 독립적인 기능 수행하기 때문에 호출 주체가 없어서 this는 지정될 수 없습니다. 따라서 이 때의 this는 전역객체 window를 바라봄
  • 메서드는 자신을 호출한 대상 객체에 관한 동작을 수행하기 때문에 이 때의 this는 호출한 개체가 됩니다. 개체 다음에 대괄호나 .bind로 객체가 명시되어있으면 항상 this는 바인딩될 수 있다....
  1. 개체 속성 및 메서드 액세스: "this"를 사용하면 현재 개체의 속성 및 메서드에 액세스할 수 있으므로 코드가 더 유연하고 재사용 가능해집니다.
  2. 함수를 객체에 바인딩: "this"를 사용하여 함수를 객체에 바인딩하면 함수가 호출될 때 항상 올바른 객체를 참조하도록 할 수 있습니다.
  3. 개체 생성자 만들기: "This"는 개체의 새 인스턴스를 만드는 데 사용할 수 있는 개체 생성자를 만드는 데 사용할 수 있습니다.
  4. 이벤트 처리: "This"는 이벤트를 트리거한 개체를 참조하기 위해 이벤트 처리기에서 자주 사용됩니다.

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

브라우저 저장소에는 크게 두 가지, 웹 스토리지와 쿠키로 나뉩니다.
먼저 웹 스토리지는 데이터를 영구적으로 저장하는 로컬 스토리지와 임시적으로 저장하는 세션 스토리지가 있습니다.
1. 로컬스토리지는 데이터를 영구적으로 저장하기 때문에 브라우저를 닫아도 사용자의 브라우저에 남아있습니다.
(도메인만 같으면 전역적으로 공유)
2. 하지만 세션스토리지는 브라우저를 닫으면 데이터는 삭제됩니다. 도메인이 같아도 브라우저 다르면 데이저 공유가 되지 않습니다. (탭마다 다름)

이런 웹 스토리지와 쿠키는 모두 데이터를 저장하지만 쿠키는 데이터를 서버로 전송한다는 차이점이 있습니다.
쿠키는 주로 웹사이트에서 사용자를 식별하거나 기본 설정을 기억하는 데 사용할 수 있는 소량의 데이터를 저장하는 데 사용됩니다.
예를 들어 사용자의 검색 기록에 대한 정보를 저장하거나 사용자의 관심사에 따라 대상 광고를 제공하는 데 사용될 수 있습니다. 쿠키도 임시적으로 저장할지, 영구적으로 저장할지 정할 수 있습니다.

3가지 중에선 저장해야 하는 데이터 유형과 사용 계획에 따라 달리 선택하여 사용하면 됩니다.
웹 스토리지는 서버로 보낼 필요가 없는 데이터를 저장하는 데 효율적일 것 같습니다. 반대로 모든 요청에서 서버로 보내야 하는 작은 데이터 조각만 저장해야 한다면 쿠키가 더 적절할 것 같습니다.
ex. 7일동안 이 광고를 더이상 보지 않기 - 로그인 한 후에 이 값을 저장해야 해서 쿠키를 사용하는 것이 적절할 것 같다.

쿠키는 웹 사이트에서 사용자 경험을 개선하는 데 유용할 수 있지만 개인 정보 보호 문제를 제기할 수도 있어서 사용자의 동의가 필요하다고 생각합니다.

profile
매번 기합넣는 양말

0개의 댓글