CS

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

this가 동작하는 원리

자바스크립트에서 This는 문맥에 따라 가리키는 것이 달라집니다.

따라서 다른 언어와 달리 JS 런타임 상에서 this바인딩은 동적으로 결정됩니다.
이로 인하여 예상치 못한 코드 실행결과가 나올 수 있습니다.

대부분의 객체지향 프로그래밍 언어에서는 정적으로 인스턴스가 만들어지는 시점에 this가 결정됩니다. 하지만, 자바스크립트에서는 누가 호출하냐에 따라서 this가 달라질 수 있습니다.
즉, this는 호출하는 사람(Caller)에 의해서 동적으로 결정됩니다.

객체 안에서 this를 사용하는 경우

• 앞으로 내가 만들어질 인스턴스나 지금 객체 자기 자신을 가리킬 때 용도

특정한 객체와 this를 묶어두면?

• this 바인딩

화살표 함수 안에서의 this

• this에 대한 바인딩이 정적으로 결정된다. (함수에서 제일 근접한 상위 스코프의 this에 정적으로 바인딩된다.)

평소 코드 중에서 가장 큰 차이가 나는 부분

• 일반적인 함수 표현식에서의 this는 해당 함수를 어떻게 호출하는지에 따라 동적으로 this가 결정된다.
• 반면, 화살표 함수 안에서의 this는 함수에서 제일 근접한 상위 스코프의 this에 정적으로 바인딩된다.

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

local storage

(영구 느낌)

• 사용자 세선 데이터를 유지할 수 있다.
• 브라우저를 닫았다가 다시 열었을 때도 지속된다.
• 탭을 여러개 열어도 공유된다.
• 명시적으로 삭제될때까지 지속된다.
• 변경 사항은 저장되어 현재 및 향후 사이트 방문 시 사용 가능하다.

session storage

(반영구 느낌)

• 브라우저 세션 기간 동안만 사용할 수 있고, 탭이나 창을 닫을 때 삭제된다.
• 새로고침을 해도 유지된다.
• 변경된 사항은 현재 페이지에서 닫힐 때까지 저장되어 사용할 수 있다.
• 탭이 닫히면 저장된 데이터가 삭제된다.

cookie

• 개수와 용량에 있어 제한이 있다. 하나의 사이트에서 저장할 수 있는 최대 쿠키 수는 20개다.
• 매번 서버로 전송된다.
• 만료일자를 지정하게 되어있기 때문에 특정 기간(시간)이 되면 제거된다. 만료일자를 지정하지 않으면, 세션 쿠키가 된다.