inflearn logo
강의

Course

Instructor

Creating a First-Person 3D Website with Three.js

Physical Object Movement

desk 가 밑으로 떨어졌을 때, "y 값이 문자열"에 대한 내용입니다.

111

blackstarzck1824

3 asked

0

우선 원인은...

MeshObject 클래스 속성 중 differenceY 의 값에 OR 연산자를 사용., main.js 에서 ground 변수에 '0' 문자열 값을 할당해서 그런데요.

ground 는 y 속성값을 할당하지 않았기 때문에 MeshObject 클래스에서 info.y 는 undefined 이고, this.y 는 "this.height / 2 + this.differenceY" 의 계산이 적용되서 " 0.1 / 2 + '0' " 즉, 문자열 '0.20' 이 출력됩니다.

산술 연산자 '+' 가 들어가게되면, 그 계산식의 결과값은 반드시 문자열이 나옵니다.

x, y, z, differenceY 는 모두 좌표와 연관된 값으로, 모두 숫자 데이터 타입을 할당받아야 하는 일관성이 필요한데 ground, floor 에서만 differenceY 가 문자열을 받아 발생한 이슈입니다.

강의를 들어보던 중 강사님께서 처음에 숫자 0 을 사용하셨고, this.differenceY 속성에 값을 할당할때 OR 연산자를 쓰심으로인해 숫자 0 이 null/undefined 로 인식되는 것 때문에 문자열로 바꾸신거 같더라구요.

조금 더 정확하게 하자면, OR 연산자가 아닌 ?? 연산자를 사용해 숫자 0을 값 그대로 사용할 수 있도록 바꾸고 ground 에도 문자열 '0' 이 아닌 숫자 0 을 넣어주면 될것같습니다.

x, y, z 에 곱하기 1을 하는 추가코드는 필요없어집니다.

 

javascript 인터랙티브-웹 포트폴리오 three.js 3d

Answer 0

counter01.html은 어디있을까요?

1

8

1

블렌드 커브 선 꼬임 문제

0

16

2

존재하지 않는 일기 url입력 시 alert이 두 번 떠요

0

24

1

useState 직접 구현 부분에서 질문이 있습니다.

1

29

1

학습을 하고 블로그에 정리를 해도 괜찮을까요?

1

31

1

안녕하세요, Oracle Cloud Free Tier 가입 과정에서 계속 오류가 발생해 문의드립니다.

1

31

2

교재(3쇄)와 강의 내용 문의

0

31

2

회사마다의 JD 자격 요건에 대해서는 어떻게 접근해야 좋나요?

0

33

2

커브 부분만 납작해지는 이유

0

28

2

섹션2번 부분 강의 화면이 잘 못된것 같아서 문의합니다.

0

23

1

call stack 표현이 잘못표현된것이 아닌가요?

0

68

2

강의 자료 위치

1

45

1

figma 파일을 받을 수가 없어요

0

48

1

React 와 Virtual DOM 의 이야기 영상 실행이 안됩니다.

0

34

1

다운로드 연결이 되지 않을 때는 어떻게 해야할까요?

0

37

1

우드 탁상시계(2) 네트워크 서피스 2분 27초 질문 있습니다.

0

39

2

커서, 클로드, 피그마는 모두 유료버전을 사용해야하나요?

0

59

1

일반 강의와 차이점?

1

53

1

카카오 친구 확인 방법

0

25

0

수강완료 후 문의 드립니다.

1

47

2

!= 연산자의 역할

0

35

1

중요하진 않지만 설명하신부분에서 안된부분..

1

37

1

개발자도구에서 모바일 버전으로 테스트할때

0

239

1

반발력을 0으로 해도 계속 튕겨져나갑니다..ㅜ

0

321

2