[React] filter함수

앞에서 map함수로 더미데이터를 가져와 화면에 특정부분만 뿌리는 걸 살펴봤다.
이번엔

{
    "days":[
        {"id":1, "day":1},
        {"id":2, "day":2},
        {"id":3, "day":3}
    ],

    "words":[

        {
            "id":1,
            "day":1,
            "eng":"book",
            "kor":"책",
            "isDone":false
        },
        {
            "id":2,
            "day":1,
            "eng":"car",
            "kor":"차",
            "isDone":false
        },
        {
            "id":3,
            "day":3,
            "eng":"pen",
            "kor":"펜",
            "isDone":false
        },
        {
            "id":4,
            "day":2,
            "eng":"school",
            "kor":"학교",
            "isDone":false
        },
        {
            "id":5,
            "day":3,
            "eng":"pencil",
            "kor":"연필",
            "isDone":false
        },
        {
            "id":6,
            "day":1,
            "eng":"eraser",
            "kor":"지우개",
            "isDone":false
        }

    ]

}

위 데이터에서 day 1에 해당하는 단어만 나오게 출력해보자.

그럼 filter 함수로 필터링을 거쳐야겠지?

1.우선 day가 1인 것만 나오도록 해야한다.

const day=1;
const wordList = dummy.words.filter(word=>(
  word.day === 1
))

2. 테이블 형태로 word가 나오게하자.

return(
  <>
  <table>
     <tbody>
       {wordList.map(word=>(
         <tr>
           <td>{word.eng}</td>
           <td>{word.kor}></td>
        </tr>
 ))}
      </tbody>
 </table>
 </>
  )

그럼 이렇게 day1에 해당하는 단어인 book,car,eraser가 출력된다!