Day 17 - Sort Without Articles
이번 과제는 문자열로 구성된 배열을 정렬하는 과제이다. 문제는 그냥 정렬이 아니라 앞에 관사를 제외하고 정렬하여 <li>
객체를 넣어주어야 한다.
strip() 함수 만들기
strip()
메소드는 자바스크립트에서 지원하는 기능이 아니다. 직접 정의하는 이 함수는 regex를 사용하여 관사 a
an
the
를 제거하고, 문자열에 사용할 수 있는 기본 메소드인 trim()
을 사용하여 앞, 뒤 공백을 제거한 후 반환한다.
1 | function strip(band) { |
이제 이 함수로 bands
배열을 정렬한 새로운 sortedBands
배열을 만들 것이다.
sort() 사용하기
기본 내장된 sort()
메소드를 사용한다. 위에서 작성한 strip()
메소드에 정렬할 인자를 각각 넣어서 정렬한다.
1 | const sortedBands = bands.sort((a, b) => (strip(a) > strip(b) ? 1 : -1)); |
map, join 사용하기
이제 적절한 위치에 정렬한 sortedBand
요소를 각각 <li>
객체로 매핑하여 innerHTML
에 넣어주면 된다.
1 | bandsList.innerHTML = sortedBands.map((band) => `<li>${band}</li>`).join(""); |
join('')
을 마지막에 사용하지 않으면 ,
가 들어간 이상한 리스트가 출력될 것이다. innerHTML
에 태그들을 매핑하여 넣을 때는 외우다싶이 마지막에 join()
메소드를 사용하자.
Full Script
1 | const bands = [ |
regex 사용은 여전히 어려운 것 같다. 외우려고 하기 보다는 필요할 때 찾아서 쓰고, 기본적인 틀 정도만 상기시켜야겠다. 이제 13개밖에 남지 않았다!