내일배움캠프 4기 React 31일차(OX 퀴즈, React)

최영진·2022년 12월 12일
0

1. OX 퀴즈

eval 함수를 통해 쉽게 가능했지만 검색을 통해 지양해야 하는 함수란 걸 알았다.

map 과 split 을 통해 문제를 해결 하였다.

function solution(quiz) {
  var answer = [];
  answer = quiz.map((quiz) => {
    if (quiz.split(" = ")[0].includes(" - ")) {
      let a = String(
        quiz.split(" = ")[0].split(" - ").map(Number)[0] -
          quiz.split(" = ")[0].split(" - ").map(Number)[1]
      );
      let b = quiz.split(" = ")[1];
      return a === b ? "O" : "X";
    } else if (quiz.split(" = ")[0].includes("+")) {
      let a = String(
        quiz.split(" = ")[0].split(" + ").map(Number)[0] +
          quiz.split(" = ")[0].split(" + ").map(Number)[1]
      );
      let b = quiz.split(" = ")[1];
      return a === b ? "O" : "X";
    }
  });

  return answer;
}

quiz 를 ' = ' 으로 먼저 분리해주고 -, + 를 확인하여 계산후 비교한다.
주의할 점은
.includes 를 사용하여 - 가 포함 되어있는지 확인할 때 " - " 이처럼 - 양쪽에 띄어쓰기를 미포함하면 음수값도 있기 때문에 + 에 있는 음수값이 검출 될 수 있음.

2. redux todo 완료.

react-router-dom 을 사용하여 main 페이지와 sub 페이지 분리를 한 후
sub 페이지에 todo 정보를 줘야 했다.

sub페이지로 넘어가는 버튼에 readTodo 함수를 추가하여
click 되는 target의 Todo 를 todo 에 저장하여 보내주고
userSelector 를 통해 state 의 todo 를 가져와서 데이터를 뽑아 썻다.

id 고유한 번호를 주기 위해 new Date() 를 사용하여 시간을 주었는데
이것을 문자로 표출하기 위해 String 을 이용하여 문자열로 변환해 주었다.

profile
안녕하시오.

2개의 댓글

comment-user-thumbnail
2022년 12월 12일

꿀팁! > 벨로그에서 코드 칠 때 ``` 옆에 ```javascript 이렇게 치면 javascript 문법으로 하이라이팅 됩니다~

1개의 답글