자바스크립트에서 배열의 길이(length)를 0으로 설정하면 어떻게 될까요?

자바스크립트에서 배열의 length 속성은 단순히 배열의 크기를 확인하는 용도뿐만 아니라, 직접 값을 할당하여 배열을 조작할 수도 있습니다. 이번 글에서는 배열의 길이를 0으로 설정했을 때 어떤 일이 일어나는지 살펴보겠습니다.

예제 배열 준비하기

먼저 다음과 같은 배열 객체가 있다고 가정해 보겠습니다.

var arrayObject = [
    "John",
    "David",
    "Mike"
];

length 속성으로 메모리 비우기

배열의 length 속성에 0을 할당하면 배열의 모든 요소가 제거되고 해당 요소들이 차지하던 메모리까지 정리됩니다. 반대로 특정 숫자를 할당하면 그 크기만큼의 메모리 공간이 새로 할당됩니다.

문법은 다음과 같습니다.

yourArrayObjectName.length = 0; // 메모리 비우기
yourArrayObjectName.length = 4; // 메모리 할당하기

전체 예제 코드

실제 동작을 확인하기 위한 전체 코드는 다음과 같습니다.

var arrayObject = [
    "John",
    "David",
    "Mike"
];
arrayObject.length = 0;
console.log(arrayObject);
arrayObject.length = 5;
for (var i = 0; i < arrayObject.length; i++)
    console.log(arrayObject[i]);

프로그램 실행 방법

위 프로그램을 실행하려면 Node.js 환경에서 다음 명령어를 사용합니다.

node fileName.js

여기서는 파일 이름이 demo277.js라고 가정하겠습니다.

실행 결과

위 프로그램을 실행하면 콘솔에 다음과 같은 결과가 출력됩니다.

PS C:\Users\Amit\javascript-code> node demo277.js
[]
undefined
undefined
undefined
undefined
undefined

결과 분석

출력 결과를 자세히 살펴보면 다음과 같은 흐름을 알 수 있습니다.

1. 배열 비우기: arrayObject.length = 0;을 실행한 후 콘솔에 배열을 출력하면 빈 배열 []이 표시됩니다. 즉, 기존의 "John", "David", "Mike" 세 요소가 모두 제거된 것입니다.

2. 메모리 재할당: 이후 arrayObject.length = 5;로 길이를 5로 늘리면, 배열에는 값이 없는 5개의 빈 슬롯(empty slot)만 생성됩니다. 따라서 for 루프로 각 인덱스에 접근하면 실제 값이 아닌 undefined가 다섯 번 출력됩니다.

정리

배열의 length를 0으로 설정하는 것은 자바스크립트에서 배열을 비우는 가장 간단하고 빠른 방법 중 하나입니다. splice() 메서드나 새로운 빈 배열을 할당하는 방식과 달리 원본 배열 참조를 그대로 유지하면서 내용만 비울 수 있다는 장점이 있습니다. 다만 길이를 다시 늘릴 경우 새로 생긴 슬롯에는 값이 없으므로 undefined가 반환된다는 점을 기억해 두시기 바랍니다.