본문 바로가기

JAVASCRIPT

this

this는 함수 내에서 함수 호출 맥락(contex) 어떠한 의미가 고정되어 있지않고 상황에 따라 다릅니다. this는 자바스크립트 함수 안에서 사용되는것입니다.

 

function func() {
	if(window ===this){
   		console.log("window===this");
   }
}

func();

window===this

 

 

이함수에서 this라는 변수에 담긴 값이 window라는 전역 객체라는 것을 보여주고 있습니다.

 

 

 

메소드를 호출했을 때 

 

객체의 소속인 메소드의 this는 그 객체를 가르킨다.

 

let o = {
    func : function(){
        if(o === this){
            document.write("o === this");
        }
    }
}
o.func(); 

 

결과는 0===this

 

우리는 여기서 어떤 사실을 알수 있냐면 

 

메소드가 소속되어 있는 객체를 this로 접근할수 있습니다.

 

 

첫번째 예제는 fuc()를 호출하면 window===this  

두번째 예제는 o.func() 호출하면 window===this

 

그냥 fuc.() window.func() 이다 window전역객체의 메소드함수인데 window가 생략되어있다.

 

 

 

생성자 안에서의 this 

 

let funcThis = null; 
 
function Func(){
    funcThis = this;
}
let o1 = Func();
if(funcThis === window){
    document.write('window <br />');
}
 
let o2 = new Func();
if(funcThis === o2){
    document.write('o2 <br />');
}

 

 

let o1 = Func(); 를 실행하게 되면 function Func(){
    funcThis = this;  이게 실행이 되겠죠
}

 

functhis=this는 let 이 안붙여 있기에

 

전역변수  let funcThis = null;  세팅이 됩니다.

 

즉   funcThis ===window가됩니다.

 

 

자 2번째

let o2 = new Func(); 호출하게 되면 자바스크립트는 비어있는 객체를 만들게 되고

 

그 비어있는 객체가 그생성자 안에서 this가 됩니다.

 

let o2 = new Func(); 실행하면 

 

 

  funcThis = this; 이것이  let funcThis = null;  이렇게 됩니다. 다시 이것을 funcThis === o2 가져오면 

출력이 됩니다. 

 

 

 

 

생활코딩을 참고 해서 포스팅을 하였습니다. egoing님 감사합니다.

'JAVASCRIPT' 카테고리의 다른 글

apoly, call 과 this  (0) 2020.11.05
this 객체로서의 함수  (0) 2020.11.05
생성자와 new 객체지향  (0) 2020.11.04
함수 호출  (0) 2020.11.04
매개변수의 수  (0) 2020.11.03