Javascript_기본지식 중 등속운동의 정지조건에 대한 간략한 논의

먼저 기존의 균일 모션 코드를 살펴보고, 속도를 수정하면 어떤 버그가 발생하는지 살펴보겠습니다. 테스트를 위해 여기에 두 개의 벤치마크가 추가되었습니다

코드 복사 코드는 다음과 같습니다.

그럼 왜 이런 일이 일어나는 걸까요?

실제로 목표 지점에 도달하면 목표 지점에 정확하게 도달할 수 없습니다. 목표 지점이 100이고 매번 7번 걷는다면 이때 목표 지점을 통과하거나 실패하게 됩니다. 통과하지 마세요.

절대 목표 지점에 도달하지 마세요. 사실 이전 버퍼와 조금 비슷합니다.

그렇다면 목표 지점에 도달했다는 것을 어떻게 계산하나요?

예: 택시를 타고 특정 장소로 ​​이동할 때 운전자가 현재 위치에서 10~20미터 정도 떨어진 곳에 정차해야 도착합니다. 그 자리에 차를 멈추라고 하는 것은 불가능합니다.

그래서 사실 과정은 똑같습니다. 물체와 목표지점 사이의 거리가 일정 수준에 가까우면 굳이 더 가까이 다가갈 필요도 없고 끝났다고 생각합니다.

수정된 코드를 살펴보겠습니다.

코드 복사 코드는 다음과 같습니다.

          var 시간 = null;

함수 startMove(iTarget) {
              var oDiv = document.getElementById("div1"); 클리어 간격(시간)

                time = setInterval(function() {
                    var 속도 = 0;
If (oDiv.offsetLeft 속도 = 7;
                     } else {
속도 = -7;
                 }
If (Math.abs(iTarget - oDiv.offsetLeft) >                                                        oDiv.style.left=iTarget 'px';
                     } else {
oDiv.style.left = oDiv.offsetLeft 속도 'px';
                 }
~                   }, 30)
            }
>

설명: 여기에서 절대값을 얻기 위해 Math.abs를 사용하는 이유는 무엇입니까?

이유는 간단합니다. 속도가 양수일 수도 있고 음수일 수도 있기 때문입니다.

이제 대상과 물체 사이의 거리를 7보다 작게 두겠습니다. 왜 7인가요? 왜냐하면 그의 다음 운동은 7보다 작을 것이기 때문입니다. 이때 우리는 그가 목표 지점에 도달한 것으로 간주할 것입니다.

그럼 또 문제가 나오네요. 이렇게 글을 쓰다보니 정확히 목표지점에서 멈추지 않더군요. 그래서 간단한 문장을 추가하고 바로 왼쪽을 목표점과 동일하게 만들었습니다. oDiv.style.left=iTarget 'px';

사실 지난번엔 7명도 채 안 남았는데, 프로그램이 너무 빨리 진행되고 사람의 눈에 안 보인다는 건 다들 아실 거예요. 따뜻한 미소

현재로서는 문제가 없을 것입니다. 윙크

등속운동의 정지조건입니다. 그러자 어떤 친구들은 완충 운동이 왜 그렇게 번거롭지 않느냐고 물었습니다.

그의 속도는 계속 변하고 점점 작아지기 때문에 결국 1에 도달하게 됩니다. 한걸음 한걸음 앞으로 나아가면 절대 그런 문제는 없을 것입니다.