본문 바로가기
자기개발/TIL

array.from({length:?}...로 줄어드는 배열 만들기

by 금화맘 2023. 7. 15.

오늘도 프로그래머스로 js문법 사용능력을 길렀다.

오늘은 카운트다운을 풀었고

이 문제는 start, end가 10과 3일때 result로 [10,9,8,7,6,5,4,3]인 배열을 반환하게 코드를 만들라는 거였다.

사실 처음엔 for 문으로 만들었다가.. 이상하게 너무 많은 글자가? 나온다고 해서 왜지? 하고 전에 정해진 숫자로 배열만들기 할 때 썻던 array.from({length:})가 생각나서 그걸로 급 선회했다.

var answer = Array.from({length:start-end+1},((v,i)=>i+end)).sort((a,b)=>b-a)

나는 답을 이렇제 제출했고 성공했다.

length부분에는 배열의 길이를 정하는 거니까 손쉽게 사용법을 알 수 있었다.

그런데 역시나 콜백함수에 약하다는 것을 알게 됐다.

(v,i)=>i+end를 처음엔 배열을 만들었던 것 처럼, i+1을 변형해서 i-1로 했다. 그랬더니 답으로 내가 계획했던 것과 달리(처음에 저렇게 쓰면 [10,9,8,7,6,...]이렇게 될줄 알았다) 결과는 [-1, 0, 1, 2, 3, 4, 5, 6] 이렇게 나왔다.

왜 이렇게 나왔을까 고민하다가 v는 value, i는 index라고 생각을 했고, i+1은 첫 시작이 되는 거라 생각해서 1대신 end를 넣어서 만들어봤다. 그랬더니 [3,4,5,6,7,8,9,10]이라는  배열이 나왔다. 그래서 뒤에 곧장 sort로 배열의 큰 숫자부터 반환하는 코드를 넣어서 성공할 수 있었다.

var answer = Array.from({length:start-end+1},((v,i)=>i+end)).reverse()

같은 의미로 이렇게 리버스를 사용해도 된다.

 

다른 사람들은 어떻게 만들었을까 다른 사람들의 풀이를 봤다.

var answer = Array.from(Array(start - end + 1), (_, i) => start - i);

내가 너무 풀고 싶어한 배열을 뒤집는 작업을 하지 않고 처음부터 배열을 만들 때 부터 10,9,...로 만들수 있는 코드로 작성한 글을 봤다.

이 코드를 보고 아.. 문제에서도 start에서 -1씩이랬으니까 라며 문제가 힌트를 줬다는 걸 깨닳을 수 있었다. start-i를 함으로써 배열의 각 요소를 start로 시작해서 줄어드는 배열을 만들 수 있는 거였다.

내 코드는 i+end, 다른 사람의 코드는 start - i로 시작을 뭘로 하냐는 아주 큰 차이가 있었다. 

난 왜 start로 할 생각을 못했을까..?

반성해야 겠다.

 

코드가 돌아가는 원릭 궁금해서 +의 순서가 바뀌어도 똑같이 동작할까 궁금해서  end+i와 i-start를 해봤다. end+i는 i+end와 같이 [3,4,...]로 이어지는 결과가 나왔다면 strart-i와  i-start는 서로 다르게 [10,9...] 와 [-10,-9...-3]이 나왔다. 순서도 중요하단 것을 알 수 있었다.

 

되게 인상깊었던 코드가 있었는데

 var answer = Array(start-end+1).fill(start).map((v,i)=>v-i);

이 코드였다. 이 코드는 array 매소드로 start-end+1의 갯수를 null 값으로 가진 배열을 만들고, start 값인 10으로 start-end+1인 배열의 길이 9개를 채운다 . 그리고 나서 map으로 현재요소 v와 index인 i를 받아 start-i와 같이 작동하는 거였다. array, fill, map을 연결해서 풀 수 있는 것을 보고 이 분 처럼 내가 아는 걸 잘 쓰는 날이 오길 바라게 됐다.

 

 

오늘 배운 것

1. 코드의 순서는 중요하다. 

2. 시작하는 수가 정해져 있다면 그걸로 먼저 코드를 만들어 볼것, 일반적인 통념에 매몰되지 말자.

 

뿌듯한 점

1. array.from을 사용했던 것을 기억해서 이번에도 사용해 본 경함을 획득한 것.

2. 그로인해 다음에도 쓸 수 있는 새로운 지식을 얻은 것