[스터디] 5주차 자바스크립 (모던 자바스크립트 deep dive)

this

질문 1. this가 JavaScript에서 어떻게 작동하는지 설명하세요.

• this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수이다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있습니다.
• this 바인딩(this가 가리키는 값)은 함수 호출 방식에 의해 동적으로 결정됩니다.

질문 2. this 바인딩이 동적으로 결정된다고 하는데 어떠한 경우에 발생하는지 설명하세요. (꼬리 질문)

• 코드 실행 시점에서 this는 동적으로 결정되면 상황에 따라 달라집니다.
  1. 전역에서 this는 전역 객체 window를 가리킵니다.
  2. 일반 함수 내부에서 this는 전역 객체 window를 가리킵니다.
  3. 메서드 내부에서 this는 메서드를 호출한 객체를 가리킵니다.
  4. 생성자 함수 내부에서 this는 생성자 함수가 인스턴스를 가리킵니다.

질문 3. 일반 함수와 화살표 함수에서 this가 어떻게 동작하나요?

• 일반 함수 내부에서 this는 window가 바인딩(가리키는 값) 되고, 화살표 함수는 this를 바인딩하지 않기 때문에 상위의 this를 참조합니다.

질문 4. 내부 함수의 this가 전역객체를 참조하지 않도록 하려면 어떻게 하면 될까요?

1. 내부 함수 바로 상위에 this를 변수로 재선언합니다.
2. this를 명시적 바인딩할 수 있는 call,bind,apply메서드를 사용합니다.
3. 화살표 함수를 사용하여 상위 this를 가리키게 한다.

질문 5. 각 함수 호출방식에 따라 바인딩되는 대상에 대해서 설명하세요.

1. 일반 함수 호출에서의 this는 전역 객체가 바인딩 됩니다.
2. 메서드 호출에서의 this는 메서드를 호출한 객체를 바인딩 됩니다.
3. 생성자 함수의 호출에서의 this는 생성자 함수가 생성할 인스턴스를 바인딩 됩니다.
4. apply, call, bind 메서드에 의한 간접 호출에서의 this는 메서드에 첫전째 인수로 전달한 객체를 바인딩됩니다
   • apply메서드는 호출할 함수의 인수를 배열로 묶어 전달합니다.
   • call메서드는 호출할 함수의 인수를 쉼표로 구분한 리스트 형식으로 전달합니다.
   • bind 메서드는 call과 비슷하지만 즉시 호출하지는 않고 넘겨받은 this 및 인수들을 바탕으로 새로운 함수를 반환하기만 하는 메서드입니다.
     • call은 즉시호출, bind는 나중 호출한다.