inflearn logo
강의

Course

Instructor

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

Physical Object Movement

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

102

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

주니어 이력서 작성방법

0

19

2

Json 플러그인 사용시 variable collection 없음

0

14

1

배리어블 목록 없음

0

22

3

Token 등록 방법 문의

0

21

1

3강 질문

0

18

1

74. 데이터 캐시 - 1 (이론) 강의 영상 누락

0

27

1

2강 nodejs 3단계 설명 질문

0

33

1

imagesLoaded에 관한 질문

0

19

2

useEffect와 lifecycle문의

0

26

2

프론트엔드 학습 수준 문의

0

37

2

리액트 챕터별 코드에서 eslint 설정파일이 없어요

0

48

2

계단이 안내려가요

0

36

2

최근 코테, 과제 테스트 트렌드

0

68

2

노션 25 인터렉션 구현 파트 안 보입니다!

0

39

2

lucide react 아이콘 설치

0

46

2

17강 zustand store 서버에서 생성

1

36

1

문의관련 문의

0

44

2

next.js 를 2대이상 실행하는 경우 제공하는 cache 기능들은 어떻게 되나요?

0

56

2

76. 전문성 더하기: 놓치면 아쉬운 관련 기술들 수업 자료가 없어요.

0

48

2

음성 파일 두개가 들리네요

0

27

0

ai 도구 질문

0

31

1

Polyreduce 퍼센트 값이 적용되지 않음 + 다른 이슈

0

26

1

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

0

200

1

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

0

309

2