모던 자바스크립트) whf is this?

 

 

 

 

this는 상황에 따라 달라진다. 

1. 전역 문맥에서는 세상 전체(전역 객체)를 가리킴.
2. 객체 내부 메서드에서는 그 객체를 가리킴.
3. 일반 함수는 호출하는 방식에 따라 this가 달라짐.
4. 화살표 함수는 상위 스코프의 this를 그대로 물려받음.

 

 

일반 함수는 호출하는 방식에 따라 this가 달라짐.

- 일반함수는 widonw의 지역 함수다.

window에 저장된 main함수!

function main() {
	console.log(this);
}

main(); //window객체 뱉음 (window.main과 같다.)

 

 

- 일반 함수에서 this는 함수가 어디에 선언되었든 상관 없이 this의 값은 함수를 호출한 객체를 가리키게 된다.

function main() {
	console.log(this);
}

const object = {
	name: '큰별',
    main: main,
};

const object2 = {
	name: '작은별',
    main: main,
};

const main3 = object2.main;

object.main();  //{name: '별코딩', main: f} mian을 호출한 객체는 main이다.
object2.main(); //{name: '작은별', main: f} maind을 호출한 객체는 main2다.
main3(); // Window 객체 , window.main2()와 같으므로!

 

 

화살표 함수는 상위 스코프의 this를 그대로 물려받음.

const object = {
	name: '큰별',
    main: function () {
    	console.log(this);
    },
    mainArrow: () => {
    	console.log(this);
    },
};

const object2 = {
	name: '작은별',
    mainArrow: object.mainArrow,
};

object.mainArrrow(); //window객체, 상위스코프 object물려받아서, 전역객체 호출
object2.mainArrow(); //widnow객체, 상위스코프 object2물려받아서, 전역객체 호출

 

 

 

✅ 이어지는 글

2025.01.07 - [분류 전체보기] - 모던 자바스크립트) 화살표함수와 this