length 속성

자바스크립트에서 length 속성은 다음과 같은 세 가지 용도로 사용됩니다.

  1. 배열의 길이를 반환
  2. 문자열의 길이를 반환
  3. 유사 배열 객체의 길이를 반환

배열의 길이를 반환

배열에서 length 속성은 배열에 포함된 요소의 개수를 반환합니다.

JavaScript 
const fruits = ["apple", "orange", "banana"];
console.log(fruits.length); // 3

const emptyArr = [];
console.log(emptyArr.length); // 0

배열에서 length 속성에 대한 더 자세한 설명은 자바스크립트 배열 length 속성 - 배열의 길이 확인을 참고하세요.

문자열의 길이를 반환

문자열에서 length 속성은 문자열에 포함된 문자의 개수를 반환합니다.

JavaScript 
const greeting = "환영합니다. 반값습니다!";
console.log(greeting.length); // 13

const emptyStr = "";
console.log(emptyStr.length); // 0

문자열에서 length 속성에 대한 더 자세한 설명은 자바스크립트 문자열 length 속성 - 문자열의 길이 확인을 참고하세요.

유사 배열 객체의 길이를 반환

일부 객체는 배열처럼 인덱스를 통해 접근할 수 있고, length 속성을 가지고 있습니다.

JavaScript 함수의 arguments 객체에서는 매개변수의 개수를 반환합니다. 
function myFunction(a, b, c) {
  console.log(arguments.length);
}

myFunction(); // 0
myFunction(1); // 1
myFunction(1, 2); // 2
myFunction(1, 2, 3); // 3
JavaScript DOM NodeList 객체에서는 리스트의 노드 개수를 반환합니다. 
const elements = document.querySelectorAll("p");
console.log(elements.length); // 요소의 개수
자바스크립트 NodeList 이해하기
JavaScript Array.from() 메서드로 생성한 이터러블(iterable) 객체에서는 이터러블 객체의 요소의 개수를 반환합니다. 
const numbers = [1, 2, 3, 4, 5];
const fromNumbers = Array.from(numbers);

console.log(fromNumbers.length); // 5

참고로 객체 리터럴(Object literal)에서는 length 속성이 없습니다

JavaScript 
const obj = {
    name: "홍길동",
    age: 30,
    address: "서울특별시 서초구 사임당로 123"
};

console.log(obj.length); // undefined
자바스크립트 undefined 값

주의할 점

length 속성은 문자열에서 읽기 전용(immutable)이며, 직접 수정할 수 없습니다.

JavaScript 문자열에서의 예시 
let str = "Hello, World!";
console.log(str.length); // 13

// length 속성을 수정하려고 시도
str.length = 5;

console.log(str.length); // 여전히 13
console.log(str);        // "Hello, World!" 그대로 유지됨

참고문헌

같이 보기