JavaScript에서 length 속성은 배열(Array)과 문자열(String)에만 적용됩니다. 따라서 일반 객체(Object)에 length 속성을 호출하면 undefined가 반환됩니다.
객체에 length 속성을 사용한 예제
<html>
<body>
<script>
var object = {prop:1, prop:2};
document.write(object.length);
</script>
</body>
</html>출력 결과
undefined
반면, 배열과 문자열에 length 속성을 사용하면 해당 요소나 문자의 개수가 정상적으로 표시됩니다.
문자열과 배열에 length 속성을 사용한 예제
<html>
<body>
<script>
var string = 'hello';
var array = [1,2,3];
var len1 = string.length;
var len2 = array.length;
document.write(len1);
document.write("</br>");
document.write(len2);
</script>
</body>
</html>출력 결과
5 3
그렇다면 객체의 길이(속성 개수)는 어떻게 구할 수 있을까요? JavaScript에서는 Object.keys() 메서드를 활용하면 됩니다. 이 메서드는 객체가 가진 모든 속성(key)들을 배열 형태로 반환하며, 여기에 length 속성을 함께 사용하면 객체에 포함된 속성의 개수, 즉 객체의 길이를 알 수 있습니다.
Object.keys()로 객체 길이를 구하는 예제
<html>
<body>
<script>
var object = {one: 1, two:2, three:3};
document.write(Object.keys(object).length);
</script>
</body>
</html>출력 결과
3
위 예제에서 객체에는 one, two, three라는 세 개의 속성이 존재하므로 Object.keys(object).length의 결과값으로 3이 출력되는 것을 확인할 수 있습니다. 참고로 ES2015(ES6) 이상 환경에서는 Object.values()나 Object.entries() 메서드에 length를 적용하는 방법도 동일하게 활용할 수 있습니다.