본문 바로가기
카테고리 없음

[ JavaScript ] 1부터 n까지의 숫자 배열 만들기

by ウリ김영은 2024. 1. 21.

1. Array.from() 사용

Array.from 이란? mdn문서

순회 가능 또는 유사 배열 객체에서 얕게 복사된 새로운 Array 인스턴스를 생성합니다.(새로운 배열 객체를 생성한다.)

Array.from(arrayLike, mapFn, thisArg)

arrayLike : 배열로 변환할 순회 가능 또는 유사 배열 객체 (필수)
mapFn : 배열의 모든 요소에 대해 호출할 함수
thisArg : mapFn 실행 시에 this 로 사용할 값

Array.from('foo')
// ['f','o','o']

Array.from({length:9}) 
// length가 9인 배열이 생성된다.
// [undefined, undefined, ..., undefined]

Array.from({length:9}, (v, index)=> index + 1 )
// 각 원소마다 index+1을 실행한다. 
// [1,2,3,4,5,6,7,8,9]

배열에 넣어서 사용하고 싶다면 스프레드(전개 연산자)를 사용하면 된다.

[...Array.from({length:4}, (v,index)=>{return (index+1)}),'a','b']
/// [1,2,3,4,'a','b']

2. map() 과 fill() 사용하기

map() 이란? mdn문서

배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환

fill() 이란?mdn문서

배열의 인덱스 범위 내에 있는 모든 요소를 정적값으로 변경합니다. 그리고 수정된 배열을 반환합니다.

fill(value, start, end)

value : 배열을 채울 값입니다. value가 객체인 경우, 배열의 각 슬롯은 해당 객체를 참조합니다.
start : 채우기 시작할 0기반 인덱스로, 정수로 변환됩니다. (-1은 제일 마지막 요소를 의미)
end : 채우기를 끝낼 0 기반 인덱스로, 정수로 변환됩니다. (end까지 채우며, end는 미포함)

const originalArr = [1,2,3,4,5,6]

originalArr.fill(5) //[5,5,5,5,5,5]
originalArr.fill(4,1) //[1,4,4,4,4,4]
originalArr.fill(2,1,4) //[1,2,2,4,5,6]
orighinalArr.fill(4,3,3) //[1,2,3,4,5,6]
originalArr.fill(1,-3,-1) //[1,2,3,1,1,6]
originalArr.fill(4,NaN,NaN) //[1,2,3,4,5,6]
originalArr.fill(4,8,10) //[1,2,3,4,5,6]
Array(6).fill(4) [4,4,4,4,4,4]
originalArr.fill({}) //[{},{},{}]