setTimeout은 비동기다

setTimeout(this.step, this.timeBetweenSteps);

위와 같이 작성했는데 잘 안 되었다. this가 Window를 가르키고 있었다. setTimeout은 비동기이기 때문에 this를 쓸 때에는 bind로 묶어 줘야 한다는 것을 배웠다.

setTimeout(this.step.bind(this), this.timeBetweenSteps);

css position 속성

span 태그들끼리 서로 떨어뜨리고 싶은데 자꾸 한곳에 겹치는 상황이 생겼다. inline-block 때문도 아니었고 flex 때문도 아니었다. position 이라는 속성이 absolute 였기 때문이었다. absolute는 가장 가까운 부모 요소에 가깝게만 배치되면 되는 거였기 때문에 span 태그의 요소들 모두 한곳에 모인 것이었다. position 속성을 relative로 변경하고 고칠 수 있었다.

position:absolute; --> position: relative;