Invalid array length — 배열 길이 오류 원인·해결·예방

Invalid array length — 배열 길이 오류 원인·해결·예방

자바스크립트에서 "RangeError: Invalid array length"가 뜨면, 배열의 길이로 유효하지 않은 값을 줬다는 뜻이다. 배열 길이에는 규칙이 있다. 0 이상의 정수여야 하고, 최댓값(2의 32제곱에서 1을 뺀 값, 약 42억)을 넘을 수 없다. 이 범위를 벗어나는 값, 즉 음수·소수·너무 큰 수를 new Array()에 넣거나 arr.length에 대입하면 이 에러가 난다. 실무에서는 대부분 계산 실수가 원인이다. 끝 값에서 시작 값을 뺀 결과가 음수가 되거나, 나눗셈 결과가 소수가 되거나, 계산이 NaN이 된 값을 그대로 배열 길이로 쓴 경우다. 이 글은 이 에러의 의미, 유효한 배열 길이의 조건, 그리고 길이 검증과 계산 로직 점검을 비롯한 해결법을 정리한다.

Invalid array length

 

이 글의 구성

 

🔎에러 메시지와 배열 길이 규칙

🧩자주 나오는 발생 원인 4가지

⚖️유효 길이 vs 무효 길이

💻재현과 진단

🛠해결 — 길이 검증과 계산 점검

💬자주 묻는 질문 5가지

---

🔎 에러 메시지와 배열 길이 규칙

이 에러는 RangeError로, 값이 허용 범위를 벗어났을 때 나는 종류다. 여기서는 배열 길이가 그 범위를 벗어난 것이다. 자바스크립트에서 배열 길이(length)는 정해진 규칙을 따라야 한다. 첫째, 0 이상이어야 한다(음수 불가). 둘째, 정수여야 한다(소수 불가). 셋째, 최댓값을 넘을 수 없다. 그 최댓값은 2의 32제곱에서 1을 뺀 값으로, 약 42억(4,294,967,295)이다.

 

이 규칙을 어기는 값을 배열 길이로 쓰면 에러가 난다. 대표적으로 new Array(n)에서 n이 잘못됐거나, arr.length = n으로 잘못된 길이를 대입한 경우다. 핵심은 "코드가 이상하다"기보다 "그 자리에 들어간 숫자가 배열 길이로 쓸 수 없는 값이었다"는 것이다. 그래서 그 숫자가 어떻게 계산됐는지를 되짚는 게 진단의 출발점이다. (문구는 엔진마다 조금 다르다. 크롬·파이어폭스는 "Invalid array length", 사파리는 "Array size is not a small enough positive integer"처럼 표시한다.)

핵심 — 길이는 0 이상 정수여야 한다

배열 길이의 조건은 세 가지다. 음수가 아니고, 소수가 아니고, 약 42억을 넘지 않는다. 이 중 하나라도 어기면 이 에러가 난다. 대부분은 계산 결과가 음수·소수·NaN이 된 값을 그대로 길이로 넘긴 경우이니, 그 숫자를 console.log로 찍어 정체를 확인하는 게 첫걸음이다.

---

🧩 자주 나오는 발생 원인 4가지

원인 1 — 음수 길이

가장 흔하다. new Array(-1)이나 arr.length = -3처럼 음수를 길이로 준 경우다. 대개 끝 값에서 시작 값을 뺀 계산(end - start)이 음수가 되어 그대로 넘어간 것이다.

원인 2 — 소수(정수 아님) 길이

new Array(3.5)처럼 소수를 길이로 준 경우다. 나눗셈이나 평균 계산 결과가 딱 떨어지지 않아 소수가 됐는데, 정수로 바꾸지 않고 그대로 배열 길이로 쓴 것이다.

원인 3 — 범위를 넘는 큰 길이

new Array(1e10)처럼 약 42억을 넘는 값을 준 경우다. 큰 수를 곱하거나 잘못된 단위로 계산한 결과가 최댓값을 초과하면 막힌다. 배열 길이의 상한을 넘은 것이다.

원인 4 — NaN·계산 실수로 잘못된 길이

문자열을 숫자로 잘못 다뤄 계산이 NaN이 되거나, undefined가 섞여 결과가 이상해진 값을 길이로 넘긴 경우다. 입력값이 예상과 다를 때 계산이 무너져 잘못된 길이가 만들어진다.

---

⚖️ 유효 길이 vs 무효 길이

어떤 값이 배열 길이로 되고 안 되는지 정리하면 헷갈림이 준다.

값	배열 길이로	이유
0, 5, 100	✓ 유효	0 이상 정수
-1, -10	✗ 무효	음수 불가
3.5, 2.1	✗ 무효	정수만 가능
2^32 이상, NaN	✗ 무효	상한 초과·숫자 아님

정리하면, 0 이상의 정수이면서 약 42억 이하일 때만 유효하다. 음수·소수·상한 초과·NaN은 모두 막힌다. 한 가지 헷갈리기 쉬운 점은 new Array의 인자다. 인자가 숫자 하나면 그건 "길이"로 해석되지만, 인자가 여러 개거나 숫자가 아니면 "요소"로 해석된다. 그래서 new Array(3)은 길이 3인 빈 배열이지만, new Array(1, 2, 3)은 요소가 [1, 2, 3]인 배열이다. 이 차이 때문에 의도와 다른 동작이 나기도 한다.

---

💻 재현과 진단

전형적인 재현이다. 음수나 소수를 배열 길이로 주면 즉시 터진다.

// 음수·소수 길이
new Array(-1);   // ✗ RangeError: Invalid array length
new Array(3.5);  // ✗ RangeError: Invalid array length

// 계산 실수 — end가 start보다 작아 음수
const len = end - start; // 예: 2 - 5 = -3
new Array(len); // ✗ 음수 길이

진단은 배열 길이로 넘어간 그 숫자를 확인하는 것이다. 계산식으로 길이를 만들었다면, 그 결과를 console.log로 찍어 음수·소수·NaN인지 본다. 대개 입력값이 예상과 다르거나 계산 순서가 어긋나 이상한 숫자가 만들어진다.

// ✓ 길이로 쓰기 전 값 확인
console.log(len, Number.isInteger(len), len >= 0);
// 정수·양수인지 한눈에

---

🛠 해결 — 길이 검증과 계산 점검

핵심은 배열 길이로 쓰기 전에 값을 검증하거나 정상 범위로 보정하는 것이다. 그리고 그 값을 만든 계산 로직을 바로잡는다.

// ✓ 음수 방지 + 정수화
const len = Math.max(0, Math.floor(end - start));
new Array(len);

// ✓ 값으로 채우려면 Array.from 또는 fill
const zeros = Array.from({ length: len }, () => 0);
new Array(len).fill(0);

상황별로 정리하면 이렇다. 대부분 "검증 + 계산 점검"으로 풀린다.

상황별 해결 방법

 

01음수 방지 → Math.max(0, n)으로 0 미만을 0으로 보정.

02정수화 → Math.floor·Math.round·Math.trunc로 소수 제거.

03NaN 방지 → 입력값이 숫자인지(Number.isFinite) 확인 후 사용.

04계산 점검 → end < start 같은 역전, 단위·순서 실수 바로잡기.

05값 채우기 → new Array(n).fill()·Array.from({ length: n }) 사용.

정리하면, 길이를 계산으로 만들 때는 그 결과가 "0 이상 정수"임을 보장하는 습관이 중요하다. Math.max(0, Math.floor(n)) 한 줄이면 음수와 소수를 동시에 막을 수 있다. 다만 보정으로 에러만 없애고 끝내지는 말자. 길이가 음수·NaN이 나왔다는 건 계산 어딘가가 틀렸다는 신호이니, 그 계산 자체도 함께 바로잡아야 한다.

---

💬 자주 묻는 질문 5가지

Q1배열 길이 최댓값이 얼마인가요?

2의 32제곱에서 1을 뺀 값, 약 42억(4,294,967,295)입니다. 이보다 큰 값을 길이로 주면 이 에러가 납니다. 다만 실무에서 이 상한을 실제로 넘는 경우는 드물고, 대개는 계산 실수로 큰 수가 만들어진 것이니 계산을 점검하세요.

Q2new Array(5)랑 [5]는 다른가요?

완전히 다릅니다. new Array(5)는 길이가 5인 빈 배열(요소 없음)을 만들고, [5]는 요소 5가 하나 든 배열입니다. new Array에 숫자 하나를 주면 "길이"로 해석되기 때문이죠. 요소 하나짜리 배열을 원하면 [5]나 Array.of(5)를 쓰세요.

Q3계산 결과를 길이로 쓰는데 자꾸 나요.

계산 결과가 음수·소수·NaN이 됐을 가능성이 큽니다. 그 값을 console.log로 찍어 확인하고, Math.max(0, Math.floor(n))으로 0 이상 정수로 보정하세요. 근본적으로는 end - start가 음수가 되는 역전이나 단위 실수 같은 계산 오류를 함께 고쳐야 합니다.

Q4소수 길이는 왜 안 되나요?

배열 인덱스는 정수라, 길이도 정수여야 합니다. 3.5개짜리 배열은 있을 수 없죠. 그래서 소수를 길이로 주면 막힙니다. 나눗셈·평균처럼 소수가 나올 수 있는 계산은 Math.floor·Math.ceil·Math.round로 정수화한 뒤 길이로 쓰세요.

Q5new Array(n).fill()은 뭔가요?

new Array(n)으로 만든 길이 n의 빈 배열을 특정 값으로 채우는 방법입니다. new Array(3).fill(0)은 [0, 0, 0]이 되죠. 빈 배열은 map 등이 건너뛰므로, 값으로 채우려면 fill을 쓰거나 Array.from({ length: n }, ...)을 씁니다. 물론 n이 유효한 길이여야 합니다.

---

📌 결론

"Invalid array length"는 배열 길이로 유효하지 않은 값을 줬을 때 나는 RangeError다. 배열 길이는 0 이상의 정수여야 하고 약 42억을 넘을 수 없는데, 음수·소수·상한 초과·NaN을 주면 막힌다. 대부분 계산 결과가 이상해진 값을 그대로 길이로 넘긴 경우다.

실무 원칙은 다음과 같다.

 

📏 길이 규칙을 안다. 배열 길이는 0 이상 정수이며 약 42억 이하여야 한다. 이 범위를 벗어나면 에러다.

🔢 값을 검증·보정한다. 계산으로 길이를 만들 때 Math.max(0, Math.floor(n))으로 음수와 소수를 함께 막고, 숫자 여부(isFinite)도 확인한다.

🧮 계산을 점검한다. 길이가 음수·NaN이면 계산이 틀렸다는 신호다. end < start 역전, 단위·순서 실수 같은 근본 원인을 함께 고친다.

Invalid array length 체크리스트

 

01배열 길이로 넘긴 값을 console.log로 확인.

02음수·소수·NaN·상한 초과 중 무엇인지 판별.

03Math.max(0, Math.floor(n))으로 0 이상 정수 보정.

04입력값이 숫자인지 Number.isFinite로 확인.

05end < start 역전 등 계산 로직의 근본 오류 점검.

06값 채우기는 new Array(n).fill()·Array.from 사용.

---

본 글은 자바스크립트 RangeError(Invalid array length)의 일반적 원인과 해결 방법을 정리한 자료다. 코드 수정은 영향 범위를 확인한 뒤 신중히 적용한다.

 

#JavaScript #RangeError #Invalidarraylength #배열길이 #자바스크립트에러 #newArray #arraylength #Mathfloor #Arrayfrom #fill #계산오류 #프론트엔드 #JS디버깅 #웹개발 #코딩초보