[TIL_영화사이트개발_트러블슈팅(5)] 1/14 대소문자 구분 없이 검색 결과 처리하기

개인 과제에서 검색 기능 구현 중 이런 조건이 있었다

내가 화면에 보여주는 값은 한국어이지만, 영어로 검색해도 + 대소문자 구분하지 않아도! 보여줘야 하는 것!

고민하다 전부 대문자로 바꾸자 라는 결론을 내렸다

 

들어온 input의 길이가 0 이상이라면(이 조건을 넣으면서 아무 값이 안 나왔을 때는 검색 결과가 없다는 알림창을 띄워줬다)

전부 대문자로 바꾼다

이후 input으로 보여줄 영화 리스트를 만드는 함수에서는 필터를 사용해 기존 리스트에 있는 original_title도 대문자로 바꿨고,

둘의 값이 같다면 새 배열에 넣어주었다

그 결과 rInG로 검색해도 반지의 제왕이 화면에 나오게 된다

 

아직 실시간으로 필터링 되게 구현은 하지 못했다

일단 저 화면에서 영화를 클릭했을 때 상세페이지가 뜨는걸 먼저 하고 저건 추가로 할 생각이다

 

js에서 기본으로 제공하는 다양한 메서드들이 있는데 그걸 모르면 사용할 수 없다

for으로 직접 하는걸 map이나 filter로 간단하고 직관적이게 사용하는 것처럼,,

다양한 메서드들을 익히고 원하는대로 자유롭게 쓸 수 있을 때까지 연습을 많이 해야겠다