📑 문제

• 배열 내 요소를 5묶음씩 나눔
• 그 중 맨 앞 요소들을 배열에 담아 반환
• 5개가 안되더라도, 묶고 맨 앞 요소를 반환

🤓 나의 풀이

while문으로 30분정도만에 풀었다! +7점 획득! 🥳

function solution(n) {

  const res = [];

  while (n.length !== 0) { 
    res.push(n.splice(0, 5)[0]);
  }

  return res;
}

결과값을 담을 새 배열을 만든다.
인자로 넘겨주고 있는 n배열의 길이가 0이 아닐동안(= 배열의 길이가 0이 될 때까지) while문을 돌려준다.
splice() 메서드를 사용하여 배열 내 요소들을 5개씩 자른다.

splice(시작인덱스, 삭제할갯수, [추가할 요소...])

splice()문법을 따라, 인덱스 0번 요소부터 5개를 잘라냈다.
잘라낸 요소들만 새 배열에 담기게 되고 -> 원본 배열엔 잘라낸 요소들을 제외한 요소들만 남아있게 된다.

splice()는 배열의 기존 요소에 변경을 일으키는 메서드다 (원본 배열에 영향을 준다)
배열은 가변적인 참조 자료형으로, mutable한 특성을 가지고 있는 splice()를 사용하면,
원 배열의 요소들이 실제로 잘라져 없어지고 뒤의 요소들만 원 배열에 남게된다. 👇🏻

const n = ['ellie', 'amy', 'daniel', 'laura', 'lisa', 'marie', 'salva', 'john', 'dan']

console.log(n.splice(0,5)) // [ 'ellie', 'amy', 'daniel', 'laura', 'lisa' ]
console.log(n) // [ 'marie', 'salva', 'john', 'dan' ]

그래서 남게 된 요소들에 splice()가 다시 반복된다.
5묶음 중 맨 앞 요소를 return 해야하므로 n.splice(0, 5)[0]으로 접근하여,
새로 만들어놓은 res에 push() 시킨다.

while문의 조건이 n배열의 길이가 0이 될 때 까지이므로,
원 배열의 요소들이 다 사라질때까지 해당 코드를 반복하여 돌고,
다 잘라내어 없어지면 while 문을 탈출하게 된다.

return은 5개 묶음의 첫 요소들만 담긴 res배열을 반환하게 된다.

return 값 => ['ellie', 'marie']

💫 리팩토링

다 풀어놓고 보니, 원 배열에 영향을 주는 일은 굉장히 위험한 일이므로,
불변(immutable)하게 만들어놓고 사용하는 것이 안전할 것 같다!

function solution(n) {
  
  const arrN = [...n];
  const res = [];
  
  while (arrN.length !== 0) { 
    res.push(arrN.splice(0, 5)[0]);
  }
  
  return res;
}

위와 같이, 원 배열을 새로운 변수에 spread operator를 사용하여 얕은 복사를 하여 사용하자!
(❗️주의: arrN = n은 같은 주소를 참조하게 되므로, 복사가 되지 않습니다!)

👍🏻 제일 간단한 풀이 (다른 사람들의 풀이 참고)

const solution = (names) => names.filter((v, idx) => idx % 5 === 0);

filter()사용법...!
해당 배열에서, index를 5로 나눴을 때 나머지가 0인 index에 해당하는 요소들만 반환하는 것!!
그럼 자동으로 index 0번 5번 10번 15번 ... 의 요소들이 뽑히눈 거시다!

filter()메서드는 애초에 새 배열을 만들어 반환해주기 때문에, 원 배열에 영향을 주지 않는다. 👍🏻