객체지향 - this

this

  • 함수 내에서 함수 호출 맥락(context)를 의미
  • 함수를 어떻게 호출하느냐에 따라서 this가 가리키는 대상은 달라짐
  • 함수와 객체의 관계과 느슨한 자바스크립트에서 this는 둘을 연결시켜주는 실질적인 연결점의 역할
//함수 호출
function func() {
	if(window === this) {
    	console.log("window === this");
    }
}
func();			//결과 : window === this


//메소드 호출
let a = {
	func : function () {
    	if (a === this) {
        	console.log("a === this");
        }
    }
}
a.func();		//결과 : a === this


//생성자 호출
let funcThis = null;

function Func() {
	funcThis = this;
}

let a1 = Func();
if(funcThis === window) {
	console.log('window');		//결과 : window
}
let a2 = new Func();
if(funcThis === a2) {
	console.log('a2');			//결과 : a2
}

//**생성자는 빈 객체를 만듦 -> 객체 내에서 this는 만들어진 객체를 가르킴**
function Func() {
	console.log(a);
}
let a = new Func(); 			//결과 : undefined

apply, call

  • 함수의 메소드인 apply와 call을 이용하면 this의 값을 제어할 수 있음
let a = {}
let b = {}
function func() {
	switch(this) {
    	case a :
        	console.log('a');
            break;
        case b :
        	console.log('b');
            break;
        case window : 
        	console.log('window');
            break;
    }
}
func();					//결과 : window
func.apply(a);			//결과 : a
func.apply(b);			//결과 : b

.
.
.
.
Reference

https://opentutorials.org/course/743/6571

좋은 웹페이지 즐겨찾기