[Javascript] 검색 필터 : ❶대소문자 구분없이 ❷검색어 일부만 포함

1. 대소문자 구분없이 -> 검색 되도록

: filter() 메서드 + toLowerCase() /혹은 toUpperCase()

//최종 코드//

//값에 접근
let searchInput = document.querySelector("#searchInput").value;

//filter
let filteredMovies = movies.filter((movie) => {
	return movie.title.toLowerCase().includes(searchInput.toLowerCase())
})

-> 일단 이 코드에서는 === 은 안들어간다.

 

🤔내가 하고 싶었던건 : html의 form - input요소(#searchInput)에 접근 -> 사용자 입력값을 가져옴 -> 거기에 filter로 조건 걸어서 -> 내보내는 것

❓헷갈렸던건 : ❶string인데 ===인지 ==인지? ❷''을 안써도 되는지?

->아래 코드에서도 볼 수 있듯이, 그냥 '' 안쓰고 ===으로 해도 되었다. 그런데 정확한건지는 잘 모르겠다.🤚🏻

//사용자 입력값을 value로 가져온다.
let searchInput = document.querySelector("#searchInput").value;

//서로 같으면 return한다.
let filteredMovies = movies.filter((movie) => {
	return movie.title.toLowerCase() === searchInput.toLowerCase()
}

 

2. 검색어 일부만으로도 -> 검색 되도록

: includes() 메서드

->인자로 전달된 문자열이, 비교 문자열 안에 존재한다면, true를 리턴한다.

-> https://umanking.github.io/2022/07/17/javascript-string-example/ 블로그 참고했을 때는 1)string.indexOf(), 2)string.includes, 3)string.startsWith()나 string.endsWith() 의 방법으로 문자열 포함여부를 알 수 있다고 했다. 일단 과제에서는 includes()메서드를 썼더니 해결이 되었다.