본문 바로가기
웹 프론트엔드/JavaScript

자바스크립트 - 유사 배열, 연관 배열 이란?

by 번데기 개발자 2018. 6. 11.
반응형

자바스크립트 객체란?


자바 스크립트의 객체의 프로퍼티 명을 키, 프로퍼티의 값을 값이라고 합니다.

객체 리터럴이 다중값 데이터 표현으로써의 객체라고 할 수 있습니다.




자바스크립트의 연관배열



일반적으로 숫자를 key로 값을 뽑을 수 있으면 배열이라고 합니다.

배열은 연속하는 숫자이므로 순서가 있는 값의 모음으로 볼 수 있습니다.



문자열에 한정되지 않고 임의의 타입의 키를 이용하여 키와 값의 모음을 다루는 데이터 구조를 연관 배열이라고 합니다.

연관 배열은 다른말로 맵이나 사전이라고도 부르며 내부 구현에 따라 해시(Hash)라고 부르는 언어도 있습니다.



연관 배열의 용도로는 키로 값을 뽑아내는 조작입니다.

스크립트 계열 언어의 언어기능으로 연관 배열 타입을 제공하고 있습니다.

특히 자바스크립트에서는 객체를 연관 배열로 사용하는 것이 가장 정석이라고 합니다.



따라서 자바스크립트에서는 객체를 연관 배열로 사용하는 경우 객체 리터럴로 생성하는 것이 일반적입니다.





자바스크립트의 유사 배열 객체



자바 스크립트에서는 lengh 프로퍼티를 가진 객체를 유사 배열객체(array-like objects) 라고 부릅니다. => 객체 같은 배열이라는 뜻인가 ㅠㅠ?

예를 들어 일반 객체에 length라는 프로퍼티가 있다고 가정해본다면 그 객체는 유사배열 객체입니다.

이러한 객체의 가장 큰 특징은 객체임에도 불구하고 자바스크립트의 표준 배열 메서드를 사용하는게 가능하다는 점입니다.












위의 코드에서 length 프로퍼티를 지정한 유사 배열 객체인 obj는 배열이 아닙니다.

따라서 push() 메서드를 사용 할 수 없기 때문에 에러가 발생합니다.

하지만 일반 객체가 프로토타입과 apply() 메소드를 이용하면 객체지만 표준 메소드를 사용 하는 것이 가능하게 할 수 있습니다.







위의 코드는 유사배열 객체인 obj에 대해 push 메소드를 사용하여 pub를 추가한 것입니다.

실제 결과를 보면 obj 객체의 1 프로퍼티에 pub이 추가되고 length값은 2로 증가되는 것을 볼 수 있습니다.


이러한 유사배열 객체는 arguments 객체나 jquery 객체가 이러한 형태로 되어 있습니다.






자바 스크립트의 [] 연산자로 프로퍼티 접근 방법 (2가지)




객체의 프로퍼티에 접근하기 위해 사용되는 [] 연산자는 식별자(숫자)와 문자열을 이용하여 프로퍼티의 이름을 표현 할 수 있습니다.

하지만 식별자는 프로그래머가 직접 코딩하여 넣기 때문에 정적입니다.

반면에 문자열을 이용한 표현방법은 실행시간에 동적으로 얼마든지 변경 할 수 있습니다.

이러한 방법으로 객체를 사용할 때 이를 연관 배열(associative array)라고 부릅니다.

이와 관련하여 대응시키다(map) 이라는 용어도 자주 사용합니다.

즉 자바스크립트는 문자열을 임의의 값으로 대응시킨다 라고 표현 할 수도 있습니다.

반응형