WEB/JavaScript

[JavaScript] Method, this

bay07 2024. 4. 18. 09:50

Method & this 사용예시

▶ Method 

객체 속성에 정의된 함수 

object.method() 방식으로 호출된다 
매서드는 객체를 '행동'할 수 있게 한다 

 

▶ this

함수나 매서드를 호출한 객체를 가리키는 키워드 

this 키워드를 사용해서, 객체에 대한 특정한 작업을 수행할 수 있다 

함수 내에서 객체의 속성 및 매서드에 접근하기 위해 사용한다 

 

자바스크립트에서 this는 함수를 "★★호출하는 방법★★"에 따라 

가리키는 대상이 다르다 

단순 호출 시 this 매서드 호출 시 this 
가리키는 대상 => 전역 전체  가리키는 대상 => 매서드를 호출한 객체 

  중첩된 함수에서 this의 문제점과 해결책 

forEach의 인자로 작성된 함수는 
일반적인 함수 호출이기 때문에 
this가 전역 객체를 가리킨다
화살표 함수는 자신만의 this를 가지지 않기 때문에 
외부 함수 (myFunc)에서의 this 값을 가져온다 

 


▶ 자바스크립트 this 정리 


JavaScript의 함수는 호출될 때 this를 암묵적으로 전달 받는다
JavaScript에서 this는 함수가 "호출되는 방식"에 따라 결정되는 현재 객체를 나타낸다 

Python의 self와 Java의 this : 선언 시 이미 값이 정해진다
JavaScript의 this : 함수가 호출되기 전까지 값이 할당되지 않고, 호출 시에 결정된다 (동적 할당)

동적할당의 장단점 
장점 : 함수(매서드)를 하나만 만들어 여러 객체에서 재사용할 수 있다 
단점 : 이런 유연함 때문에 실수를 할 수 있다. 

→ 개발자는 this의 동작 방식을 충분히 이해하고, 장점을 취하면서 
실수를 피하는 데 집중해야한다. 

'WEB > JavaScript' 카테고리의 다른 글

[JavaScript] 추가 객체 문법 ②  (0) 2024.04.18
[JavaScript] 추가 객체 문법 ①  (0) 2024.04.18
[JavaScript] 객체  (0) 2024.04.18
[JavaScript] 화살표 함수  (0) 2024.04.18
[JavaScript] Spread syntax  (0) 2024.04.18