this 와 바인딩

🔥this 란?

• 일반적인 프로그래밍 언어에서의 this는 자기 자신을 가리키는 참조변수이지만, javascript에서의 this는 함수 호출 방식에 따라 this가 결정됩니다. javascript에서 함수가 호출될 떄 기존 매개변수로 전달되는 인자 값에 대해 arguments 객체와 this인자가 함수 내부로 암묵적으로 전달됩니다.

함수 호출에 따른 this

1. 함수 호출시 this: 전역 객체
   • 함수는 전역객체의 메소드로써 메소드 호출 시와 동시에 전역객체인 메소드 객체를 this로 갖습니다.

2. 메소드 호출시 this: 메소드 객체
   • 프로토타입 객체도 메소드를 가질 수 있습니다. 프로토타입 객체도 일반적인 메소드의 this 바인딩 규칙을 따릅니다.

3. 내부함수 호출 시 this: window
   • 내부함수 호출시 this는 전역객체에 바인딩이 됩니다.
   • 일반함수, 메소드, 콜백함수에 관계없이 해당 함수 내에 내부함수는 전역객체에 바인딩 됩니다.

4. 엄격모드에서의 this : undefind
   • 엄격모드는 코드 안정성과 오류 검증을 위해서 나온것입니다.
   • 엄격모드에서 함수 실행 시 this는 undefiend가 됩니다.
   • 의도치 않게 전역객체에 바인딩된 this를 사용하는 것을 막을 수 있습니다.

5. 이벤트 리스너 호출 시 this: 이벤트 객체
   • 이벤트 리스너에서의 this는 이벤트를 발생시킨 객체가 됩니다.

6. 생성자 함수 호출시 this: 생성된 새 객체
   • 객체를 생성한다. 기존 함수에 new를 붙여서 호출하면 생성자 함수로 동작합니다.

7. 화살표 함수 호출 시 this: 함수 선언 시의 상위 스코프의 this

   • 화살표함수는 함수를 선언할 때 this에 바인딩될 객체가 정적으로 결정됩니다.

   -화살표함수의 this는 언제나 상위 스코프의 this를 가리킵니다.

---

정리

• this는 전역공간에서는 전역 객체를 참조합니다.

• 어떤 함수를 메소드로써 호출할 경우 this는 그 메서드의 호출 주체를 참조합니다.

• 함수로써 호출 할 경우 this는 전역 객체를 참조합니다.

• 생성자 함수에서의 this는 생성될 인스턴스를 참조합니다.

• call,applly 메서드를 활용하면 this를 명시적으로 지정이 가능하며, 함수 또는 메서드를 호출합니다.

• bind 메서드를 활용하면 this 및 함수에 넘길 인자를 일부를 지정한 새로운 함수를 리턴시켜줍니다.