[JS] 자바스크립트 유사 배열(Array-Like Object)

 

 

 

 

 

자바스크립트에서 배열과 유사한 객체를 유사 배열이라고 한다.

 

 

1. 유사 배열이 되기 위한 조건

1-1. 숫자 형태의 indexing이 가능해야 한다.

 

1-2. length 프로퍼티가 있어야 한다.

let arrayLikeObject = { 
   0: 'a', 
   1: 'b', 
   2: 'c', 
   length: 3 
}

 

 

 

2. 배열과 유사 배열의 차이점

▶ 유사 배열은 배열의 메서드를 사용할 수 없다.

유사 배열과 배열의 가장 큰 차이점은 유사배열은 forEach, map, filter, reduce와 같은 메서드를 사용할 수 없다는점이다.( 배열의 메서드: https://cocobi.tistory.com/69 )

 

또한, 유사 배열은 배열이 아니기 때문에 isArray의 값으로 false를 리턴한다

Array.isArray(유사배열) == false

 

<div class="text">My</div>
<div class="text">name</div>
<div class="text">is</div>
<div class="text">Jinny</div>

const arrayLike = document.querySelectorAll('.text');
console.log(arrayLike);

출력결과

 

 

 

 

3. 유사 배열을 배열로 만들기

Array.from() 메서드를 사용하면 유사 배열 객체를  복사해 Array 객체를 만들 수 있다.

const arrayLike = document.querySelectorAll('.text');
Array.from(arrayLike).map((text) => console.log(text));

 

 

 

 

#참고사이트

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/from

https://tc39.es/ecma262/#sec-lengthofarraylike