js에서 this 키워드는 흥미로운 내용이지만 그 방향이 초보자에게 혼란을 주는 경우가 많습니다.
사실 이 키워드를 이해하려면 "메서드 호출과 메소드 트리거링"이라는 두 가지 문제를 명확히 해야 합니다.
이제 코드를 살펴보겠습니다
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>function</title> <script> function showThis(){ console.info(this); } function Test1(){ this.f=showThis; } function Test2(){ this.f=function(){ showThis(); } } showThis();//window new Test1().f();//Test1 new Test2().f();//window </script> </head> <body> </body> </html>
20행은 이해하기 쉬운 윈도우 객체를 출력하지만, 21행은 Test1의 인스턴스 객체를 출력하고, 22행은 윈도우 객체를 출력합니다. Test1과 Test2의 구성을 살펴보면 f 메소드가 결국 showThis 메소드를 실행한다는 것을 알 수 있습니다. 하지만 쇼의 이 지점은 다릅니다. 이는 Test1의 f 메소드가 showThis를 직접 가리키고, new Test1().f()가 Test1의 인스턴스로 showThis 메소드를 직접 호출하고, 호출자가 Test1의 인스턴스이기 때문입니다. 그리고 new Test2().f()는 Test2의 인스턴스 메서드 f에서 창 개체의 showThis 메서드를 트리거합니다. 여기서 이 메서드는 트리거러 Test2의 인스턴스가 아닌 호출자 창을 가리킵니다.
지금 만나보실 수 있습니다. 이는 호출자를 가리키며 트리거는 호출자를 푸시하여 지정된 메서드를 실행합니다.