inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

TS/JS 디자인 패턴 with Canvas: 제로초에게 제대로 배우기

상태(State) - 현재 그림판의 모드 정하기(if문 중복 제거법1)

[공유] State 패턴 강의 최종본 커밋에서 누락된 부분이 존재

114

log

작성한 질문수 9

1

git commit 으로 공유된 State 패턴 완성본 커밋 에서 강의 마지막 부분 (23:50) 과 달라서 해당 부분을 사용하시는 분들은 정상으로 동작하지 않을 수 있습니다.

그래서 해당 공유합니다.

export class ChromeGrimpanMenu extends GrimpanMenu {
    onClickPen() {
    const command = new PenSelectCommand(this.grimpan);
    this.executeCommand(command); // { name: 'pen' };
    // this.grimpan.setMode('pen'); // 변경, 해당 부분은 강의에도 나와있지는 않지만 pen 모드일때 변경이안되어서 자체적으로 추가함
    this.grimpan.history.stack.push(command);
  }

  onClickEraser() {
    // this.executeCommand(new EraserSelectCommand(this.grimpan)); // { name: 'eraser' }; // 기존
    this.grimpan.setMode('eraser'); // 변경
  }

  onClickCircle() {
    // this.executeCommand(new CircleSelectCommand(this.grimpan)); // { name: 'eraser' };
    this.grimpan.setMode('circle'); // 변경
  }

  onClickRectangle() {
    // this.executeCommand(new RectangleSelectCommand(this.grimpan)); // { name: 'eraser' };
    this.grimpan.setMode('rectangle'); // 변경
  }

  onClickPipette() {
    // this.executeCommand(new PipetteSelectCommand(this.grimpan)); // { name: 'eraser' };
    this.grimpan.setMode('pipette'); // 변경
  }

 

javascript typescript 객체지향 디자인-패턴 canvas

답변 2

0

제로초(조현영)

감사합니다!!

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다.

log님, 질문해주셔서 감사합니다. 여러분들이 강의를 들으시면서 경험했던 문제를 공유해주시는 것은 많은 수강생들에게 큰 도움이 됩니다. 공유해주신 코드와 설명을 통해, 강의의 특정 부분에서 발생 가능한 문제와 그 해결 방법을 제시해주셨군요. 감사합니다.

말씀하신 대로, ChromeGrimpanMenu 클래스의 클릭 이벤트 핸들러(onClickPen, onClickEraser, onClickCircle, onClickRectangle, onClickPipette)에서 this.executeCommand() 함수를 사용하지 않고, 직접 setMode()를 호출하는 방법을 소개해주셨습니다. 이는 특정 모드가 바뀌지 않는 문제를 해결하려는 목적으로 보입니다.

이 부분은 강의에서 언급되지 않을 수도 있지만, 직접 문제를 찾아 해결해 나가는 과정 또한 학습에 있어서 중요한 부분입니다. 앞으로도 계속해서 다른 수강생들과 유용한 정보를 공유해주시면 감사하겠습니다.

해당 강의의 다른 수강생들과 문제를 공유하고 자유롭게 의견을 나누고 싶다면, 강의 질문 게시판에 추가적인 정보를 남겨주시면 좋을 것 같습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

호출횟수 질문입니다.

1

10

2

실행과정 질문입니다.

2

12

1

state 객체로 묶기

0

15

0

핸드북 light/dark mode 관련 이슈가 있는 것 같습니다.

0

18

1

UserDataManager 클래스 hasSaveError 처리

0

23

2

제공해주신 자료에 스크립트들이 빠져있습니다

0

22

2

풀라우트캐시 동작 원리에서 데이터 캐시 관련 질문

0

29

2

next.js 프로젝트

0

33

1

몽고 db 접속 오류

0

18

1

명시적 타입 선언(콜론 타입 선언)과 as 타입 단언 차이

0

26

2

undo 구현

0

65

1

[프론트엔드 문서화 관련 질문]

0

72

1

커맨드 패턴 적용

0

112

1

type/interface 정의 파일분리

0

99

2

팩토리 패턴

0

125

2

강결합

1

134

2

React 환경에서 클래스형 디자인 패턴 활용에 관한 질문

0

201

2

질문 있습니다.

0

142

2

팩토리 메서드에 대해서 궁금증이 생겨서 질문드려봅니다!

0

214

2

.

0

105

1

[섹션1/사전에 알아두면 좋은 TS/JS 지식]영상 재생 관련 질문 드립니다.

0

173

2

[12강] 선언식 + bind vs arrow function 어떤거 선호하시나요?

0

199

2

싱글톤 강의

1

309

2

리스코프 치환원칙은 반,공변성과 같은 원리인가요?

0

215

1