물에 살고싶은 개발자

[React-Native] 'function' is not a function 문제 본문

React-Native

[React-Native] 'function' is not a function 문제

돼지사랑 2019. 9. 10. 13:30

이번에는 정말 기초적인 원인으로 인해 날 괴롭혔던 is not a function 에 대한 글이다.


분명 오타도 없고 제대로 실행될거같은데, 생기는 경우에 이 글을 참고해보자. 


범위(scope) 문제다. 너무나도 잘알고 있고 익숙하지만 그래서 간과한 원인인셈이다.



아래와 같은 코드가 있다고 치자

_set = () => {
    setTimeout(() => {
      this._goTo();
    }, 4000);
  };


여기서 4초 후 _goTo() 를 실행하면 _goTo is not a function 이 등장한다.

method 호출뿐만 아니라 state나 props 등 다 안된다.

(정확한 원인은 모르겠는데 

이유는 간단하다. _set() 안에서 호출하는건 정상적으로 되지만 저 setTimeout 안에는 별개의 범위로 인식되기 때문이다.

그러므로 아래처럼 변경해주면 된다.

_set = () => {
    self = this;
    setTimeout(() => {
      self._goTo();
    }, 4000);
  };


아 참고로 self를 써도 state나 prop이 안되는건 마찬가지니까 별개의 Method를 호출하고 그 안에서 해결하는수밖에 없다.



Comments