[javascript] 유사 배열

유사 배열

• 배열처럼 인덱스와 length 프로퍼티를 가지고 있지만 실제 배열(Array)은 아닌 객체를 의미

유사 배열의 특징

• 인덱스가 있음 : 마치 배열처럼 0, 1, 2... 숫자 인덱스로 접근 가능 (예: obj [0], obj [1]) 
• length 프로퍼티가 있음 :요소 개수를 나타내는 숫자 프로퍼티가 있음 (예: obj.length)
• 배열 메서드 없음 : 실제 배열이 아니기 때문에, push(), pop(), forEach(), map() 같은 배열 고유 메서드는 사용할 수 없음

---

유사 배열 예

• arguments 객체 (함수 내부에서 사용)
• NodeList (예: document.querySelectorAll()의 반환값)
• HTMLCollection (예: document.getElementsByTagName()의 반환값)

function example() {
  console.log(arguments);         // 유사 배열
  console.log(arguments[0]);      // 접근 가능
  console.log(arguments.length);  // 길이
}
example('a', 'b', 'c');

---

배열 vs 유사 배열

유사 배열과 배열 구분

• Array.isArray()로 배열 여부 확인 가능

const arr = [1, 2, 3];
const obj = {0: 'a', 1: 'b', length: 2};

console.log(Array.isArray(arr));  // true
console.log(Array.isArray(obj));  // false (유사 배열)

배열과 유사 배열 비교

구분	배열(Array)	유사 배열(Array-like)
인덱스 접근	가능	가능
length 프로퍼티	있음	있음
배열 메서드	사용 가능	사용 불가능
생성 방법	[], new Array()	함수 내 arguments, DOM API 반환 객체 등

 

---

유사 배열을 배열로 바꾸는 방법

• Array.from() 사용

const nodeList = document.querySelectorAll('div');
const arr = Array.from(nodeList);  // 이제 배열 메서드 사용 가능
arr.forEach(el => console.log(el));

---