inflearn logo
강의

Course
Instructor

Learning React A-Z by Following Along [Version 19 반영]

Listing to-do items using the Map method

this가 왜 쓰이는 건가요?

227

db20113073266

1 asked

1

this가 왜 쓰이는 건가요?

redux tdd react typescript Next.js

Answer 2

2

John Ahn

안녕하세요!!! 
리액트 클래스 컴포넌트 안에서 this 는 그 컴포넌트 자체를 가지고 있습니다. 

예를 들어서 

class App extends React.Component {

componentDidMount() {
this.aMethod();
}

aMethod() {
console.log("this", this);
};

render() {
return (
<div>
<h1>Class Component this</h1>
</div>
);
}
}

export default App;

이런 A 컴포넌트 안에 컴포넌트가 시작되자마자 aMethod를 호출하고 a 메소드 안에 콘솔로 this를 출력해보면 

console.log(this) 의 결과 
this, App {props: {…}, context: {…}, refs: {…}, updater: {…}, _reactInternals: FiberNode, …}

이런식으로 나오게 됩니다.  App이란 컴포넌트를 가르키게 됩니다. 
왜냐면 자동으로 this 와 App 컴포넌트가 자동으로 binding 되기 때문입니다. 

그렇기 때문에 aMethod가 App안에 있으니 App과 바인딩된 this.aMethod()이런식으로 사용하시면 됩니다.
감사합니다.

0

sunghoo782495

Line 27:9: Parsing error: Unexpected keyword 'this'. (27:9)

 

이런 오류가 나는데 이유가 멀까요

강의 소스 코드 압축 풀기 오류

0

89

1

런타임 에러 ㅠㅠ

0

105

1

강의대로 따라갔는데 에러보다 api키로 들어간 넷플릭스? 그런게 렌더링 되지 않습니다 ㅠ

0

114

1

안녕하세요 개발과 상관없는 질문입니다만

0

123

1

리액트 라우터 관련

0

117

1

react-beatiful-dnd에서 문제가 발생합니다.

0

108

1

react19에서는 react-beautiful-dnd가 설치되지 않습니다.

0

830

1

useEffect로 사용을 해도 되나요?

0

208

1

넷플릭스 오리지널 제외하고 슬라이드가 동작을 안합니다.

0

201

1

react 19의 useActionState가 더이상 isPending은 지원하지 않는 듯합니다

0

287

2

리액트 dockderfile 작성 시 COPY 질문

0

155

1

next.js에서부터는 react query 필요없는지

0

325

1

기능

0

203

1

오류가 안보여요

0

203

1

CSS

0

223

1

local storage

0

220

1

list컴포넌트 생성하기

0

228

1

검색어 입력 후 초기화하는 방법 궁금합니다!

0

340

1

Banner.css에 대해서

0

463

1

플러그인이 추천을 안해줍니다

0

331

1

마이너스버튼 테스트

0

283

2

리액트 서버 실행 오류

0

1167

2

오류메세지는 확인했는데 어떻게 고쳐야 할지 모르겠습니다 ㅠ

0

305

1

creactStore질문이요

1

292

2