1. 프로그래머스 완주하지 못한 선수
문제 설명
수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다.
마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요.
제한사항
- 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다.
- completion의 길이는 participant의 길이보다 1 작습니다.
- 참가자의 이름은 1개 이상 20개 이하의 알파벳 소문자로 이루어져 있습니다.
- 참가자 중에는 동명이인이 있을 수 있습니다.
입출력 예
| participant | completion | return |
|---|---|---|
| ["leo", "kiki", "eden"] | ["eden", "kiki"] | "leo" |
| ["marina", "josipa", "nikola", "vinko", "filipa"] | ["marina", "josipa", "nikola", "filipa"] | "vinko" |
| ["mislav", "stanko", "mislav", "ana"] | ["stanko", "mislav", "ana"] | "mislav" |
입출력 예 설명
-
예제 #1
"leo"는 참여자 명단에는 있지만, 완주자 명단에는 없기 때문에 완주하지 못했습니다. -
예제 #2
"vinko"는 참여자 명단에는 있지만, 완주자 명단에는 없기 때문에 완주하지 못했습니다. -
예제 #3
"mislav"는 참여자 명단에는 두 명이 있지만, 완주자 명단에는 한 명밖에 없기 때문에 한명은 완주하지 못했습니다.
나의 풀이
function solution(participant, completion) {
let arr1 = participant.sort();
let arr2 = completion.sort();
for (let i = 0; i < arr1.length; i++) {
if (arr1[i] !== arr2[i]) {
return arr1[i];
}
}
}sort 메소드는 정렬 순서를 설정하지 않으면 문자열의 유니코드 코드 포인트를 따라 정렬을 하게된다. 두 배열은 element들이 같고 arr2에서 하나만 빠져있는 상태라 sort로 정렬을 하여 순서를 같게 만들어준 후 반복문을 돌려 서로의 요소들을 비교하여 같지 않을 경우 arr1의 i번째 요소를 리턴하게 하였다. 다른사람의 풀이를 보던 중 하나의 팁을 얻었는데 length 메소드는 매 루프마다 메소드를 실행시키니 length 값을 변수로 선언 후 그 변수를 사용하면 성능이 조금 더 향상된다고 한다.
다른사람의 풀이#1
function solution(participant, completion) {
participant.sort();
completion.sort();
for(let i in participant) {
if(participant[i] !== completion[i]) {
return participant[i];
}
}
}for 반복문을 이용하지 않고
for...in구문을 이용했는데 로직은 나의 풀이와 같지만 배열에 대해for...in구문은 쓰는것은 좋지 않다. 왜냐하면for...in구문은 객체 내의 프로퍼티 속성 중enumerable: true인 모든 프로퍼티를 순회하여 검색하는 용도이기 때문에 적합하지 않다. 최신 브라우저는 배열에 대해for...in구문을 사용해도 오류가 나지 않지만, Old IE의 경우에는 배열 인덱스 외에 검출되는 프로퍼티가 있기 때문에undefined와 같은 오류가 발생한다. 따라서, 배열에 대해서는for...in구문 보다는 for를 사용하거나 ES6의forEach함수를 사용하는 것을 권장한다.
다른사람의 풀이#2
var solution=(_,$)=>_.find(_=>!$[_]--,$.map(_=>$[_]=($[_]|0)+1))정규표현식으로 아주 간결하게 표현한 코드이다. completion 배열을
{ 이름: completion에 등장하는 횟수 }의 형태로 맵핑 후, 그 맵에 participant를 하나씩 넣어 찾아볼 때마다 횟수를 감소시켜서 횟수가 0이 되는 이름을 리턴한다. 다르게 표현하면 이렇게 쓸 수 있다. 정규표현식의 힘은 정말 대단한 것 같다..var solution=(participant,completion)=>participant.find(name=>!completion[name]--,completion.map(name=>completion[name]=(completion[name]|0)+1))
2. JavaScript로 게임 만들기
MDN에 순수 자바스크립트를 이용한 벽돌깨기 게임을 만들어보는 예제가 있길래 한번 만들어 보았다.
gif 파일 용량 때문에 어쩔수 없이 프레임이 좀 떨어지게 만들었는데 상당히 끊겨 보이지만 실제로는 매끄럽게 잘 돌아간다.
이런식으로 각 부분의 기능을 하는 함수를 만들었는데 예제에 있는것과는 조금 다르게 만들었다. 그래봤자 몇 줄만 고친거지만... 공의 발사각, 속도 블럭의 갯수, 점수 표시 방법 정도를 바꾼 것 같다. 중급 정도의 난이도라고 하는데 canvas의 메소드들이 어떤 기능을 하는지 확실하게 알면 다른 게임도 충분히 만들 수 있을 것 같다! 지금은 기능을 조금 뜯어고친것에 만족하고 나중에 더 공부해서 다른 게임을 한번 만들어봐야겠다.
