🍴오늘 할 일
- 면접스터디
- 알고리즘 4문제
- 카카오맵 코드읽기
기술면접
this 가 동작하는 원리와 용법을 아는대로 설명해주세요. 평소 코드 중에서는 어떤 부분에서 가장 큰 차이가 생기나요?
this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가르키는 자기 참조 변수입니다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있습니다.
this는 자바스크립트 엔진에 의해 암묵적으로 생성되며 코드어디서든 참조할 수 있습니다. 함수를 호출하면 arguments객체와 this가 암묵적으로 함수 내부에 전달되는데 함수 내부에서 arguments객체를 지역 변수처럼 사용할 수 있는 것처럼 this도 지역변수 처럼 사용할 수 있습니다.
this는 함수가 호출되는 방식에 따라 this에 바인딩될 값, 즉 this 바인딩이 동적으로 결정됩니다.
코드에서 this를 사용하는 부분에서 호출하는 방법에 따라 가장 큰 차이가 생길 수 있습니다.
용법으로는 함수호출, 매서드 호출, 생성자 함수 호출, apply/call/bind 호출이 있습니다.
1. 함수호출의 this는 전역 객체를 가리키게 됩니다.
2. 메서드 호출은 해당 메소드를 소유한 객체에 바인딩 됩니다.
3. 생성자 함수 호출은 함수의 인자로 전달받은 값을 객체의 속성에 할당하기 위해 this 키워드를 사용합니다.
4. apply,call은 함수를 호출할때
bind는 this로 사용할 객체만 전달할 때 사용합니다.
또 다른 경우로는 콜백 함수를 사용할 때 this의 값이 달라지는 경우가 있습니다. 콜백 함수를 호출할 때 this를 바인딩하여 원하는 객체를 가리키도록 해주어야 합니다. 예를 들어, 이벤트 핸들러 함수 내부에서 this를 사용할 때는 이벤트 대상을 가리키므로, 이벤트 대상이 아닌 다른 객체를 가리키도록 하려면 명시적으로 this를 바인딩해주어야 합니다.
완벽하게 같은 함수라도 어떤 실행환경 어떤 객체에의해서 호출되느냐에 따라서 this의 의미가 달라진다.
자바스크립트에서 모든함수는 this를 가지고있다. 그리고 함수가 호출되면 그때그때 함수에 따라 this가 가르키는 객체가 결정된다.
this가 호출될 때 마다 this가 동적으로 결정되는 것을 this 바인딩이라고 한다.
브라우저 저장소에 대해서 차이점을 설명해주세요(local storage, session storage, cookie)
쿠키는 클라이언트 측에서 작동하는 저장소입니다. 주로 사용자의 로그인 정보, 쇼핑 카트, 사용자 맞춤 설정 등을 저장하기 위해 사용됩니다. 쿠키는 브라우저가 서버에 요청할 때 자동으로 전송되기 때문에, 서버 측에서도 쿠키를 읽을 수 있습니다. 유효 기간을 설정하여 데이터를 일정 기간 동안 유지할 수 있습니다. 쿠키는 최대 4KB의 용량 제한이 있습니다.
웹 스토리지는 HTML5에서 추가된 클라이언트 측 저장소입니다. 로컬 스토리지(Local Storage)와 세션 스토리지(Session Storage) 두 가지 종류가 있습니다.
로컬 스토리지는 브라우저에 데이터를 저장하여, 브라우저가 종료되어도 데이터가 유지됩니다. 저장된 데이터는 문자열 형태로 저장됩니다.
세션 스토리지는 브라우저 세션이 유지되는 동안에만 데이터가 유지됩니다.
각각 최대 5MB의 용량 제한이 있습니다.
